snippets/chat_v3.0.0-alpha.2/templates/closing/index.tpl.html/index.tpl.html

   1 <!-- CHAT CONTENT -->
   2 <md-content class="chat-online">
   3   <!-- CHAT ERROR -->
   4   <div
   5     class="chat-error"
   6     ng-repeat="error in vm.errors"
   7     layout="row"
   8     layout-margin
   9   >
  10     <i class="mdi mdi-alert mdi-24px mdi-light"></i>
  11     <md-tooltip md-direction="top"
  12       >{{error.message || 'Service temporarily unavailable.'}}</md-tooltip
  13     >
  14     <span class="chat-error-message"
  15       >{{error.message || 'Service temporarily unavailable.'}}</span
  16     >
  17   </div>
  18   <!-- CHAT ERROR -->
  19
  20   <md-content layout="row" layout-align="center end">
  21     <span
  22       ng-bind-html="settings.closingMessage | toTrusted"
  23       ng-style="{'font-size': '{{settings.fontSize}}px'}"
  24     ></span>
  25   </md-content>
  26
  27   <form
  28     name="vm.userForm"
  29     layout="column"
  30     ng-style="{'font-size': '{{settings.fontSize}}px'}"
  31     novalidate
  32   >
  33     <md-input-container
  34       ng-if="settings.enableRating"
  35       ng-switch="settings.ratingType"
  36       class="md-block"
  37       style="margin: 0px; padding: 10px 0px 5px 0px"
  38       md-no-float
  39     >
  40       <!-- START thumb rating -->
  41       <md-radio-group
  42         name="ratingValue"
  43         ng-switch-when="thumb"
  44         ng-model="vm.form.ratingValue"
  45         ng-change="vm.upColor = vm.form.ratingValue ? 'green' : null; vm.downColor = !vm.form.ratingValue ? 'red' : null;"
  46         layout="row"
  47         layout-align="center center"
  48       >
  49         <md-radio-button ng-value="1" class="thumb">
  50           <div class="{{vm.upColor}}">
  51             <i class="mdi mdi-48px mdi-thumb-up-outline"></i>
  52           </div>
  53         </md-radio-button>
  54         <md-radio-button ng-value="0" class="thumb">
  55           <div class="{{vm.downColor}}">
  56             <i class="mdi mdi-48px mdi-thumb-down-outline"></i>
  57           </div>
  58         </md-radio-button>
  59       </md-radio-group>
  60       <!-- END thumb rating -->
  61
  62       <!-- START star rating -->
  63       <div ng-switch-when="star" layout="row" layout-align="center center">
  64         <ng-rate-it
  65           name="ratingValue"
  66           ng-model="vm.form.ratingValue"
  67           min="0"
  68           max="settings.ratingStarsNumber"
  69           step="1"
  70           resetable="false"
  71         ></ng-rate-it>
  72       </div>
  73       <!-- END star rating -->
  74     </md-input-container>
  75
  76     <md-input-container
  77       ng-if="settings.enableFeedback"
  78       class="md-block"
  79       style="margin: 0px; padding: 0px 0px 10px 0px"
  80       md-no-float
  81     >
  82       <!-- START textarea -->
  83       <span style="padding: 5px 0px 5px 0px"
  84         ><br /><br /><br />{{settings.feedbackTitle}}</span
  85       >
  86       <textarea
  87         name="message"
  88         ng-model="vm.form.ratingMessage"
  89         md-maxlength="150"
  90         rows="3"
  91       ></textarea>
  92       <!-- END textarea -->
  93     </md-input-container>
  94
  95     <md-input-container
  96       ng-if="settings.forwardTranscript"
  97       class="md-block"
  98       style="margin: 0px; padding: 0px 0px 10px 0px"
  99       md-no-float
 100     >
 101       <span
 102         ng-if="settings.forwardTranscriptMessage"
 103         style="padding: 5px 0px 5px 0px"
 104         >{{settings.forwardTranscriptMessage}}</span
 105       >
 106       <span
 107         ng-if="!settings.forwardTranscriptMessage"
 108         style="padding: 5px 0px 5px 0px"
 109         >Email</span
 110       >
 111       <!-- START email -->
 112       <input
 113         type="email"
 114         name="mailTranscript"
 115         ng-model="vm.form.mailTranscript"
 116         placeholder="email"
 117       />
 118       <div
 119         ng-messages="vm.userForm['mailTranscript'].$error"
 120         ng-show="vm.userForm['mailTranscript'].$touched"
 121         role="alert"
 122       >
 123         <div ng-message="email">
 124           <span>Email must be a valid e-mail address</span>
 125         </div>
 126       </div>
 127       <!-- END email -->
 128     </md-input-container>
 129
 130     <div layout="row" layout-align="center center">
 131       <md-button
 132         title="{{settings.closingMessageButton}}"
 133         class="md-raised"
 134         ng-if="settings.enableRating || settings.enableFeedback || settings.forwardTranscript"
 135         ng-click="vm.submit()"
 136         ng-disabled="vm.userForm.$invalid || loading"
 137         ng-style="{'background-color': '{{settings.color_button}}', 'color': '{{settings.textColor}}'}"
 138       >
 139         {{settings.closingMessageButton}}
 140       </md-button>
 141       <md-button
 142         title="{{settings.skipMessageButton}}"
 143         class="md-raised"
 144         ng-style="{'background-color': '{{settings.color_button}}', 'color': '{{settings.textColor}}'}"
 145         ng-click="vm.skip()"
 146       >
 147         {{settings.skipMessageButton}}
 148       </md-button>
 149     </div>
 150   </form>
 151
 152   <md-content layout="row" layout-align="center end">
 153     <span
 154       ng-bind-html="(settings.custom && !settings.defaultWhiteLabel) ? settings.whiteLabel : 'Powered By XCALLY' | toTrusted"
 155       ng-style="{'font-size': '{{settings.fontSize}}px'}"
 156     ></span>
 157   </md-content>
 158 </md-content>
 159 <!-- / CHAT CONTENT -->