2e35e9578c
* new font and add as font-family to be used in masked-input * clean up logic * refactor for displayOnly * start cert masking * work on certificates * upload cert work * fix global styling * fix styling for class no longer used * make mask by default and remove option * glimmerize start and certificate on LDAP a file field * glimmerize actions * first part of glimmerizing text-file still need to do some clean up * not doing awesome over here * getting ready to un-glimmer * unglimmerize * remove placeholder based on conversations with design * clean up text-file * cleanup * fix class bindings * handle class binding * set up for test * fix elementId * track down index * update masked-input test * add more to the masked-input test * test-file test * fix broken test * clear old style * clean up * remove pgp key masked font, this really needs to be refactored to text-file component * changelog * cover other certificate view * add allowCopy * address some pr styling comments * improve test coverage * fix some issues * add attr.options.masked
85 lines
2.8 KiB
Handlebars
85 lines
2.8 KiB
Handlebars
{{#unless this.inputOnly}}
|
|
<div class="level is-mobile">
|
|
<div class="level-left">
|
|
<label class="is-label" data-test-text-label=true>
|
|
{{#if this.label}}
|
|
{{this.label}}
|
|
{{#if @helpText}}
|
|
<InfoTooltip>
|
|
<span data-test-help-text>
|
|
{{@helpText}}
|
|
</span>
|
|
</InfoTooltip>
|
|
{{/if}}
|
|
{{else}}
|
|
File
|
|
{{/if}}
|
|
</label>
|
|
</div>
|
|
<div class="level-right">
|
|
<div class="control is-flex">
|
|
<input
|
|
data-test-text-toggle=true
|
|
id={{concat "useText-" this.elementId}}
|
|
type="checkbox"
|
|
name={{concat "useText-" this.elementId}}
|
|
class="switch is-rounded is-success is-small"
|
|
checked={{@file.enterAsText}}
|
|
{{on 'change' (toggle "enterAsText" @file)}}
|
|
/>
|
|
<label for={{concat "useText-" this.elementId}}>
|
|
Enter as text
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{/unless}}
|
|
<div class="field text-file box is-fullwidth is-marginless is-shadowless {{if this.inputOnly "is-paddingless"}}" data-test-component="text-file">
|
|
{{#if @file.enterAsText}}
|
|
<div class="control has-icon-right">
|
|
<textarea
|
|
class="textarea {{unless showValue "masked-font"}}"
|
|
{{on 'input' this.updateData}}
|
|
data-test-text-file-textarea=true
|
|
>{{@file.value}}</textarea>
|
|
<button
|
|
{{on 'click' this.toggleMask}}
|
|
type="button"
|
|
class="{{if (eq value "") "has-text-grey"}} masked-input-toggle button {{if displayOnly "is-compact"}}"
|
|
data-test-button>
|
|
<Icon @glyph={{if showValue "visibility-show" "visibility-hide"}} aria-hidden="true" />
|
|
</button>
|
|
</div>
|
|
<p class="help has-text-grey">
|
|
{{this.textareaHelpText}}
|
|
</p>
|
|
{{else}}
|
|
<div class="control is-expanded">
|
|
<div class="file has-name is-fullwidth">
|
|
<label class="file-label">
|
|
<input class="file-input" type="file" {{on 'change' this.pickedFile}} data-test-text-file-input=true>
|
|
<span class="file-cta button">
|
|
<Icon @glyph="upload" class="has-light-grey-text" />
|
|
Choose a file…
|
|
</span>
|
|
<span class="file-name has-text-grey-dark" data-test-text-file-input-label=true>
|
|
{{#if @file.fileName}}
|
|
{{@file.fileName}}
|
|
{{else}}
|
|
No file chosen
|
|
{{/if}}
|
|
</span>
|
|
{{#if @file.fileName}}
|
|
<button type="button" class="file-delete-button" {{on 'click' this.clearFile}} data-test-text-clear=true>
|
|
<Icon @glyph="cancel-circle-outline" />
|
|
</button>
|
|
{{/if}}
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<p class="help has-text-grey">
|
|
{{this.fileHelpText}}
|
|
</p>
|
|
{{/if}}
|
|
</div>
|