src/angular/pages/main/key/p3xr-main-key-string.html

<input type="file" id="p3xr-main-key-string-upload-buffer" style="display: none" onchange="angular.element(this).scope().readFileAsBuffer(event)"/>
    
    <span ng-if="!$ctrl.editable">
        <md-button class="md-button md-raised md-primary" ng-click="$ctrl.setBufferUpload({ $event: $event})"  ng-if="$root.p3xr.state.connection.readonly !== true">
            <md-icon>upload</md-icon>
            <span hide-sm hide-xs>{{ $root.p3xr.strings.intention.setBuffer }}</span>
            <md-tooltip ng-if="$root.$mdMedia('sm') || $root.$mdMedia('xs')" md-direction="bottom">{{
                $root.p3xr.strings.intention.setBuffer }}
            </md-tooltip>
        </md-button>

<md-button class="md-button md-raised md-accent" ng-click="$ctrl.downloadBuffer({ $event: $event})">
            <md-icon>download</md-icon>
            <span hide-sm hide-xs>{{ $root.p3xr.strings.intention.downloadBuffer }}</span>
            <md-tooltip ng-if="$root.$mdMedia('sm') || $root.$mdMedia('xs')" md-direction="bottom">{{
                $root.p3xr.strings.intention.downloadBuffer }}
            </md-tooltip>
        </md-button>

<md-button class="md-button md-raised md-accent" ng-click="$ctrl.jsonViewer({ $event: $event})">
            <md-icon>table_chart</md-icon>
            <span hide-sm hide-xs>{{ $root.p3xr.strings.intention.jsonViewShow }}</span>
            <md-tooltip ng-if="$root.$mdMedia('sm') || $root.$mdMedia('xs')" md-direction="bottom">{{
                $root.p3xr.strings.intention.jsonViewShow }}
            </md-tooltip>
        </md-button>

<md-button class="md-button md-raised md-accent" ng-click="$ctrl.copy({ $event: $event})">
            <md-icon>content_copy</md-icon>
            <span hide-sm hide-xs>{{ $root.p3xr.strings.intention.copy }}</span>
            <md-tooltip ng-if="$root.$mdMedia('sm') || $root.$mdMedia('xs')" md-direction="bottom">{{
                $root.p3xr.strings.intention.copy }}
            </md-tooltip>
        </md-button>

<md-button class="md-button md-raised md-primary" ng-click="$ctrl.formatJson({ $event: $event})" ng-if="$root.p3xr.state.connection.readonly !== true">
            <md-icon>format_line_spacing</md-icon>
            <span hide-sm hide-xs>{{ $root.p3xr.strings.intention.formatJson }}</span>
            <md-tooltip ng-if="$root.$mdMedia('sm') || $root.$mdMedia('xs')" md-direction="bottom">{{
                $root.p3xr.strings.intention.formatJson }}
            </md-tooltip>
        </md-button>

<md-button class="md-button md-raised md-primary" ng-click="$ctrl.jsonEditor({ $event: $event})" ng-if="$root.p3xr.state.donated">
            <i class="fas fa-file-alt"></i>
            <span hide-sm hide-xs>{{ $root.p3xr.strings.intention.jsonViewEditor }}</span>
            <md-tooltip ng-if="$root.$mdMedia('sm') || $root.$mdMedia('xs')" md-direction="bottom">{{
                $root.p3xr.strings.intention.jsonViewEditor }}
            </md-tooltip>
        </md-button>

<md-button class="md-button md-raised md-primary" ng-click="$ctrl.edit()">
            <md-icon>edit</md-icon>
             <span hide-sm hide-xs>{{ $root.p3xr.strings.intention.edit }}</span>
            <md-tooltip ng-if="$root.$mdMedia('sm') || $root.$mdMedia('xs')" md-direction="bottom">{{ $root.p3xr.strings.intention.edit }}</md-tooltip>
        </md-button>
    </span>

<span ng-if="$ctrl.editable">
        <div layout="row" layout-align="end center">
            <div>
                <md-switch ng-model="$ctrl.validateJson" class="md-accent" style="float: right;" ng-if="$root.p3xr.state.connection.readonly !== true">
                    {{ $root.p3xr.strings.label.validateJson }}
                </md-switch>               
            </div>
            <div>
                <md-button class="md-button md-raised md-warn" ng-click="$ctrl.cancelEdit()" md-autofocus>
                    <md-icon>cancel</md-icon>
                     <span hide-sm hide-xs>{{ $root.p3xr.strings.intention.cancel }}</span>
                    <md-tooltip ng-if="$root.$mdMedia('sm') || $root.$mdMedia('xs')" md-direction="bottom">{{ $root.p3xr.strings.intention.cancel }}</md-tooltip>
                </md-button>
            </div>
            <md-button class="md-button md-raised md-primary" ng-click="$ctrl.setBufferUpload({ $event: $event})"  ng-if="$root.p3xr.state.connection.readonly !== true">
                <md-icon>upload</md-icon>
                <span hide-sm hide-xs>{{ $root.p3xr.strings.intention.setBuffer }}</span>
                <md-tooltip ng-if="$root.$mdMedia('sm') || $root.$mdMedia('xs')" md-direction="bottom">{{
                    $root.p3xr.strings.intention.setBuffer }}
                </md-tooltip>
            </md-button>        
            <div>
                <md-button class="md-button md-raised md-primary" ng-click="$ctrl.save()" ng-if="$root.p3xr.state.connection.readonly !== true">
                    <md-icon>save</md-icon>
                     <span hide-sm hide-xs>{{ $root.p3xr.strings.intention.save }}</span>
                    <md-tooltip ng-if="$root.$mdMedia('sm') || $root.$mdMedia('xs')" md-direction="bottom">{{ $root.p3xr.strings.intention.save }}</md-tooltip>
                </md-button>
            </div>
        </div>

</span>

</div>

<div layout-padding>
    <div style="max-width: 100%; overflow: auto;" ng-click="$ctrl.edit()" ng-if="!$ctrl.editable">
        <span ng-if="$root.p3xr.settings.maxValueDisplay > -1">
            <span class="p3xr-pre" ng-if="$root.p3xr.settings.maxValueDisplay > 0 && $ctrl.p3xrValue.length > $root.p3xr.settings.maxValueDisplay">{{ $ctrl.p3xrValue.substring(0, $root.p3xr.settings.maxValueDisplay) }}...</span>
            <span class="p3xr-pre" ng-if="$root.p3xr.settings.maxValueDisplay === 0 || $ctrl.p3xrValue.length <= $root.p3xr.settings.maxValueDisplay">{{ $ctrl.p3xrValue }}</span>
        </span>
    </div>

<div ng-if="$ctrl.editable">        
        <md-input-container class="md-block">
            <label>{{ $root.p3xr.strings.label.edit }}</label>            
            <div class="p3xr-md-input-container-bottom-info" ng-if="$ctrl.p3xrValue && $ctrl.p3xrValue.toString() === '[object ArrayBuffer]'">
                {{ $root.p3xr.strings.label.isBuffer({ maxValueAsBuffer: $root.p3xr.settings.prettyBytes($root.p3xr.settings.maxValueAsBuffer)}) }}  {{$ctrl.bufferDisplay($ctrl.p3xrValue)}}
            </div>
            <textarea ng-model="$ctrl.p3xrValue" ng-if="!$ctrl.buffer" p3x-validate-json
                      p3x-validate-json-required="validateJson"></textarea>
            <span  ng-if="$ctrl.buffer">
                <div class="p3xr-md-input-container-bottom-info">
                    {{ $root.p3xr.strings.label.isBuffer({ maxValueAsBuffer: $root.p3xr.settings.prettyBytes($root.p3xr.settings.maxValueAsBuffer)}) }}  {{$ctrl.bufferDisplay($ctrl.p3xrValueBuffer)}}
                </div>
                <textarea ng-model="$ctrl.p3xrValueBuffer" p3x-validate-json
                    p3x-validate-json-required="validateJson"></textarea>
            </span>                      
    
        </md-input-container>
    </div>
</div>

`/`	Focus search
`?`	Show this help
`Esc`	Unfocus input