Motion >> Repos - motion-next.git/blob

   1 <md-dialog class="compose-dialog" aria-label="New Message">
   2   <form class="md-inline-form" name="composeForm" novalidate>
   3     <md-toolbar class="md-background-bg">
   4       <div
   5         class="md-toolbar-tools"
   6         layout="row"
   7         layout-align="space-between center"
   8       >
   9         <div layout="row">
  10           <md-button
  11             ng-if="!vm.secret"
  12             ng-click="vm.send()"
  13             class="md-raised md-blue-bg white-fg"
  14             aria-label="Send message"
  15           >
  16             <span translate="SMS.SEND">SEND</span>
  17           </md-button>
  18           <md-button
  19             ng-if="vm.secret"
  20             ng-click="vm.addNote()"
  21             class="md-raised md-blue-bg white-fg"
  22             aria-label="Add note"
  23           >
  24             <span translate="SMS.ADD_NOTE">Add note</span>
  25           </md-button>
  26         </div>
  27         <span ng-if="!vm.secret" class="title">{{vm.message.from}}</span>
  28         <md-button
  29           class="md-icon-button"
  30           ng-click="vm.closeDialog()"
  31           aria-label="Close dialog"
  32           tranlate
  33           translate-aria-label="SMS.CLOSE_DIALOG"
  34         >
  35           <md-icon md-font-icon="icon-close"></md-icon>
  36         </md-button>
  37       </div>
  38     </md-toolbar>
  39
  40     <md-dialog-content ms-scroll>
  41       <div class="error-list">
  42         <div
  43           ng-repeat="error in vm.errors"
  44           class="error"
  45           layout="row"
  46           layout-align="space-between center"
  47         >
  48           <div>
  49             <span class="message">{{error.message}}</span>
  50             <span class="type">({{error.type}})</span>
  51           </div>
  52           <md-button class="md-icon-button">
  53             <md-icon
  54               md-font-icon="icon-alert-box"
  55               aria-label="alert error"
  56               class="s16"
  57             ></md-icon>
  58           </md-button>
  59         </div>
  60       </div>
  61
  62       <md-input-container ng-if="!vm.secret" class="md-block to">
  63         <label translate="SMS.TO">To</label>
  64         <md-chips
  65           name="to"
  66           ng-model="vm.message.to"
  67           md-transform-chip="vm.transformContact($chip)"
  68           md-separator-keys="vm.separatorKeys"
  69           md-require-match="false"
  70           md-max-chips="1"
  71           required
  72         >
  73           <md-autocomplete
  74             md-search-text="vm.searchTo"
  75             md-items="contact in vm.contactSearch(vm.searchTo)"
  76             md-item-text="contact.mobile"
  77             md-min-length="3"
  78           >
  79             <md-item-template>
  80               <span>{{ vm.getContact(contact) }}</span>
  81             </md-item-template>
  82           </md-autocomplete>
  83         </md-chips>
  84         <div ng-messages="composeForm.to.$error" role="alert">
  85           <div ng-message="required">
  86             <span translate="SMS.ERRORS.TO_REQUIRED">To field is required</span>
  87           </div>
  88         </div>
  89       </md-input-container>
  90
  91       <!-- msEmojyArea directive -->
  92       <ms-emoji-area
  93         on-reply="vm.reply(event, body)"
  94         ctrl-methods="vm.ctrlMethods"
  95         ng-model="vm.message.body"
  96         placeholder="'SMS.INSERT_MESSAGE_HERE'"
  97       ></ms-emoji-area>
  98       <!-- / msEmojyArea directive -->
  99
 100       <md-autocomplete
 101         ng-if="!vm.secret"
 102         class="padding-top-5"
 103         md-selected-item="vm.selectedItem"
 104         md-search-text="vm.searchText"
 105         md-selected-item-change="vm.selectedItemChange(item)"
 106         md-items="item in vm.searchTextChange(vm.searchText)"
 107         md-item-text="item.value"
 108         md-min-length="1"
 109         md-floating-label="{{ 'SMS.CANNED_ANSWER_SEARCH' | translate}}"
 110         class="input-show-hide no-container-margin"
 111       >
 112         <md-item-template>
 113           <md-icon
 114             ng-if="!item.SmsAccountId"
 115             md-font-icon="icon-earth"
 116             aria-label="alert sms"
 117             class="s16"
 118           ></md-icon>
 119           <md-icon
 120             ng-if="item.SmsAccountId"
 121             md-font-icon="icon-message-text"
 122             aria-label="alert sms"
 123             class="s16 orange-fg"
 124           ></md-icon>
 125           <span md-highlight-text="vm.searchText" md-highlight-flags="^i"
 126             >{{item.key}} - {{item.value}}</span
 127           >
 128         </md-item-template>
 129
 130         <md-not-found>
 131           <span translate="SMS.CANNED_ANSWER_NOT_FOUND"
 132             >No canned answers were found</span
 133           >
 134         </md-not-found>
 135       </md-autocomplete>
 136     </md-dialog-content>
 137   </form>
 138 </md-dialog>