96 lines
4.5 KiB
HTML
96 lines
4.5 KiB
HTML
<template name="imageDownloadDialog">
|
|
{{#dialogForm (extend this
|
|
title='Download High Quality Image'
|
|
class='themed'
|
|
dialogClass='modal-lg'
|
|
formClass='form-themed'
|
|
confirmLabel='Download'
|
|
cancelLabel='Cancel'
|
|
id='imageDownloadDialog'
|
|
schema=instance.schema
|
|
)}}
|
|
<h5>Please specify the dimensions, filename, and desired type for the output image.</h5>
|
|
<div class="card-round">
|
|
<div class="row m-t-2">
|
|
<div class="col-lg-4">
|
|
<table class="full-width">
|
|
<tbody>
|
|
<tr>
|
|
<td class="text-right p-r-1">Width</td>
|
|
<td>{{>inputText key='width'}}</td>
|
|
<td class="p-l-1" rowspan="2">
|
|
<button class="btn btn-secondary js-keep-aspect {{#if keepAspect}}active{{/if}}" title="Keep aspect ratio">
|
|
<i class="fa fa-chain{{#unless keepAspect}}-broken{{/unless}}"></i>
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-right p-r-1">Height</td>
|
|
<td>{{>inputText key='height'}}</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="col-lg-5">
|
|
<table class="full-width">
|
|
<tbody>
|
|
<tr>
|
|
<td class="text-right p-r-1">File name</td>
|
|
<td>{{>inputText key='name'}}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-right p-r-1">File type</td>
|
|
<td>{{>inputSelect key='type'}}</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="col-lg-3">{{>inputCheckbox key='showAnnotations'}}</div>
|
|
</div>
|
|
</div>
|
|
<div class="viewport-element hidden"></div>
|
|
<img class="viewport-preview" />
|
|
{{/dialogForm}}
|
|
<!--
|
|
<dialog id="downloadDialog">
|
|
{{#form id='downloadDialogForm' schema=instance.schema api=instance.api}}
|
|
<div class="instructions">Please specify the dimensions, filename, and desired type for the output image.</div>
|
|
<div class="form-group row">
|
|
<div class="col-sm-8">
|
|
<div class="input-group">
|
|
<input type="text" id="fileName" class="form-control fileName" aria-label="File name input">
|
|
<div class="input-group-btn">
|
|
<button type="button" class="btn btn-secondary dropdown-toggle extension" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">png</button>
|
|
<div class="dropdown-menu dropdown-menu-right">
|
|
<a class="dropdown-item" href="#">png</a>
|
|
<a class="dropdown-item" href="#">jpeg</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="form-check col-sm-4">
|
|
<label class="form-check-label">
|
|
<input type="checkbox" class="form-check-input"> Show Annotations
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label for="width" class="col-sm-2 col-form-label">Width (px):</label>
|
|
<div class="col-sm-4">
|
|
<input type="number" name="width" id="width" class="form-control" value="300"/>
|
|
</div>
|
|
<label for="height" class="col-sm-2 col-form-label">Height (px):</label>
|
|
<div class="col-sm-4">
|
|
<input type="number" name="height" id="height" class="form-control" value="200"/>
|
|
</div>
|
|
</div>
|
|
<div id="previewElement"></div>
|
|
<div class="form-group button-holder row">
|
|
<button class="btn btn-danger col-sm-offset-2 col-sm-3 cancel">cancel</button>
|
|
<button class="btn btn-primary col-sm-offset-2 col-sm-3 download">download</button>
|
|
</div>
|
|
{{/form}}
|
|
</dialog>
|
|
-->
|
|
</template>
|