mirror of
https://github.com/bitwarden/browser
synced 2026-01-08 11:33:28 +00:00
convert add login to ciphers
This commit is contained in:
Kyle Spearrin
253
src/app/vault/views/vaultAddCipher.html
Normal file
253
src/app/vault/views/vaultAddCipher.html
Normal file
@@ -0,0 +1,253 @@
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 class="modal-title"><i class="fa fa-globe"></i> Add New Item</h4>
|
||||
</div>
|
||||
<form name="form" ng-submit="form.$valid && save()" api-form="savePromise" autocomplete="off">
|
||||
<div class="modal-body">
|
||||
<div class="callout callout-danger validation-errors" ng-show="form.$errors">
|
||||
<h4>Errors have occurred</h4>
|
||||
<ul>
|
||||
<li ng-repeat="e in form.$errors">{{e}}</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-6">
|
||||
<div class="form-group">
|
||||
<label for="type">What type of item is this?</label>
|
||||
<select id="type" name="Type" ng-model="selectedType" class="form-control" ng-change="typeChanged()">
|
||||
<option value="{{constants.cipherType.login}}">Login</option>
|
||||
<option value="{{constants.cipherType.card}}">Card</option>
|
||||
<option value="{{constants.cipherType.identity}}">Identity</option>
|
||||
<option value="{{constants.cipherType.secureNote}}">Secure Note</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-6">
|
||||
<div class="form-group" show-errors>
|
||||
<label for="name">Name</label> <span>*</span>
|
||||
<input type="text" id="name" name="Name" ng-model="cipher.name" class="form-control" required api-field />
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6" ng-if="!hideFolders">
|
||||
<div class="form-group" show-errors>
|
||||
<label for="folder">Folder</label>
|
||||
<select id="folder" name="FolderId" ng-model="cipher.folderId" class="form-control" api-field>
|
||||
<option ng-repeat="folder in folders | orderBy: folderSort" value="{{folder.id}}">{{folder.name}}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-if="cipher.type === constants.cipherType.login">
|
||||
<div class="form-group" show-errors>
|
||||
<label for="uri">URI</label>
|
||||
<div class="input-group">
|
||||
<input type="text" id="uri" name="Login.Uri" ng-model="cipher.login.uri" class="form-control"
|
||||
placeholder="http://..." ng-readonly="readOnly" api-field />
|
||||
<span class="input-group-btn">
|
||||
<button class="btn btn-default btn-flat" type="button" uib-tooltip="Copy URI"
|
||||
tooltip-placement="left" ngclipboard ngclipboard-error="clipboardError(e)"
|
||||
data-clipboard-target="#uri">
|
||||
<i class="fa fa-clipboard"></i>
|
||||
</button>
|
||||
<a href="{{cipher.login.uri}}" target="_blank" class="btn btn-default btn-flat"
|
||||
uib-tooltip="Go To Website" tooltip-placement="left">
|
||||
<i class="fa fa-share"></i>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-6">
|
||||
<div class="form-group" show-errors>
|
||||
<label for="username">Username</label>
|
||||
<div class="input-group">
|
||||
<input type="text" id="username" name="Login.Username" ng-model="cipher.login.username"
|
||||
class="form-control" ng-readonly="readOnly" api-field />
|
||||
<span class="input-group-btn" uib-tooltip="Copy Username" tooltip-placement="left">
|
||||
<button class="btn btn-default btn-flat" type="button" ngclipboard
|
||||
ngclipboard-error="clipboardError(e)"
|
||||
data-clipboard-target="#username">
|
||||
<i class="fa fa-clipboard"></i>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<div class="form-group" show-errors style="margin-bottom: 5px;">
|
||||
<div class="pull-right password-options">
|
||||
<i class="fa fa-lg fa-refresh" uib-tooltip="Generate Password" tooltip-placement="left"
|
||||
ng-click="generatePassword()" ng-show="!readOnly"></i>
|
||||
<i class="fa fa-lg fa-eye" uib-tooltip="Toggle Password" tooltip-placement="left"
|
||||
password-viewer="#password"></i>
|
||||
</div>
|
||||
<label for="password">Password</label>
|
||||
<div class="input-group">
|
||||
<input type="password" id="password" name="Login.Password" ng-model="cipher.login.password"
|
||||
class="form-control" ng-readonly="readOnly" api-field />
|
||||
<span class="input-group-btn" uib-tooltip="Copy Password" tooltip-placement="left">
|
||||
<button class="btn btn-default btn-flat" type="button" ngclipboard
|
||||
ngclipboard-success="clipboardSuccess(e)" ngclipboard-error="clipboardError(e, true)"
|
||||
data-clipboard-text="{{cipher.login.password}}">
|
||||
<i class="fa fa-clipboard"></i>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div password-meter="cipher.login.password" password-meter-username="cipher.login.username"
|
||||
outer-class="xs" class="password-meter"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-6">
|
||||
<div class="form-group" show-errors>
|
||||
<label for="totp">Authenticator Key (TOTP)</label>
|
||||
<input type="text" id="totp" name="Login.Totp" ng-model="cipher.login.totp" class="form-control"
|
||||
ng-readonly="readOnly" api-field />
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6 totp-col">
|
||||
<div totp="cipher.login.totp" id="verification-code" ng-if="useTotp"></div>
|
||||
<div ng-if="!useTotp">
|
||||
<a href="#" stop-click ng-click="showUpgrade()"><img src="images/totp-countdown.png" alt="" /></a>
|
||||
<span class="label label-info clickable" ng-click="showUpgrade()">
|
||||
{{fromOrg ? 'UPGRADE' : 'PREMIUM'}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div ng-if="cipher.type === constants.cipherType.card">
|
||||
<div class="row">
|
||||
<div class="col-sm-6">
|
||||
<div class="form-group" show-errors>
|
||||
<label for="cardholderName">Cardholder Name</label>
|
||||
<div class="input-group">
|
||||
<input type="text" id="cardholderName" name="Card.CardholderName"
|
||||
ng-model="cipher.card.cardholderName" class="form-control" ng-readonly="readOnly" api-field />
|
||||
<span class="input-group-btn" uib-tooltip="Copy Cardholder Name" tooltip-placement="left">
|
||||
<button class="btn btn-default btn-flat" type="button" ngclipboard
|
||||
ngclipboard-error="clipboardError(e)" data-clipboard-target="#cardholderName">
|
||||
<i class="fa fa-clipboard"></i>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<div class="form-group" show-errors>
|
||||
<label for="cardBrand">Card Brand</label>
|
||||
<select id="cardBrand" name="Card.Brand" ng-model="cipher.card.brand" class="form-control" api-field>
|
||||
<option value="visa">Visa</option>
|
||||
<option value="masterCard">MasterCard</option>
|
||||
<option value="discover">Discover</option>
|
||||
<option value="amex">American Express</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-6">
|
||||
<div class="form-group" show-errors>
|
||||
<label for="cardNumber">Card Number</label>
|
||||
<div class="input-group">
|
||||
<input type="text" id="cardNumber" name="Card.Number" ng-model="cipher.card.number"
|
||||
class="form-control" ng-readonly="readOnly" api-field />
|
||||
<span class="input-group-btn" uib-tooltip="Copy Number" tooltip-placement="left">
|
||||
<button class="btn btn-default btn-flat" type="button" ngclipboard
|
||||
ngclipboard-error="clipboardError(e)" data-clipboard-target="#cardNumber">
|
||||
<i class="fa fa-clipboard"></i>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div ng-if="cipher.type === constants.cipherType.identity">
|
||||
|
||||
</div>
|
||||
<div ng-if="cipher.type === constants.cipherType.secureNote">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="form-group" show-errors>
|
||||
<label for="notes">Notes</label>
|
||||
<textarea id="notes" name="Notes" class="form-control" ng-model="cipher.notes" api-field></textarea>
|
||||
</div>
|
||||
<hr />
|
||||
<h4><i class="fa fa-list-ul"></i> Custom Fields</h4>
|
||||
<div ng-repeat="field in cipher.fields">
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<div class="form-group">
|
||||
<label for="field_name{{$index}}">Name</label>
|
||||
<input type="text" id="field_name{{$index}}" name="Field.Name{{$index}}" class="form-control" ng-model="field.name" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div class="form-group">
|
||||
<label for="field_type{{$index}}">Type</label>
|
||||
<select id="field_type{{$index}}" name="Field.Type{{$index}}" class="form-control" ng-model="field.type">
|
||||
<option value="0">Text</option>
|
||||
<option value="1">Hidden</option>
|
||||
<option value="2">Boolean</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-5">
|
||||
<div class="form-group">
|
||||
<div class="pull-right password-options" ng-if="field.type === '1'">
|
||||
<i class="fa fa-lg fa-eye" uib-tooltip="Toggle Visibility" tooltip-placement="left"
|
||||
password-viewer="#field_value{{$index}}"></i>
|
||||
</div>
|
||||
<label for="field_value{{$index}}">Value</label>
|
||||
<div class="input-group" ng-if="field.type !== '2'">
|
||||
<input ng-attr-type="{{field.type === '0' ? 'text' : 'password'}}" id="field_value{{$index}}"
|
||||
name="Field.Value{{$index}}" class="form-control" ng-model="field.value" />
|
||||
<span class="input-group-btn" uib-tooltip="Copy Value" tooltip-placement="left">
|
||||
<button class="btn btn-default btn-flat" type="button" ngclipboard
|
||||
ngclipboard-success="clipboardSuccess(e)" ngclipboard-error="clipboardError(e, true)"
|
||||
data-clipboard-text="{{field.value}}">
|
||||
<i class="fa fa-clipboard"></i>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
<div ng-if="field.type === '2'">
|
||||
<input type="checkbox" id="field_value{{$index}}" name="Field.Value{{$index}}" ng-model="field.value"
|
||||
data-ng-true-value="'true'" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-1">
|
||||
<br class="hidden-xs" />
|
||||
<a href="#" ng-click="removeField(field)" stop-click>
|
||||
<i class="fa fa-window-close-o fa-lg"></i>
|
||||
<span class="visible-xs-inline">Remove Custom Field</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<hr class="visible-xs-block" />
|
||||
</div>
|
||||
<a href="#" ng-click="addField()" stop-click>
|
||||
<i class="fa fa-plus-circle"></i> New Custom Field
|
||||
</a>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="submit" class="btn btn-primary btn-flat" ng-disabled="form.$loading">
|
||||
<i class="fa fa-refresh fa-spin loading-icon" ng-show="form.$loading"></i>Submit
|
||||
</button>
|
||||
<button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
|
||||
<button type="button" ng-if="!hideFavorite" class="btn btn-link pull-right" ng-click="toggleFavorite()"
|
||||
uib-tooltip="Toggle Favorite" tooltip-placement="left">
|
||||
<i class="fa fa-lg" ng-class="cipher.favorite ? 'fa-star' : 'fa-star-o'"></i>
|
||||
<span class="sr-only">Toggle Favorite</span>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
Reference in New Issue
Block a user