tami/brother_ql_web
6
0
Fork 0
mirror of https://github.com/pklaus/brother_ql_web.git synced 2024-05-25 11:56:53 +03:00
Code Issues Packages Projects Releases Wiki Activity

new: margins can be specified in the web UI

Browse Source
This commit is contained in:
Philipp Klaus 2017-02-10 10:07:38 +01:00
parent dc79624e1d
commit 7bf6b40c94
1 changed files with 27 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
views/labeldesigner.jinja2
View File

@ -78,7 +78,15 @@
</div>
<div id="collapse3" class="panel-collapse collapse">
<div class="chooser panel-body">
Some more settings will show here, once implemented.
<label for="marginTop">Margin Top:</label>
<input id="marginTop" class="form-control" type="number" min="0" max="200" value="24" onChange="preview()" required>
<label for="marginBottom">Margin Bottom:</label>
<input id="marginBottom" class="form-control" type="number" min="0" max="200" value="45" onChange="preview()" required>
<label for="marginLeft">Margin Left:</label>
<input id="marginLeft" class="form-control" type="number" min="0" max="200" value="35" onChange="preview()" required>
<label for="marginRight">Margin Right:</label>
<input id="marginRight" class="form-control" type="number" min="0" max="200" value="35" onChange="preview()" required>
(margins in % of font size)
</div> <!-- class="chooser panel-body" -->
</div>
</div>
@ -125,11 +133,28 @@ function formData() {
font_size: $('#fontSize').val(),
label_size: $('#labelSize option:selected').val(),
align: $('input[name=fontAlign]:checked').val(),
orientation: $('input[name=orientation]:checked').val()
orientation: $('input[name=orientation]:checked').val(),
margin_top: $('#marginTop').val(),
margin_bottom: $('#marginBottom').val(),
margin_left: $('#marginLeft').val(),
margin_right: $('#marginRight').val()
}
}
function preview() {
// http://stackoverflow.com/a/16284355
// http://stackoverflow.com/a/7697455
if ($('input[name=orientation]:checked').val() == 'standard') {
$('#marginTop').prop('disabled', false).removeAttr('title');
$('#marginBottom').prop('disabled',false).removeAttr('title');
$('#marginLeft').prop('disabled', true).prop('title', 'Only relevant if rotated orientation is selected.');
$('#marginRight').prop('disabled', true).prop('title', 'Only relevant if rotated orientation is selected.');
} else {
$('#marginTop').prop('disabled', true).prop('title', 'Only relevant if standard orientation is selected.');
$('#marginBottom').prop('disabled',true).prop('title', 'Only relevant if standard orientation is selected.');
$('#marginLeft').prop('disabled', false).removeAttr('title');
$('#marginRight').prop('disabled', false).removeAttr('title');
}
$.ajax({
type: 'POST',
url: '/api/preview/text?return_format=base64',