ADD buton for preview

This commit is contained in:
Krivchikov Dmitry 2015-02-01 15:32:09 +03:00
parent 0e95f49058
commit d2224e4e47
1 changed files with 23 additions and 0 deletions

View File

@ -6,6 +6,7 @@
<h4 class="modal-title" id="myModalLabel">Добавление новой точки</h4>
</div>
<div class="modal-body" style="padding-bottom: 0;">
<img id="imgPreview" style="display: none; position: absolute; top: 10px; left: 180px; height: 150px; border: solid 3px #777;" src="" onclick="hidePerview()"/>
<form method="POST" action="/json/addpoint/" id="addPointForm" enctype="multipart/form-data">
<div class="form-group">
<label class="control-label" for="name">Название</label>
@ -59,6 +60,7 @@
<div class="input-group">
<div class="input-group-addon type ico" title="Укажите ссылку на изображение"><input type="hidden" class="ordering" name="ordering[]" value="LINK" /><span class="glyphicon glyphicon-link"></span></div>
<input type="text" name="imgs[]" class="form-control images" placeholder="http://" />
<div class="input-group-addon type preview" style="border-left: 0;" onclick="showPreview($(this))" title="Предпросмотр"><span class="glyphicon glyphicon-eye-open"></span></div>
<div class="input-group-addon type button" onclick="switchType($(this))" title="Изменить поле на загрузку файла"><span class="glyphicon glyphicon-transfer"></span></div>
<div class="input-group-addon remove button" onclick="removeInput($(this))" title="Удалить это поле"><span class="glyphicon glyphicon-trash"></span></div>
</div>
@ -98,6 +100,7 @@
container.removeClass('asLink');
el.attr('title', 'Указать ссылку на изображение');
$('.input-group-addon.type.ico', container).attr('title', 'Загрузите файл с изображением');
$('.input-group-addon.type.preview', container).hide();
}
else
{
@ -107,6 +110,26 @@
container.addClass('asLink');
el.attr('title', 'Загрузить файл');
$('.input-group-addon.type.ico', container).attr('title', 'Укажите ссылку на изображение');
$('.input-group-addon.type.preview', container).show();
}
}
function showPreview(el) {
img = $('input.images',el.parent()).val();
if ($('input.ordering',el.parent()).val() == 'FILE' || img.length < 12) {
return true;
}
if (img.toLowerCase().indexOf('http') == -1 ) {
img = '/photos/small/' + img;
}
$('#imgPreview').attr('src', img);
$('#imgPreview').show();
}
function hidePerview() {
$('#imgPreview').hide();
}
</script>