@c8y/ng1-modules 1017.0.7 → 1017.0.9

package/administration-deviceUsers/views/list.html

@@ -168,6 +168,7 @@
               type="button"
               uib-dropdown-toggle
               ng-click="::$event.stopPropagation()"
+              aria-haspopup="true"
             >
               <i c8y-icon="ellipsis-v"></i>
             </button>

package/alarmsEventsExplorer/alarmsEventsTimelinesConfig/alarmsEventsTimelinesConfig.html

@@ -72,6 +72,7 @@
             type="button"
             class="dropdown-toggle c8y-dropdown"
             uib-dropdown-toggle
+            aria-haspopup="true"
           >
             <i c8y-icon="ellipsis-v"></i>
           </button>

package/app-status/app-events/app-events.html

@@ -2,7 +2,6 @@
   filters="vm.filter"
   realtime="vm.realtime"
   hide-header-actions="true"
-  refresh-loading='vm.refreshLoading'
-  hide-device='vm.hideDevice'>
-</c8y-event-list>
-
+  refresh-loading="vm.refreshLoading"
+  hide-device="vm.hideDevice"
+></c8y-event-list>

package/app-status/app-status/app-status.html

@@ -112,7 +112,7 @@
          
         </button>
       </div>
-      <div class="card-block large-padding p-t-0 p-r-md-0 hide-inner-cards">
+      <div class="card-block large-padding p-r-md-0 hide-inner-cards">
         <c8y-app-alarms
           hide-device="true"
           realtime="vm.realtime"

package/asset-notes/assetNotes.html

@@ -6,20 +6,30 @@
     <div ng-if="vm.notes && !vm.notes.htmlContent">
       {{ 'No notes yet.' | translate }}
       <c8y-if-allowed admin-mos="[vm.config.context]">
-        <a title="{{ 'Edit' | translate }}" class="small" href="" ng-click="vm.edit()">
+        <button
+          type="button"
+          title="{{ 'Edit' | translate }}"
+          class="btn btn-link btn-sm"
+          ng-click="vm.edit()"
+        >
           <i c8y-icon="pencil"></i>
           {{ 'Edit' | translate }}
-        </a>
+        </button>
       </c8y-if-allowed>
     </div>
 
     <div ng-if="vm.notes && vm.notes.htmlContent" class="text-break-word asset-notes-body">
       <span ng-bind-html="vm.notes.htmlContent"></span>
       <c8y-if-allowed admin-mos="[vm.config.context]">
-        <a title="{{ 'Edit' | translate }}" class="small" href="" ng-click="vm.edit()">
+        <button
+          type="button"
+          title="{{ 'Edit' | translate }}"
+          class="btn btn-link btn-sm"
+          ng-click="vm.edit()"
+        >
           <i c8y-icon="pencil"></i>
           {{ 'Edit' | translate }}
-        </a>
+        </button>
       </c8y-if-allowed>
     </div>
 
@@ -34,6 +44,7 @@
   <div ng-if="vm.editable" class="fit-h flex-grow">
     <div class="d-flex a-i-stretch fit-h">
       <textarea
+        aria-label="{{ 'Notes' | translate }}"
         class="form-control fit-h"
         ng-model="vm.editedNotes.htmlContent"
         rows="5"
@@ -43,7 +54,6 @@
         <button
           type="button"
           class="btn btn-dot"
-          aria-label="{{ 'Save' | translate }}"
           ng-click="vm.save()"
           title="{{ 'Save' | translate }}"
         >
@@ -55,7 +65,6 @@
           type="button"
           class="btn btn-dot"
           ng-click="vm.cancel()"
-          aria-label="{{ 'Cancel' | translate }}"
           title="{{ 'Cancel' | translate }}"
         >
           <i c8y-icon="times"></i>

package/assetPropertyWidget/views/main.html

@@ -9,7 +9,7 @@
     ></c8y-schema-form>
   </form>
   <c8y-if-allowed admin-mos="[managedObject]" class="d-contents">
-    <div class="p-16 separator-bottom" ng-show="editable && canAddProperties()">
+    <div class="p-t-8 p-16" ng-show="editable && canAddProperties()">
       <button
         title="{{ 'Add fragment' | translate }}"
         type="button"
@@ -21,7 +21,7 @@
       </button>
     </div>
 
-    <div c8y-widget-footer class="p-16 sticky-bottom bg-level-1 separator-top">
+    <div c8y-widget-footer class="p-16 sticky-bottom bg-level-0 separator-top">
       <button
         title="{{ 'Edit' | translate }}"
         type="button"

package/binaryArtefactsManagement/views/list.html

@@ -179,6 +179,7 @@
                 title="{{ 'Actions' | translate }}"
                 type="button"
                 uib-dropdown-toggle
+                aria-haspopup="true"
               >
                 <i c8y-icon="ellipsis-v"></i>
               </button>

package/commandTemplates/views/commandTemplates.html

@@ -113,6 +113,7 @@
             title="{{ 'Actions' | translate }}"
             type="button"
             uib-dropdown-toggle
+            aria-haspopup="true"
           >
             <i c8y-icon="ellipsis-v"></i>
           </button>

package/core/ui/containers/header.html

@@ -42,6 +42,7 @@
         type="button"
         class=" main-header-button dropdown-toggle c8y-dropdown"
         uib-dropdown-toggle
+        aria-haspopup="true"
       >
         <i c8y-icon="th" class="icon-2x"></i>
       </button>

package/core/ui/forms/search.html

@@ -11,6 +11,7 @@
     type="button"
     class="main-header-button dropdown-toggle c8y-dropdown"
     uib-dropdown-toggle
+    aria-haspopup="true"
   >
     <i c8y-icon="search" class="icon-2x"></i>
   </button>
@@ -34,6 +35,7 @@
             class="btn btn-link dropdown-toggle"
             ng-if="vm.searchFunctionList.length > 1"
             uib-dropdown-toggle
+            aria-haspopup="true"
           >
             <span class="caret"></span>
             <i c8y-icon="search"></i>

package/core/ui/header/actions.html

@@ -4,6 +4,7 @@
     type="button"
     class="main-header-button dropdown-toggle c8y-dropdown"
     uib-dropdown-toggle
+    aria-haspopup="true"
   >
     <i c8y-icon="plus-circle" class="icon-2x"></i>
   </button>

package/core/ui/itemSelector/itemSelector.html

@@ -11,6 +11,7 @@
     title="{{ vm.displayLabel ? vm.displayLabel : vm.placeholder() }}"
     uib-dropdown-toggle
     ng-disabled="vm.disabled"
+    aria-haspopup="true"
   >
     <span class="text-truncate" ng-bind="vm.displayLabel" ng-show="vm.displayLabel"></span>
     <span

package/core/ui/navigation/breadcrumbs.html

@@ -4,26 +4,23 @@
   ng-class="{ open: showAll, multiple: breadcrumbs.length > 1 }"
 >
   <button
+    title="{{
+      showAll ? ('Collapse breadcrumbs' | translate) : ('Expand all breadcrumbs' | translate)
+    }}"
+    aria-label="{{
+      showAll ? ('Collapse breadcrumbs' | translate) : ('Expand all breadcrumbs' | translate)
+    }}"
     ng-show="breadcrumbs.length > 1"
     class="btn-show-all-breadcrumbs pull-left"
     ng-click="showAll = !showAll"
+    uib-tooltip="{{
+      showAll ? ('Collapse breadcrumbs' | translate) : ('Expand all breadcrumbs' | translate)
+    }}"
+    tooltip-append-to-body="true"
+    tooltip-placement="auto"
+    tooltip-popup-delay="500"
   >
-    <i
-      ng-hide="showAll"
-      c8y-icon="caret-right"
-      uib-tooltip="{{ 'Show all breadcrumbs' | translate }}"
-      tooltip-append-to-body="true"
-      tooltip-placement="auto"
-      tooltip-popup-delay="500"
-    ></i>
-    <i
-      ng-show="showAll"
-      c8y-icon="caret-down"
-      uib-tooltip="{{ 'Collapse breadcrumbs' | translate }}"
-      tooltip-append-to-body="true"
-      tooltip-placement="auto"
-      tooltip-popup-delay="500"
-    ></i>
+    <i ng-class="{ 'icon-rotate-90': showAll }" c8y-icon="caret-right"></i>
   </button>
 
   <ul class="breadcrumbs text-muted" ng-repeat="path in breadcrumbs" ng-show="$first || showAll">

package/core/ui/properties/propertySelector.html

@@ -17,6 +17,7 @@
         type="button"
         class="btn btn-default btn-xs dropdown-toggle c8y-dropdown"
         uib-dropdown-toggle
+        aria-haspopup="true"
       >
         <i c8y-icon="plus"></i>
         {{ 'Add action' | translate }}

package/core/ui/schemaForm/overrides/decorators/bootstrap/checkbox.html

@@ -6,7 +6,11 @@
     'has-success': form.disableSuccessState !== true && hasSuccess()
   }"
 >
-  <label title="{{ form.title | translate }}" class="c8y-checkbox {{ form.labelHtmlClass }}">
+  <label
+    title="{{ form.title | translate }}"
+    class="c8y-checkbox {{ form.labelHtmlClass }}"
+    for="sf-{{ form.key.slice(-1)[0] + $id }}"
+  >
     <input
       type="checkbox"
       sf-changed="form"
@@ -15,7 +19,9 @@
       ng-model-options="form.ngModelOptions"
       schema-validate="form"
       class="{{ form.fieldHtmlClass }}"
-      name="{{ form.key.slice(-1)[0] }}"
+      title="{{ form.title | translate }}"
+      name="sf-{{ form.key.slice(-1)[0] + $id }}"
+      id="sf-{{ form.key.slice(-1)[0] + $id }}"
     />
     <span></span>
     <!-- To hide the label set form.labelHtmlClass to 'no-label' -->

package/core/ui/schemaForm/overrides/decorators/bootstrap/default.html

@@ -9,7 +9,7 @@
   <label
     class="control-label {{ form.labelHtmlClass }}"
     ng-class="{ 'sr-only': !showTitle() }"
-    for="{{ form.key.slice(-1)[0] + $id }}"
+    for="sf-{{ form.key.slice(-1)[0] + $id }}"
   >
     {{ form.title | translate }}
   </label>
@@ -21,15 +21,14 @@
     sf-changed="form"
     placeholder="{{ form.placeholder | translate }}"
     class="text-truncate form-control {{ form.fieldHtmlClass }}"
-    id="{{ form.key.slice(-1)[0] + $id }}"
     ng-model-options="form.ngModelOptions"
     ng-model="$$value$$"
     ng-readonly="form.readonly"
     schema-validate="form"
-    title="$$value$$"
-    name="{{ form.key.slice(-1)[0] + $id }}"
-    id="{{ form.key.slice(-1)[0] + $id }}"
-    />
+    title="{{ form.title | translate }}"
+    id="sf-{{ form.key.slice(-1)[0] + $id }}"
+    name="sf-{{ form.key.slice(-1)[0] + $id }}"
+  />
 
   <div
     ng-if="form.fieldAddonLeft || form.fieldAddonRight"
@@ -47,14 +46,14 @@
       sf-changed="form"
       placeholder="{{ form.placeholder | translate }}"
       class="text-truncate form-control {{ form.fieldHtmlClass }}"
-      id="{{ form.key.slice(-1)[0] + $id }}"
       ng-model-options="form.ngModelOptions"
       ng-model="$$value$$"
       ng-readonly="form.readonly"
       schema-validate="form"
-      title="{{ $$value$$ }}"
-      name="{{ form.key.slice(-1)[0] + $id }}"
-      />
+      title="{{ form.title | translate }}"
+      id="sf-{{ form.key.slice(-1)[0] + $id }}"
+      name="sf-{{ form.key.slice(-1)[0] + $id }}"
+    />
 
     <span
       ng-if="form.fieldAddonRight"

package/core/ui/schemaForm/overrides/decorators/bootstrap/password.html

@@ -9,7 +9,7 @@
   <label
     class="control-label {{ form.labelHtmlClass }}"
     ng-class="{ 'sr-only': !showTitle() }"
-    for="{{ form.key.slice(-1)[0] }}"
+    for="sf-{{ form.key.slice(-1)[0] + $id }}"
   >
     {{ form.title | translate }}
   </label>
@@ -21,15 +21,15 @@
     sf-changed="form"
     placeholder="{{ form.placeholder | translate }}"
     class="form-control {{ form.fieldHtmlClass }}"
-    id="{{ form.key.slice(-1)[0] }}"
     ng-model-options="form.ngModelOptions"
     ng-model="$$value$$"
     ng-disabled="form.readonly"
     schema-validate="form"
-    name="{{ form.key.slice(-1)[0] }}"
-    title="$$value$$"
+    id="sf-{{ form.key.slice(-1)[0] + $id }}"
+    name="sf-{{ form.key.slice(-1)[0] + $id }}"
+    title="{{ form.title | translate }}"
     c8y-autocomplete="off"
-    />
+  />
 
   <div
     ng-if="form.fieldAddonLeft || form.fieldAddonRight"
@@ -47,14 +47,15 @@
       sf-changed="form"
       placeholder="{{ form.placeholder | translate }}"
       class="form-control {{ form.fieldHtmlClass }}"
-      id="{{ form.key.slice(-1)[0] }}"
       ng-model-options="form.ngModelOptions"
       ng-model="$$value$$"
       ng-disabled="form.readonly"
       schema-validate="form"
-      name="{{ form.key.slice(-1)[0] }}"
+      title="{{ form.title | translate }}"
+      id="sf-{{ form.key.slice(-1)[0] + $id }}"
+      name="sf-{{ form.key.slice(-1)[0] + $id }}"
       c8y-autocomplete="off"
-      />
+    />
     <span
       ng-if="form.fieldAddonRight"
       class="input-group-addon"

package/core/ui/schemaForm/overrides/decorators/bootstrap/textarea.html

@@ -8,22 +8,22 @@
   <label
     class="{{ form.labelHtmlClass }}"
     ng-class="{ 'sr-only': !showTitle() }"
-    for="{{ form.key.slice(-1)[0] }}"
+    for="sf-{{ form.key.slice(-1)[0] + $id }}"
   >
     {{ form.title | translate }}
   </label>
   <textarea
     ng-if="!form.fieldAddonLeft && !form.fieldAddonRight"
     class="form-control {{ form.fieldHtmlClass }}"
-    id="{{ form.key.slice(-1)[0] + $id }}"
     sf-changed="form"
     placeholder="{{ form.placeholder | translate }}"
     ng-readonly="form.readonly"
     ng-model="$$value$$"
     ng-model-options="form.ngModelOptions"
     schema-validate="form"
-    name="{{ form.key.slice(-1)[0] }}"
-    aria-label="{{ 'Form title' | translate }}"
+    name="sf-{{ form.key.slice(-1)[0] + $id }}"
+    title="{{ form.title | translate }}"
+    id="sf-{{ form.key.slice(-1)[0] + $id }}"
     rows="10"
   ></textarea>
   <div
@@ -36,16 +36,16 @@
       ng-bind-html="form.fieldAddonLeft"
     ></span>
     <textarea
-      aria-label="{{ 'Form title' | translate }}"
       class="form-control {{ form.fieldHtmlClass }}"
-      id="{{ form.key.slice(-1)[0] + $id }}"
       sf-changed="form"
       placeholder="{{ form.placeholder | translate }}"
       ng-readonly="form.readonly"
       ng-model="$$value$$"
       ng-model-options="form.ngModelOptions"
       schema-validate="form"
-      name="{{ form.key.slice(-1)[0] }}"
+      name="sf-{{ form.key.slice(-1)[0] + $id }}"
+      title="{{ form.title | translate }}"
+      id="sf-{{ form.key.slice(-1)[0] + $id }}"
     ></textarea>
     <span
       ng-if="form.fieldAddonRight"

package/core/ui/user/editUser.directive.html

@@ -210,6 +210,7 @@
         class="btn dropdown-toggle fit-w"
         data-toggle="dropdown"
         uib-dropdown-toggle
+        aria-haspopup="true"
       >
         <span class="d-flex">
           <span title="{{ user.owner }}" ng-if="user.owner" class="text-truncate">

package/core/ui/user/userPicker.html

@@ -1,4 +1,4 @@
-<div class="p-r-16 p-l-16 p-b-16 separator-bottom">
+<div class="p-16 separator-bottom">
   <div class="input-group input-group-search">
     <input
       title="{{ 'Filter users' | translate }}"
@@ -22,18 +22,21 @@
   </div>
 </div>
 <div class="user-picker-scroll">
-  <c8y-rectangle-spinner ng-if="vm.loading" message="'Loading users…' | translate">
-  </c8y-rectangle-spinner>
+  <c8y-rectangle-spinner
+    ng-if="vm.loading"
+    message="'Loading users…' | translate"
+  ></c8y-rectangle-spinner>
   <div class="list-group" ng-if="vm.userFlatTree">
     <div ng-if="vm.shouldShowWarning()" class="p-t-16 p-b-16 p-r-24 p-l-24">
       <div class="alert alert-warning" translate>
         Some users might not be shown. Try narrowing search criteria.
       </div>
     </div>
-    <div ng-if="vm.userFlatTree.length === 0 && vm.loading === false" class="p-t-16 p-b-16 p-r-24 p-l-24">
-      <div class="alert alert-warning" translate>
-        No users found.
-      </div>
+    <div
+      ng-if="vm.userFlatTree.length === 0 && vm.loading === false"
+      class="p-t-16 p-b-16 p-r-24 p-l-24"
+    >
+      <div class="alert alert-warning" translate>No users found.</div>
     </div>
     <div
       class="list-group-item d-flex a-i-center text-truncate p-l-0"
@@ -44,32 +47,38 @@
         class="d-inline-block p-r-4"
         ng-style="::{width: vm.userDepth(user)}"
         ng-hide="::user._owns.length"
-      >
-      </span>
+      ></span>
       <button
         class="col-expand btn-dot"
         ng-style="::{'margin-left': (user._depth * 30)}"
         ng-click="::$event.stopPropagation();vm.toggleExpanded(user)"
         ng-show="::user._owns.length"
+        title="{{ 'Expand/collapse' | translate }}"
       >
         <i
           c8y-icon="chevron-right"
-          ng-class="{'icon-rotate-90':user._expanded}"
+          ng-class="{ 'icon-rotate-90': user._expanded }"
           ng-hide="vm.searchQuery"
         ></i>
       </button>
-      <button class="d-flex btn-clean fit-w a-i-center" ng-click="::vm.toggleSelection(user)">
-        <label class="c8y-radio m-r-8" tabindex="-1">
-          <input type="radio" tabindex="-1" ng-checked="vm.isSelected(user)" />
-          <span></span>
-        </label>
-        <div class="user-dot" ng-class="{'user-disabled': !user.enabled}">
+      <label class="c8y-radio m-r-8">
+        <input aria-label="{{::user.userName}}" type="radio" ng-checked="vm.isSelected(user)" />
+        <span></span>
+      </label>
+      <button
+        class="d-flex btn-clean fit-w a-i-center"
+        title="{{::user.userName}}"
+        ng-click="::vm.toggleSelection(user)"
+      >
+        <div class="user-dot" ng-class="{ 'user-disabled': !user.enabled }">
           {{::user.userName.substr(0,2)}}
         </div>
         <div class="username text-truncate l-h-1">
           <span title="{{::user.userName}}">{{::user.userName}}</span>
           <small ng-if="::user.firstName.length || user.lastName.length" class="text-muted">
-            <br />{{::user.firstName}} {{::user.lastName}}</small>
+            <br />
+            {{::user.firstName}} {{::user.lastName}}
+          </small>
         </div>
       </button>
     </div>

package/core/ui/views/actions.html

@@ -9,6 +9,8 @@
   class="dropdown-toggle c8y-dropdown"
   ng-show="cogActionsVisible() || buttonActionsVisible()"
   uib-dropdown-toggle
+  aria-haspopup="true"
+  title="{{ 'Actions' | translate }}"
 >
   <i c8y-icon="cog icon-2x"></i>
 </button>

package/core/ui/views/alarmList.html

@@ -31,12 +31,21 @@
   <!-- alarm-list -->
   <div class="card-inner-scroll">
     <!-- empty state -->
-    <div class="text-muted" ng-show="filteredAlarms.length === 0 && !refreshLoading">
-      <div class="c8y-empty-state c8y-empty-state--horizontal">
-        <div c8y-icon="c8y-alert-idle" class="text-center c8y-icon-duocolor"></div>
-        <p><strong translate>No alarms to display.</strong></p>
-      </div>
-    </div>
+    <c8y-ui-empty-state
+      ng-if="filteredAlarms.length === 0 && !refreshLoading"
+      [icon]="'c8y-alert-idle'"
+      [title]="'No alarms to display.' | translate"
+    >
+      <p c8y-guide-docs>
+        <small translate>
+          Find out more in the
+          <a c8y-guide-href="users-guide/administration/#reprio-alarms">
+            User guide`KEEP_ORIGINAL`
+          </a>
+          .
+        </small>
+      </p>
+    </c8y-ui-empty-state>
 
     <!-- loading -->
     <div class="card-block" ng-show="refreshLoading && !paging.more">

package/core/ui/views/eventList.html

@@ -140,15 +140,12 @@
 </div>
 
 <!-- empty state -->
-<div
-  class="c8y-empty-state"
-  ng-class="{ 'text-center m-t-40': !$parent.child.templateUrl }"
-  ng-show="events.length == 0"
+<c8y-ui-empty-state
+  ng-if="events.length == 0"
+  [icon]="'c8y-events'"
+  [title]="'No events to display.' | translate"
 >
-  <h1 aria-label="{{ 'Icon' | translate }}" class="c8y-icon c8y-icon-events c8y-icon-duocolor"></h1>
-  <div ng-show="!$parent.child.templateUrl" class="h3" translate>No events to display.</div>
-  <p ng-show="$parent.child.templateUrl" translate>No events to display.</p>
-  <p c8y-guide-docs>
+  <span c8y-guide-docs>
     <small translate>
       Find out more in the
       <a c8y-guide-href="users-guide/device-management/#to-view-events">
@@ -156,8 +153,8 @@
       </a>
       .
     </small>
-  </p>
-</div>
+  </span>
+</c8y-ui-empty-state>
 
 <div
   class="page-sticky-header hidden-xs c8y-list__item c8y-list--timeline"

package/core/ui/views/filePicker.html

@@ -40,9 +40,9 @@
         </p>
         <div class="progress">
           <div
+            aria-label="{{ vm.process.progress + '%' }}"
             class="progress-bar active progress-bar-striped"
             role="progressbar"
-            aria-valuenow="{{ vm.process.progress }}"
             aria-valuemin="0"
             aria-valuemax="100"
             style="min-width: 2em"
@@ -68,6 +68,7 @@
         <span class="input-group-btn">
           <button
             title="{{ 'Select file' | translate }}"
+            aria-label="{{ 'Select file' | translate }}"
             type="button"
             class="btn btn-default"
             ng-file-select="vm.onFileSelect(file, $files)"
@@ -78,6 +79,7 @@
           <button
             class="btn btn-dot btn-dot--danger"
             title="{{ 'Remove' | translate }}"
+            aria-label="{{ 'Remove' | translate }}"
             type="button"
             ng-click="vm.remove(file)"
             ng-show="file.file.name || (vm.multiple && !$first)"
@@ -89,6 +91,7 @@
     </div>
     <button
       title="{{ 'Add file' | translate }}"
+      aria-label="{{ 'Add file' | translate }}"
       type="button"
       class="btn btn-default"
       ng-click="vm.add()"

package/core/ui/views/loadmore.html

@@ -26,6 +26,7 @@
       class="btn btn-default dropdown-toggle"
       uib-dropdown-toggle
       ng-show="!paging.blind && _pageSizes"
+      aria-haspopup="true"
     >
       {{ 'Page size' | translate }}
       <span class="caret"></span>

package/dataBroker/connectors/connectors.html

@@ -125,6 +125,7 @@
             class="dropdown-toggle c8y-dropdown"
             uib-dropdown-toggle
             ng-click="::$event.stopPropagation()"
+            aria-haspopup="true"
           >
             <span>
               <i c8y-icon="ellipsis-v"></i>

package/dataBroker/subscriptions/subscription.html

@@ -6,6 +6,7 @@
         class="dropdown-toggle c8y-dropdown"
         uib-dropdown-toggle
         ng-click="::$event.stopPropagation()"
+        aria-haspopup="true"
       >
         <i c8y-icon="ellipsis-v"></i>
       </button>