mirror of
https://github.com/bitwarden/browser
synced 2026-01-02 00:23:35 +00:00
cleaned up date and time logic for Send
This commit is contained in:
129
src/popup/send/efflux-dates.component.html
Normal file
129
src/popup/send/efflux-dates.component.html
Normal file
@@ -0,0 +1,129 @@
|
||||
<ng-container [formGroup]="datesForm">
|
||||
<div class="box">
|
||||
<div class="box-content">
|
||||
<ng-container *ngIf="!editMode">
|
||||
<div class="box-content-row" appBoxRow>
|
||||
<label for="deletionDate">{{'deletionDate' | i18n}}</label>
|
||||
<select id="deletionDate" name="DeletionDateSelect" formControlName="selectedDeletionDatePreset" required>
|
||||
<option *ngFor="let o of deletionDatePresets" [ngValue]="o.value">{{o.name}}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="box-content-row" appBoxRow *ngIf="selectedDeletionDatePreset.value === 0">
|
||||
<ng-container *ngTemplateOutlet="deletionDateCustom"></ng-container>
|
||||
</div>
|
||||
</ng-container>
|
||||
<div class="box-content-row" appBoxRow *ngIf="editMode">
|
||||
<label for="deletionDate">{{'deletionDate' | i18n}}</label>
|
||||
<ng-container *ngTemplateOutlet="deletionDateCustom"></ng-container>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-footer">
|
||||
{{'deletionDateDesc' | i18n}}
|
||||
<ng-container
|
||||
*ngIf="(!inPopout && browserPath == 'firefox') && (editMode || (selectedDeletionDatePreset.value === 0 && !editMode))">
|
||||
<br>{{'sendFirefoxCustomDatePopoutMessage1' | i18n}} <a
|
||||
(click)="popOutWindow.emit()">{{'sendFirefoxCustomDatePopoutMessage2' | i18n}}</a>
|
||||
{{'sendFirefoxCustomDatePopoutMessage3' | i18n}}
|
||||
</ng-container>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<div class="box-content">
|
||||
<ng-container *ngIf="!editMode">
|
||||
<div class="box-content-row" *ngIf="!editMode" appBoxRow>
|
||||
<label for="editExpirationDate">{{'expirationDate' | i18n}}</label>
|
||||
<select id="expirationDate" name="ExpirationDateSelect"
|
||||
formControlName="selectedExpirationDatePreset" required>
|
||||
<option *ngFor="let o of expirationDatePresets" [ngValue]="o.value">{{o.name}}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="box-content-row" *ngIf="selectedExpirationDatePreset.value === 0" appBoxRow>
|
||||
<ng-container *ngTemplateOutlet="expirationDateCustom"></ng-container>
|
||||
</div>
|
||||
</ng-container>
|
||||
<div class="box-content-row" *ngIf="editMode" appBoxRow>
|
||||
<div class="flex-label">
|
||||
<label>{{'expirationDate' | i18n}}</label>
|
||||
<a *ngIf="!disabled" href="#" appStopClick (click)="clearExpiration()">
|
||||
{{'clear' | i18n}}
|
||||
</a>
|
||||
</div>
|
||||
<ng-container *ngTemplateOutlet="expirationDateCustom"></ng-container>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-footer">
|
||||
{{'expirationDateDesc' | i18n}}
|
||||
<ng-container
|
||||
*ngIf="(!inPopout && browserPath == 'firefox') && (editMode || (selectedExpirationDatePreset.value === 0 && !editMode))">
|
||||
<br>{{'sendFirefoxCustomDatePopoutMessage1' | i18n}} <a
|
||||
(click)="popOutWindow.emit()">{{'sendFirefoxCustomDatePopoutMessage2' | i18n}}</a>
|
||||
{{'sendFirefoxCustomDatePopoutMessage3' | i18n}}
|
||||
</ng-container>
|
||||
</div>
|
||||
</div>
|
||||
<ng-template #deletionDateCustom>
|
||||
<ng-container [ngSwitch]="browserPath">
|
||||
<ng-container *ngSwitchCase="'firefox'">
|
||||
<div class="flex flex-grow">
|
||||
<input id="deletionDateCustomFallback" type="date" name="DeletionDateFallback"
|
||||
formControlName="fallbackDeletionDate" required placeholder="MM/DD/YYYY"
|
||||
[readOnly]="disabled" data-date-format="mm/dd/yyyy">
|
||||
<input id="deletionTimeCustomFallback" type="time" name="DeletionTimeDate"
|
||||
formControlName="fallbackDeletionTime" required placeholder="HH:MM AM/PM"
|
||||
[readOnly]="disabled">
|
||||
</div>
|
||||
</ng-container>
|
||||
<ng-container *ngSwitchCase="'safari'">
|
||||
<div class="flex flex-grow">
|
||||
<input id="deletionDateCustomFallback" type="date" name="DeletionDateFallback"
|
||||
formControlName="fallbackDeletionDate" required placeholder="MM/DD/YYYY"
|
||||
[readOnly]="disabled" data-date-format="mm/dd/yyyy">
|
||||
<select id="deletionTimeCustomFallback" formControlName="fallbackDeletionTime"
|
||||
name="SafariDeletionTime">
|
||||
<option *ngFor="let o of safariDeletionTimePresetOptions" [ngValue]="o.military">{{o.standard}}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
</ng-container>
|
||||
<ng-container *ngSwitchDefault>
|
||||
<input id="deletionDateCustom" type="datetime-local" name="DeletionDate"
|
||||
formControlName="defaultDeletionDateTime" required placeholder="MM/DD/YYYY HH:MM AM/PM">
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
</ng-template>
|
||||
<ng-template #expirationDateCustom>
|
||||
<ng-container [ngSwitch]="browserPath">
|
||||
<ng-container *ngSwitchCase="'firefox'">
|
||||
<div class="flex flex-grow">
|
||||
<input id="expirationDateCustomFallback" type="date" name="ExpirationDateFallback"
|
||||
formControlName="fallbackExpirationDate" [required]="!editMode" placeholder="MM/DD/YYYY"
|
||||
[readOnly]="disabled" data-date-format="mm/dd/yyyy">
|
||||
<input id="expirationTimeCustomFallback" type="time"
|
||||
name="ExpirationTimeFallback" formControlName="fallbackExpirationTime"
|
||||
[required]="!editMode" placeholder="HH:MM AM/PM" [readOnly]="disabled">
|
||||
</div>
|
||||
</ng-container>
|
||||
<ng-container *ngSwitchCase="'safari'">
|
||||
<div class="flex flex-grow">
|
||||
<input id="expirationDateCustomFallback" type="date" name="ExpirationDateFallback"
|
||||
formControlName="fallbackExpirationDate" [required]="!editMode" placeholder="MM/DD/YYYY"
|
||||
[readOnly]="disabled" data-date-format="mm/dd/yyyy">
|
||||
<select id="expirationTimeCustomFallback"
|
||||
formControlName="fallbackExpirationTime" name="SafariExpirationTime">
|
||||
<option *ngFor="let o of safariExpirationTimePresetOptions" [ngValue]="o.military">
|
||||
{{o.standard}}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
</ng-container>
|
||||
<ng-container *ngSwitchDefault>
|
||||
<input id="expirationDateCustom" type="datetime-local" name="ExpirationDate"
|
||||
formControlName="defaultExpirationDateTime" required placeholder="MM/DD/YYYY HH:MM AM/PM"
|
||||
[readOnly]="disabled">
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
</ng-template>
|
||||
</ng-container>
|
||||
|
||||
Reference in New Issue
Block a user