modules/yangman-resources/src/main/resources/yangman/views/leftpanel/collections-tab.tpl.html

   1 <md-list class="yangmanModule__requests-list__collections-list"
   2          ng-cloak
   3          ng-controller="RequestsListCtrl as reqList"
   4          ng-init="reqList.init('collections')">
   5
   6     <md-content class="searchBox yangmanModule__left-panel__search" layout="row">
   7
   8         <!-- searching -->
   9         <md-input-container layout="row" md-no-float class="modules-list-search" flex>
  10             <!-- search icon, form, clear button -->
  11             <md-icon class="material-icons">search</md-icon>
  12             <input class="ng-pristine ng-valid ng-touched"
  13                    type="text"
  14                    id="search-collections"
  15                    flex
  16                    placeholder="{{'YANGMAN_SEARCH' | translate}}"
  17                    ng-model="reqList.search"
  18                    aria-invalid="false" />
  19             <md-button aria-label="{{'YANGMAN_CLEAR_SEARCH'| translate}}" flex="none"
  20                        ng-click="reqList.clearFilter()"
  21                        id="search-collections-clear"
  22                        ng-if="reqList.search">
  23                 <md-icon class="material-icons clickable">
  24                     close
  25                 </md-icon>
  26                 <md-tooltip md-direction="bottom">{{'YANGMAN_CLEAR_SEARCH'| translate}}</md-tooltip>
  27             </md-button>
  28             <!-- /search icon, form, clear button -->
  29         </md-input-container>
  30
  31         <!-- sorting -->
  32         <span class="collection-button-container">
  33             <md-button  ng-click="reqList.toggleCollectionsSort()"
  34                         id="sort-collections"
  35                         ng-disabled="reqList.collectionList.collections.length <= 1">
  36                 <md-icon class="material-icons clickable" > sort</md-icon>
  37             </md-button>
  38             <md-tooltip md-direction="bottom">
  39                 {{ ( reqList.collectionsSortAsc ? 'YANGMAN_SORT_COLLECTIONS_DESC' : 'YANGMAN_SORT_COLLECTIONS_ASC' )| translate}}
  40             </md-tooltip>
  41         </span>
  42         <!-- /sorting -->
  43
  44         <!-- save -->
  45         <span class="collection-button-container">
  46             <md-button  ng-click="reqList.showDgSaveReq($event)"
  47                         id="collections-save-selected"
  48                         ng-disabled="reqList.mainList.getSelectedItems(reqList.filterCollReq).length === 0">
  49                 <md-icon class="material-icons clickable">
  50                     save
  51                 </md-icon>
  52             </md-button>
  53             <md-tooltip md-direction="bottom">{{'YANGMAN_REQS_SAVE_TO_COL'| translate}}</md-tooltip>
  54         </span>
  55         <!-- /save -->
  56
  57         <!-- importing -->
  58         <span class="collection-button-container">
  59             <input type="file" accept=".json" id="importCollection" on-read-file="reqList.readCollectionFromFile($fileContent)">
  60             <md-button id="import-collection-button">
  61                 <label for="importCollection">
  62                     <md-icon class="material-icons clickable" >
  63                         file_upload
  64                     </md-icon>
  65                 </label>
  66             </md-button>
  67             <md-tooltip md-direction="bottom">{{'YANGMAN_IMPORT_COLLECTION'| translate}}</md-tooltip>
  68         </span>
  69         <!-- /importing -->
  70
  71         <md-menu layout-align="center start">
  72             <md-button ng-disabled="!reqList.mainList.list.length" aria-label="menu" id="collections-delete-menu" ng-click="$mdOpenMenu()">
  73                 <md-icon class="material-icons clickable"> delete</md-icon>
  74                 <md-tooltip md-direction="bottom">{{'YANGMAN_DELETE_OPTIONS' | translate}}</md-tooltip>
  75             </md-button>
  76             <md-menu-content>
  77                 <!-- delete selected -->
  78                 <md-menu-item>
  79                     <md-button aria-label="{{'YANGMAN_REQS_DELETE'| translate}}"
  80                                id="collections-delete-selected"
  81                                ng-click="reqList.showDgDeleteRequests($event)"
  82                                ng-disabled="reqList.mainList.getSelectedItems(reqList.filterCollReq).length === 0">
  83                         <md-icon class="material-icons clickable">
  84                             delete
  85                         </md-icon>
  86                         {{'YANGMAN_REQS_DELETE'| translate}}
  87                     </md-button>
  88                 </md-menu-item>
  89                 <!-- / delete selected -->
  90                 <!-- clear collections -->
  91                 <md-menu-item>
  92                     <md-button aria-label="{{'YANGMAN_DELETE_COLLECTIONS' | translate}}"
  93                                id="collections-delete-all"
  94                                ng-click="reqList.clearCollectionList($event)">
  95                         <md-icon class="material-icons clickable">
  96                             delete_forever
  97                         </md-icon>
  98                         {{'YANGMAN_DELETE_COLLECTIONS' | translate}}
  99                     </md-button>
 100                 </md-menu-item>
 101                 <!-- / clear history -->
 102             </md-menu-content>
 103         </md-menu>
 104         <!-- / menu for deleting and clearing -->
 105
 106         <!-- menu for selecting and deselecting-->
 107         <md-menu layout-align="center start">
 108             <md-button ng-disabled="( !reqList.mainList.list.length)" aria-label="menu" id="collections-select-menu" ng-click="$mdOpenMenu()">
 109                 <md-icon class="material-icons clickable">
 110                     playlist_add_check
 111                 </md-icon>
 112                 <md-tooltip md-direction="bottom">{{'YANGMAN_SELECT_OPTIONS' | translate}}</md-tooltip>
 113             </md-button>
 114             <md-menu-content>
 115                 <!-- select all -->
 116                 <md-menu-item>
 117                     <md-button aria-label="{{'YANGMAN_SELECT_ALL' | translate}}"
 118                                id="collections-select-all"
 119                                ng-click="reqList.selectAllFilteredRequests()">
 120                         <md-icon class="material-icons clickable">
 121                             done
 122                         </md-icon>
 123                         {{'YANGMAN_SELECT_ALL' | translate}}
 124                     </md-button>
 125                 </md-menu-item>
 126                 <!-- /select all -->
 127                 <!-- deselect all -->
 128                 <md-menu-item>
 129                     <md-button aria-label="{{'YANGMAN_DESELECT_ALL' | translate}}"
 130                                ng-click="reqList.deselectAllFilteredRequests()"
 131                                id="collections-deselect-all"
 132                                ng-disabled="reqList.mainList.getSelectedItems(reqList.filterCollReq).length === 0">
 133                         <md-icon class="material-icons clickable">
 134                             close
 135                         </md-icon>
 136                         {{'YANGMAN_DESELECT_ALL' | translate}}
 137                     </md-button>
 138                 </md-menu-item>
 139                 <!-- / deselect all -->
 140             </md-menu-content>
 141         </md-menu>
 142         <!-- / menu for selecting and deselecting -->
 143     </md-content>
 144
 145     <md-divider></md-divider>
 146
 147     <!-- collection list -->
 148     <md-content class="scrollableY">
 149
 150         <div ng-repeat="collection in reqList.mainList.collections | filter: reqList.filterCol | orderBy: (reqList.collectionsSortAsc ? '' : '-')+'name' track by $index" ng-init="collectionIndex = $index">
 151
 152             <div layout="row">
 153
 154                 <md-list-item class="yangmanModule__requests-list__collection"
 155                               flex
 156                               id="collection-{{$index}}"
 157                               ng-class="{'expanded' : collection.expanded, 'selected': collection.expanded}"
 158                               ng-click="collection.toggleExpanded()">
 159
 160                     <div layout="row">
 161                         <md-icon md-font-set="material-icons" class="top-icon">
 162                             folder_open
 163                         </md-icon>
 164                         <div layout="column">
 165
 166                             <p flex>
 167                             <span md-highlight-text="reqList.search" id="collection-{{$index}}-name" md-highlight-flags="i">
 168                                 {{collection.name}}
 169                             </span><br />
 170                             <span class="desc">
 171                                 <span class="desc" ng-if="reqList.search && !reqList.filterColName(collection)">{{'YANGMAN_MATCHING'| translate}} {{reqList.colMatchingReqsCount(collection)}} / </span>
 172                                 {{collection.data.length}} {{(collection.data.length>1 ? 'YANGMAN_COLLECTION_REQUESTS' : 'YANGMAN_COLLECTION_REQUEST')| translate}}
 173                             </span>
 174                             </p>
 175                         </div>
 176                     </div>
 177
 178                 </md-list-item>
 179                 <md-menu class="yangmanModule__requests-list__group__collectionMenu"
 180                          id="collection-menu-{{$index}}"
 181                          md-offset="35 15"
 182                          layout-align="center start">
 183                     <md-button aria-label="menu" class="md-primary" ng-click="$mdOpenMenu()">
 184                         <i class="material-icons">menu</i>
 185                     </md-button>
 186                     <md-menu-content class="reqMenu">
 187                         <md-menu-item>
 188                             <md-button aria-label="Edit collection"
 189                                        id="collection-menu-{{$index}}-edit"
 190                                        ng-click="reqList.showDgEditCollection($event, collection, false)">
 191                                 <i class="material-icons">mode_edit</i>
 192                                 {{'YANGMAN_COLLECTION_EDIT'| translate}}
 193                             </md-button>
 194                         </md-menu-item>
 195                         <md-menu-item>
 196                             <md-button aria-label="{{'YANGMAN_COLLECTION_DUPLICATE'| translate}}"
 197                                        id="collection-menu-{{$index}}-duplicate"
 198                                        ng-click="reqList.showDgEditCollection($event, collection, true)">
 199                                 <i class="material-icons">control_point_duplicate</i>
 200                                 {{'YANGMAN_COLLECTION_DUPLICATE'| translate}}
 201                             </md-button>
 202                         </md-menu-item>
 203                         <md-menu-item>
 204                             <md-button aria-label="{{'YANGMAN_COLLECTION_DOWNLOAD'| translate}}"
 205                                        id="collection-menu-{{$index}}-download"
 206                                        ng-click="reqList.downloadCollection(collection)">
 207                                 <i class="material-icons">file_download</i>
 208                                 {{'YANGMAN_COLLECTION_DOWNLOAD'| translate}}
 209                             </md-button>
 210                         </md-menu-item>
 211                         <md-menu-item>
 212                             <md-button aria-label="{{'YANGMAN_COLLECTION_DELETE'| translate}}"
 213                                        id="collection-menu-{{$index}}-delete"
 214                                        ng-click="reqList.showDgDeleteCollection($event, collection)">
 215                                 <i class="material-icons">delete</i>
 216                                 {{'YANGMAN_COLLECTION_DELETE'| translate}}
 217                             </md-button>
 218                         </md-menu-item>
 219                     </md-menu-content>
 220                 </md-menu>
 221             </div>
 222
 223
 224             <md-list ng-show="collection.expanded" class="yangmanModule__requests-list__collection__requests">
 225                 <div ng-repeat="request in collection.data | filter: reqList.filterReq track by $index"
 226                      layout="row"
 227                      ng-init="itemId='collection-request-'+collectionIndex+'-'+$index"
 228                      class="yangmanModule__requests-list__item-container"
 229                      ng-include src="globalViewPath + 'leftpanel/request-item.tpl.html'">
 230                 </div>
 231             </md-list>
 232             <md-divider></md-divider>
 233
 234         </div>
 235     </md-content>
 236
 237 </md-list>