1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-16 16:23:44 +00:00

cleaned up date and time logic for Send

This commit is contained in:
addison
2021-07-15 11:10:58 -04:00
parent cee2287feb
commit 39ef5d2e92
4 changed files with 172 additions and 112 deletions

View File

@@ -117,112 +117,10 @@
</div>
</div>
<ng-container *ngIf="showOptions">
<!-- Deletion Date -->
<div class="box">
<div class="box-content">
<ng-template #deletionDateCustom>
<ng-container *ngIf="isDateTimeLocalSupported">
<input id="deletionDateCustom" type="datetime-local" name="DeletionDate"
[(ngModel)]="deletionDate" required placeholder="MM/DD/YYYY HH:MM AM/PM">
</ng-container>
<div class="flex flex-grow" *ngIf="!isDateTimeLocalSupported">
<input id="deletionDateCustomFallback" type="date" name="DeletionDateFallback"
[(ngModel)]="deletionDateFallback" required placeholder="MM/DD/YYYY"
[readOnly]="disableSend" data-date-format="mm/dd/yyyy">
<input *ngIf="!isSafari" id="deletionTimeCustomFallback" type="time" name="DeletionTimeDate"
[(ngModel)]="deletionTimeFallback" required placeholder="HH:MM AM/PM"
[readOnly]="disableSend">
<select *ngIf="isSafari" id="deletionTimeCustomFallback" [(ngModel)]="safariDeletionTime"
name="SafariDeletionTime">
<option *ngFor="let o of safariDeletionTimeOptions" [value]="o.military">{{o.standard}}
</option>
</select>
</div>
</ng-template>
<div class="box-content-row" *ngIf="!editMode">
<label for="deletionDate">{{'deletionDate' | i18n}}</label>
<select id="deletionDate" name="DeletionDateSelect" [(ngModel)]="deletionDateSelect" required>
<option *ngFor="let o of deletionDateOptions" [ngValue]="o.value">{{o.name}}
</option>
</select>
</div>
<ng-container *ngIf="deletionDateSelect === 0 && !editMode">
<div class="box-content-row">
<ng-container *ngTemplateOutlet="deletionDateCustom"></ng-container>
</div>
</ng-container>
<ng-container *ngIf="editMode">
<div class="box-content-row" appBoxRow>
<label for="editDeletionDate">{{'deletionDate' | i18n}}</label>
<ng-container *ngTemplateOutlet="deletionDateCustom"></ng-container>
</div>
</ng-container>
</div>
<div class="box-footer">
{{'deletionDateDesc' | i18n}}
<ng-container
*ngIf="(!inPopout && isFirefox) && (this.editMode || (deletionDateSelect === 0 && !editMode))">
<br>{{'sendFirefoxCustomDatePopoutMessage1' | i18n}} <a
(click)="popOutWindow()">{{'sendFirefoxCustomDatePopoutMessage2' | i18n}}</a>
{{'sendFirefoxCustomDatePopoutMessage3' | i18n}}
</ng-container>
</div>
</div>
<!-- Expiration Date -->
<div class="box">
<div class="box-content">
<ng-template #expirationDateCustom>
<ng-container *ngIf="isDateTimeLocalSupported">
<input id="expirationDateCustom" type="datetime-local" name="ExpirationDate"
[(ngModel)]="expirationDate" required placeholder="MM/DD/YYYY HH:MM AM/PM"
[readOnly]="disableSend">
</ng-container>
<div class="flex flex-grow" *ngIf="!isDateTimeLocalSupported">
<input id="expirationDateCustomFallback" type="date" name="ExpirationDateFallback"
[(ngModel)]="expirationDateFallback" [required]="!editMode" placeholder="MM/DD/YYYY"
[readOnly]="disableSend" (change)="expirationDateFallbackChanged()"
data-date-format="mm/dd/yyyy">
<input *ngIf="!isSafari" id="expirationTimeCustomFallback" type="time"
name="ExpirationTimeFallback" [(ngModel)]="expirationTimeFallback"
[required]="!editMode" placeholder="HH:MM AM/PM" [readOnly]="disableSend">
<select *ngIf="isSafari" id="expirationTimeCustomFallback"
[(ngModel)]="safariExpirationTime" name="SafariExpirationTime">
<option *ngFor="let o of safariExpirationTimeOptions" [value]="o.military">
{{o.standard}}</option>
</select>
</div>
</ng-template>
<div class="box-content-row" *ngIf="!editMode">
<label for="expirationDate">{{'expirationDate' | i18n}}</label>
<select id="expirationDate" name="ExpirationDateSelect" [(ngModel)]="expirationDateSelect"
required>
<option *ngFor="let o of expirationDateOptions" [ngValue]="o.value">{{o.name}}
</option>
</select>
</div>
<div class="box-content-row" *ngIf="expirationDateSelect === 0 && !editMode">
<ng-container *ngTemplateOutlet="expirationDateCustom"></ng-container>
</div>
<div class="box-content-row" *ngIf="editMode" appBoxRow>
<div class="flex-label">
<label for="editExpirationDate">{{'expirationDate' | i18n}}</label>
<a *ngIf="!disableSend" 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 && isFirefox) && (this.editMode || (deletionDateSelect === 0 && !editMode))">
<br>{{'sendFirefoxCustomDatePopoutMessage1' | i18n}} <a
(click)="popOutWindow()">{{'sendFirefoxCustomDatePopoutMessage2' | i18n}}</a>
{{'sendFirefoxCustomDatePopoutMessage3' | i18n}}
</ng-container>
</div>
</div>
<app-send-efflux-dates
[initialDeletionDate]="send.deletionDate" [initialExpirationDate]="send.expirationDate"
[editMode]="editMode" [disabled]="disableSend" (datesChanged)="setDates($event)" (popOutWindow)="popOutWindow()">
</app-send-efflux-dates>
<!-- Maximum Access Count -->
<div class="box">
<div class="box-content">