Skip to content

Commit

Permalink
enhancements to login and setup-wizard modules
Browse files Browse the repository at this point in the history
  • Loading branch information
@bwp91
bwp91 committed Oct 19, 2024
1 parent 398e6df commit bc15c3b
Show file tree
Hide file tree
Showing 67 changed files with 2,320 additions and 1,910 deletions.
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ All notable changes to `homebridge-config-ui-x` will be documented in this file.
### UI Changes

- switch from a top menu to a sidebar menu
- enhancements to `login` and `setup-wizard` modules

### Other Changes

Expand Down
3 changes: 3 additions & 0 deletions scripts/lang-sync.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,9 @@ async function main() {
// Check each key
const unusedKeys = []
for (const key of keys) {
if (key.startsWith('login.tips_')) {
continue
}
const isUsed = await Promise.all(allFiles.map(file => isKeyUsedInFile(key, file)))
.then(results => results.some(result => result))
if (!isUsed) {
Expand Down
265 changes: 133 additions & 132 deletions ui/src/app/modules/accessories/accessories.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,146 +1,147 @@
<div *ngIf="$settings.env.enableAccessories">
<div class="row mb-3">
<div class="col-sm-6">
<h3 class="primary-text m-0">{{ 'accessories.title_accessories' | translate }}</h3>
</div>
<div class="col-sm-6 text-end d-none d-sm-block">
<div class="btn-group" role="group">
<button
type="button"
class="btn btn-elegant status-button my-0"
[hidden]="isMobile"
(click)="addRoom()"
container="body"
placement="bottom"
openDelay="150"
triggers="hover"
[ngbTooltip]="'accessories.button_add_room' | translate"
[attr.aria-label]="'accessories.button_add_room' | translate"
>
<i class="fas fa-fw fa-folder-plus"></i>
</button>
</div>
<div class="btn-group ms-2" role="group">
<button
type="button"
class="btn btn-elegant status-button my-0"
[hidden]="isMobile"
(click)="hideHidden = !hideHidden"
container="body"
placement="bottom"
openDelay="150"
triggers="hover"
[ngbTooltip]="hideHidden ? ('accessories.button_hidden_show' | translate) : ('accessories.button_hidden_hide' | translate)"
[attr.aria-label]="hideHidden ? ('accessories.button_hidden_show' | translate) : ('accessories.button_hidden_hide' | translate)"
>
<i class="fas fa-fw" [ngClass]="hideHidden ? 'fa-eye-slash' : 'fa-eye'"></i>
</button>
<div class="p-3 px-md-4 pt-0 pt-md-4">
<div *ngIf="$settings.env.enableAccessories">
<div class="row mb-3">
<div class="col-sm-6">
<h3 class="primary-text m-0">{{ 'accessories.title_accessories' | translate }}</h3>
</div>
<div class="btn-group ms-2" role="group">
<button
type="button"
class="btn btn-elegant status-button my-0"
[disabled]="!isMobile"
(click)="toggleLayoutLock()"
container="body"
placement="bottom"
openDelay="150"
triggers="hover"
[ngbTooltip]="'form.button_unlock' | translate"
[attr.aria-label]="'form.button_unlock' | translate"
>
<i class="fas fa-fw fa-unlock"></i>
</button>
<button
type="button"
class="btn btn-elegant status-button my-0"
[disabled]="isMobile"
(click)="toggleLayoutLock()"
container="body"
placement="bottom"
openDelay="150"
triggers="hover"
[ngbTooltip]="'form.button_lock' | translate"
[attr.aria-label]="'form.button_lock' | translate"
>
<i class="fas fa-fw fa-lock"></i>
</button>
<div class="col-sm-6 text-end d-none d-sm-block">
<div class="btn-group" role="group">
<button
type="button"
class="btn btn-elegant status-button my-0"
[hidden]="isMobile"
(click)="addRoom()"
container="body"
placement="bottom"
openDelay="150"
triggers="hover"
[ngbTooltip]="'accessories.button_add_room' | translate"
[attr.aria-label]="'accessories.button_add_room' | translate"
>
<i class="fas fa-fw fa-folder-plus"></i>
</button>
</div>
<div class="btn-group ms-2" role="group">
<button
type="button"
class="btn btn-elegant status-button my-0"
[hidden]="isMobile"
(click)="hideHidden = !hideHidden"
container="body"
placement="bottom"
openDelay="150"
triggers="hover"
[ngbTooltip]="hideHidden ? ('accessories.button_hidden_show' | translate) : ('accessories.button_hidden_hide' | translate)"
[attr.aria-label]="hideHidden ? ('accessories.button_hidden_show' | translate) : ('accessories.button_hidden_hide' | translate)"
>
<i class="fas fa-fw" [ngClass]="hideHidden ? 'fa-eye-slash' : 'fa-eye'"></i>
</button>
</div>
<div class="btn-group ms-2" role="group">
<button
type="button"
class="btn btn-elegant status-button my-0"
[disabled]="!isMobile"
(click)="toggleLayoutLock()"
container="body"
placement="bottom"
openDelay="150"
triggers="hover"
[ngbTooltip]="'form.button_unlock' | translate"
[attr.aria-label]="'form.button_unlock' | translate"
>
<i class="fas fa-fw fa-unlock"></i>
</button>
<button
type="button"
class="btn btn-elegant status-button my-0"
[disabled]="isMobile"
(click)="toggleLayoutLock()"
container="body"
openDelay="150"
triggers="hover"
[ngbTooltip]="'form.button_lock' | translate"
[attr.aria-label]="'form.button_lock' | translate"
>
<i class="fas fa-fw fa-lock"></i>
</button>
</div>
</div>
</div>
</div>

<div [dragula]="'rooms-bag'" [(dragulaModel)]="$accessories.rooms">
<div *ngFor="let room of $accessories.rooms">
<div class="row" *ngIf="!isMobile || room.services.length">
<div class="col-md-12">
<h5 class="primary-text drag-handle room-title" [ngClass]="{'cursor-move': !isMobile}">
{{ room.name === 'Default Room' ? ('accessories.control.default_room' | translate) : room.name }}
</h5>
</div>
</div>
<div class="row mb-4">
<div
class="col-md-12 d-flex flex-wrap justify-content-between noselect services-bag"
*ngIf="room.services.length"
[dragula]="'services-bag'"
[(dragulaModel)]="room.services"
>
<div *ngFor="let service of room.services" [ngSwitch]="service.type" class="accessory-item accessory-tab">
<ng-container *ngIf="!hideHidden || !service.hidden">
<app-accessory-tile [service]="service"></app-accessory-tile>
</ng-container>
<div [dragula]="'rooms-bag'" [(dragulaModel)]="$accessories.rooms">
<div *ngFor="let room of $accessories.rooms">
<div class="row" *ngIf="!isMobile || room.services.length">
<div class="col-md-12">
<h5 class="primary-text drag-handle room-title" [ngClass]="{'cursor-move': !isMobile}">
{{ room.name === 'Default Room' ? ('accessories.control.default_room' | translate) : room.name }}
</h5>
</div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
</div>
<div
class="col-md-12 d-flex flex-wrap noselect"
*ngIf="!room.services.length && !isMobile"
[dragula]="'services-bag'"
[(dragulaModel)]="room.services"
>
<app-drag-here-placeholder class="no-drag"></app-drag-here-placeholder>
<div class="row mb-4">
<div
class="col-md-12 d-flex flex-wrap justify-content-between noselect services-bag"
*ngIf="room.services.length"
[dragula]="'services-bag'"
[(dragulaModel)]="room.services"
>
<div *ngFor="let service of room.services" [ngSwitch]="service.type" class="accessory-item accessory-tab">
<ng-container *ngIf="!hideHidden || !service.hidden">
<app-accessory-tile [service]="service"></app-accessory-tile>
</ng-container>
</div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
<div style="height: 0 !important" class="accessory-box invisible py-0 my-0"></div>
</div>
<div
class="col-md-12 d-flex flex-wrap noselect"
*ngIf="!room.services.length && !isMobile"
[dragula]="'services-bag'"
[(dragulaModel)]="room.services"
>
<app-drag-here-placeholder class="no-drag"></app-drag-here-placeholder>
</div>
</div>
</div>
</div>
</div>
</div>

<div *ngIf="!$settings.env.enableAccessories">
<div class="row">
<div class="col-12">
<h3 class="primary-text m-0 mb-3">{{ 'accessories.title_accessories' | translate }}</h3>
</div>
<div class="col-12 text-center">
<div class="alert alert-warning p-4" role="alert">
<h4 class="primary-text mb-3 mt-0">{{ 'accessories.control_disabled' | translate }}</h4>
<div>
<p>{{ 'accessories.message_must_use_insecure_mode' | translate }}</p>
<p class="mb-0">
<span>{{ 'accessories.message_please_see' | translate }}</span>
<a
target="_blank"
rel="noopener noreferrer"
href="https://github.com/homebridge/homebridge-config-ui-x/wiki/Enabling-Accessory-Control"
>
https://github.com/homebridge/homebridge-config-ui-x/wiki/Enabling-Accessory-Control
</a>
<span>{{ 'accessories.message_for_more_information' | translate }}</span>
</p>
<p class="mt-3 mb-0" *ngIf="$auth.user.admin">{{ 'accessories.settings_link' | translate }}.</p>
<div *ngIf="!$settings.env.enableAccessories">
<div class="row">
<div class="col-12">
<h3 class="primary-text m-0 mb-3">{{ 'accessories.title_accessories' | translate }}</h3>
</div>
<div class="col-12 text-center">
<div class="alert alert-warning p-4" role="alert">
<h4 class="primary-text mb-3 mt-0">{{ 'accessories.control_disabled' | translate }}</h4>
<div>
<p>{{ 'accessories.message_must_use_insecure_mode' | translate }}</p>
<p class="mb-0">
<span>{{ 'accessories.message_please_see' | translate }}</span>
<a
target="_blank"
rel="noopener noreferrer"
href="https://github.com/homebridge/homebridge-config-ui-x/wiki/Enabling-Accessory-Control"
>
https://github.com/homebridge/homebridge-config-ui-x/wiki/Enabling-Accessory-Control
</a>
<span>{{ 'accessories.message_for_more_information' | translate }}</span>
</p>
<p class="mt-3 mb-0" *ngIf="$auth.user.admin">{{ 'accessories.settings_link' | translate }}.</p>
</div>
</div>
</div>
</div>
Expand Down
Loading

0 comments on commit bc15c3b

Please sign in to comment.