public/templates/core/directives/ms-shortcuts/ms-shortcuts.html/ms-shortcuts.html

   1 <div
   2   class="shortcuts-container"
   3   layout="row"
   4   layout-align="space-between center"
   5   flex
   6   ng-class="{'mobile-bar-active': MsShortcuts.mobileBarActive}"
   7 >
   8   <div
   9     class="flex-noshrink"
  10     layout="row"
  11     layout-align="start center"
  12     flex
  13     ng-if="MsShortcuts.shortcuts.length > 0"
  14   >
  15     <div
  16       class="shortcuts hide show-gt-xs"
  17       layout="row"
  18       layout-align="start center"
  19       ms-scroll
  20       ng-sortable="MsShortcuts.sortableOptions"
  21     >
  22       <div
  23         ng-repeat="shortcut in MsShortcuts.shortcuts"
  24         layout="row"
  25         layout-align="center center"
  26       >
  27         <md-button
  28           class="md-icon-button shortcut"
  29           aria-label="{{shortcut.title}}"
  30           ui-sref="{{shortcut.uisref}}"
  31         >
  32           <md-icon
  33             ng-if="shortcut.icon"
  34             md-font-icon="{{shortcut.icon}}"
  35             class="icon s24"
  36           ></md-icon>
  37           <div ng-if="!shortcut.icon" class="first-letter">
  38             {{shortcut.title.charAt(0)}}
  39           </div>
  40           <md-tooltip md-direction="bottom">{{shortcut.title}}</md-tooltip>
  41         </md-button>
  42       </div>
  43     </div>
  44
  45     <!-- <md-menu md-offset="8 56" class="shortcut-menu hide show-gt-xs">
  46             <md-button class="md-icon-button add-shortcut-button" aria-label="Add shortcut"
  47                        ng-click="$mdMenu.open($event)">
  48                 <md-icon md-menu-origin md-font-icon="icon-star" class="icon amber-600-fg s24"></md-icon>
  49                 <md-tooltip md-direction="bottom">Click to add/remove shortcut</md-tooltip>
  50             </md-button>
  51
  52             <md-menu-content>
  53                 <div id="ms-shortcut-add-menu">
  54                     <div class="shortcut-search" layout="row" layout-align="start center">
  55                         <div class="search-icon" layout="row" layout-align="center center"
  56                              ng-if="!MsShortcuts.resultsLoading">
  57                             <md-icon md-menu-align-target md-font-icon="icon-magnify" class="icon s24"></md-icon>
  58                         </div>
  59                         <div class="shortcut-loader" layout="row" layout-align="center center"
  60                              ng-if="MsShortcuts.resultsLoading">
  61                             <md-progress-circular class="md-accent" md-diameter="20" md-mode="indeterminate">
  62                             </md-progress-circular>
  63                         </div>
  64
  65                         <input type="text" placeholder="Search" flex
  66                                ng-model="MsShortcuts.query"
  67                                ng-model-options="MsShortcuts.queryOptions"
  68                                ng-keydown="MsShortcuts.handleKeydown($event)">
  69                     </div>
  70
  71                     <div class="results" ng-if="MsShortcuts.results" ms-scroll>
  72                         <div class="no-results" ng-if="MsShortcuts.results.length === 0">No Results!</div>
  73
  74                         <div class="result" ng-repeat="result in MsShortcuts.results"
  75                              ng-click="MsShortcuts.handleResultClick(result)"
  76                              ng-mouseenter="MsShortcuts.handleMouseenter($index)"
  77                              ng-mousedown="MsShortcuts.absorbEvent($event)"
  78                              ng-class="{'selected': $index == MsShortcuts.selectedResultIndex}"
  79                              md-prevent-menu-close="md-prevent-menu-close"
  80                              md-ink-ripple>
  81                             <div layout="row" layout-align="start space-between">
  82                                 <div layout="row" layout-align="start center" flex>
  83                                     <div class="icon icon-container" layout="row" layout-align="center center">
  84                                         <i ng-if="result.icon" class="{{result.icon}}"></i>
  85                                         <div ng-if="!result.icon" class="square md-accent-bg"></div>
  86                                     </div>
  87                                     <div>
  88                                         <div class="title">{{result.title}}</div>
  89                                     </div>
  90                                 </div>
  91                                 <md-icon md-font-icon="icon-pin" class="icon s18"
  92                                          ng-class="{'fade-text': !result.hasShortcut}"></md-icon>
  93                             </div>
  94                         </div>
  95                     </div>
  96                 </div>
  97             </md-menu-content>
  98         </md-menu> -->
  99   </div>
 100
 101   <md-button
 102     class="md-icon-button toggle-mobile-menu hide-gt-xs"
 103     aria-label="Add shortcut"
 104     ng-click="MsShortcuts.toggleMobileBar()"
 105   >
 106     <md-icon
 107       md-menu-origin
 108       md-font-icon="icon-star"
 109       class="icon amber-600-fg s24"
 110       ng-hide="MsShortcuts.mobileBarActive"
 111     ></md-icon>
 112     <md-icon
 113       md-menu-origin
 114       md-font-icon="icon-close"
 115       class="icon s24"
 116       ng-hide="!MsShortcuts.mobileBarActive"
 117     ></md-icon>
 118   </md-button>
 119 </div>