public/snippets/tvox/answer.html

   1 <!DOCTYPE html>
   2
   3 <head>
   4     <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
   5     <link rel="stylesheet" href="css/angular-material.min.css">
   6     <link rel="stylesheet" href="css/style.css">
   7 </head>
   8
   9 <body ng-app="AnswerApp">
  10     <div ng-controller="AnswerController" layout="row" layout-fill>
  11         <div ng-if="error_message!=''">{{error_message}}</div>
  12         <div ng-if="error_message==''" layout="column" layout-fill>
  13             <div flex="1">
  14                 <img width=100 layout-align="center" layout="row" src="{{logo}}">
  15                 <br>
  16             </div>
  17             <md-content flex="grow" style="overflow-y:auto;padding:10px" ng-if="!interactionClosed">
  18                 <div ng-repeat="message in messages.rows" class="message">
  19                     <div ng-if="message.direction=='in'" layout="row" layout-align="start">
  20                         <div style="display:inline-block">
  21                             <span class="message-data-name">{{contactName}}</span>
  22                             <span class="message-data-time">{{message.createdAt.substring(11,16)}}</span>
  23                             <div class="user-message" ng-bind-html="message.body">
  24                             </div>
  25                         </div>
  26                     </div>
  27                     <div ng-if="message.direction=='out'" layout="row" layout-align="end">
  28                         <div style="display:inline-block">
  29                             <span class="message-data-time">{{message.createdAt.substring(11,16)}}</span>
  30                             <div class="agent-message" ng-bind-html="message.body">
  31                             </div>
  32                         </div>
  33                     </div>
  34                 </div>
  35             </md-content>
  36             <div layout="row" flex="1" layout-align="start center" ng-if="!interactionClosed" class="block-footer">
  37                 <md-input-container style="width:100%" class="md-block">
  38                     <label>Post your message</label>
  39                     <textarea ng-model="text.content" rows="2" ng-keypress="keyPress($event)"
  40                         md-select-on-focus></textarea>
  41                 </md-input-container>
  42                 <md-button ng-click="send()" class="md-raised md-primary">Send</md-button>
  43                 <md-button aria-label="attachment" flow-btn
  44                     flow-name="ngFlow.flow" flow-files-submitted="upload()" flow-init="ngFlowOptions"
  45                     class="md-raised md-primary"
  46                     flow-file-added="fileAdded($file)" flow-file-success="fileSuccess($file, $message)">Attach</md-button>
  47             </div>
  48             <div ng-if="interactionClosed">
  49                 <md-input-container class="md-block">
  50                     <label>Disposition</label>
  51                     <md-select name="disposition" ng-model="dispo.firstLevelDisposition"
  52                         ng-change="onDispositionChange('first')" required>
  53                         <md-option ng-value="null" ng-if="!dispo.mandatoryDisposition">NONE</md-option>
  54                         <md-option ng-value="disposition"
  55                             ng-repeat="disposition in dispositions | filter: { level: 'first' } : true">
  56                             {{ disposition.name }}</md-option>
  57                     </md-select>
  58                     <div ng-messages="dispositionForm.disposition.$error" ng-show="dispositionForm.disposition.$touched"
  59                         role="alert">
  60                         <div ng-message="required">
  61                             <span>Disposition field is required</span>
  62                         </div>
  63                     </div>
  64                 </md-input-container>
  65                 <div ng-if="dispo.firstLevelDisposition && dispo.anySecondLevelDisposition" layout="row"
  66                     layout-align="start center">
  67                     <md-input-container class="md-block" flex>
  68                         <label>Second Level Disposition</label>
  69                         <md-select name="secondLevelDisposition" ng-model="dispo.secondLevelDisposition"
  70                             ng-change="onDispositionChange('second')">
  71                             <md-option ng-value="disposition"
  72                                 ng-repeat="disposition in dispositions | filter: { level: 'second', ParentId: dispo.firstLevelDisposition.id } : true">
  73                                 {{ disposition.name }}</md-option>
  74                         </md-select>
  75                     </md-input-container>
  76                     <md-button ng-if="dispo.secondLevelDisposition" ng-click="clearDispositionSelection('second')"
  77                         class="md-icon-button">
  78                         <md-icon md-font-icon="icon-cancel" aria-label="Clear second level disposition selection">
  79                         </md-icon>
  80                     </md-button>
  81                 </div>
  82                 <div ng-if="dispo.secondLevelDisposition && dispo.anyThirdLevelDisposition" layout="row"
  83                     layout-align="start center">
  84                     <md-input-container class="md-block" flex>
  85                         <label>Third Level Disposition</label>
  86                         <md-select name="thirdLevelDisposition" ng-model="dispo.thirdLevelDisposition">
  87                             <md-option ng-value="disposition"
  88                                 ng-repeat="disposition in dispositions | filter: { level: 'third', ParentId: dispo.secondLevelDisposition.id } : true"
  89                                 ng-disabled="disposition.canSelect === false">{{ disposition.name }}</md-option>
  90                         </md-select>
  91                     </md-input-container>
  92                     <md-button ng-if="dispo.thirdLevelDisposition" ng-click="clearDispositionSelection('third')"
  93                         class="md-icon-button">
  94                         <md-icon md-font-icon="icon-cancel" aria-label="Clear third level disposition selection">
  95                         </md-icon>
  96                     </md-button>
  97                 </div>
  98
  99                 <md-input-container class="md-block">
 100                     <label>Note</label>
 101                     <textarea ng-model="dispo.note" md-maxlength="255" max-rows="5" autofocus></textarea>
 102                     <div layout="row" layout-align="center center"></div>
 103                         <md-button class="md-raised md-primary" ng-click="saveDisposition()">Save disposition</md-button>
 104                     </div>
 105                 </md-input-container>
 106
 107                 <!--
 108                 <div class="error-list">
 109                     <div ng-repeat="error in errors" class="error" layout="row" layout-align="space-between center">
 110                         <div>
 111                             <span class="message">{{error.message}}</span>
 112                             <span class="type">({{error.type}})</span>
 113                         </div>
 114                         <md-button class="md-icon-button">
 115                             <md-icon md-font-icon="icon-alert-box" aria-label="alert error" class="s16"></md-icon>
 116                         </md-button>
 117                     </div>
 118                 </div>
 119                 -->
 120             </div>
 121         </div>
 122     </div>
 123 </body>
 124
 125 </html>
 126 <script src="js/angular.min.js"></script>
 127 <script src="js/angular-animate.min.js"></script>
 128 <script src="js/angular-aria.min.js"></script>
 129 <script src="js/angular-messages.min.js"></script>
 130 <script src="js/angular-material.min.js"></script>
 131 <script src="js/angular-sanitize.min.js"></script>
 132 <script src="js/angular-cookies.min.js"></script>
 133 <script src="js/ng-flow-standalone.min.js"></script>
 134 <script type="text/javascript" src="/socket.io/socket.io.js"></script>
 135 <script src="js/angular-resource.js"></script>
 136 <script src="js/index.socket.js"></script>
 137 <script src="js/lodash.min.js"></script>
 138 <script src="js/tvox_integration.js"></script>
 139 <script type="text/javascript" src="answer.controller.js"></script>