Symfony Profiler

{# コンセプト #}
<script>
$(document).on('drop dragover', function(e) {
e.preventDefault();
});
$(function() {
// ファイルアップロード
// see https://pqina.nl/filepond/
{% if eccube_config.locale == 'ja' or eccube_config.locale == 'en' %}
FilePond.setOptions(FilePondLocale_{{ eccube_config.locale }});
{% endif %}
{% set conceptFiles = [
{
'fileKey': 'concept_file_pc',
'fileNameKey': 'concept_file_name_pc',
},
{
'fileKey': 'concept_file_sp',
'fileNameKey': 'concept_file_name_sp',
}
] %}
{% for conceptFile in conceptFiles %}
var inputFileElement = document.querySelector('input[type=file][id="{{ form[conceptFile.fileKey].vars.id }}"]');
var pondConcept{{ loop.index0 }} = FilePond.create(inputFileElement, {
allowFileTypeValidation: true,
acceptedFileTypes: [
'image/gif',
'image/png',
'image/jpeg'
],
allowFileSizeValidation: true,
maxFileSize: 10000000,
maxFiles: 1,
allowBrowse: true,
labelIdle: '{{ 'admin.common.drag_and_drop_image_description'|trans }}<span class="filepond--label-action">{{ 'admin.common.file_select'|trans }}</span>',
// 保存されている画像のロード
files: [
{% if form[conceptFile.fileNameKey].vars.value is not empty %}
{
source: '{{ form[conceptFile.fileNameKey].vars.value }}',
options: {
type: 'local'
}
}
{% endif %}
],
server: {
process: {
url: '{{ path('admin_product_image_process_key', { entity_name: '', key_name: conceptFile.fileKey }) }}',
headers: {
'ECCUBE-CSRF-TOKEN': $('meta[name="eccube-csrf-token"]').attr('content'),
'X-Requested-With': 'XMLHttpRequest'
}
},
load: {
url: '{{ path('admin_product_image_load') }}?source=',
headers: {
'X-Requested-With': 'XMLHttpRequest'
}
},
revert: {
url: '{{ path('admin_product_image_revert') }}',
headers: {
'ECCUBE-CSRF-TOKEN': $('meta[name="eccube-csrf-token"]').attr('content'),
'X-Requested-With': 'XMLHttpRequest'
}
}
}
});
pondConcept{{ loop.index0 }}.on('initfile', function() {
$('#{{ form[conceptFile.fileNameKey].vars.id }}_error').hide();
});
pondConcept{{ loop.index0 }}.on('error', function(error, file) {
var message = '{{ 'admin.common.upload_error'|trans }}';
if (error.main !== undefined) {
message = `${error.main}: ${error.sub}`;
}
$('#{{ form[conceptFile.fileNameKey].vars.id }}_error')
.show()
.find('.form-error-message').text(message);
// エラーメッセージが表示されてからプレビューエリアのエラーメッセージを非表示にする
setTimeout(function() {
$('.filepond--file-status').hide();
}, 300);
});
// 画像が追加されたらファイル名を追加する
pondConcept{{ loop.index0 }}.on('processfile', function(error, file) {
if (error) {
console.log(error);
} else {
$('#{{ form[conceptFile.fileNameKey].vars.id }}').val(file.serverId);
}
});
// 画像が削除されたらファイル名を削除する
pondConcept{{ loop.index0 }}.on('removefile', function(error, file) {
if (error) {
console.log(error);
} else {
$('#{{ form[conceptFile.fileNameKey].vars.id }}').val('');
}
});
{% endfor %}
});
</script>
{# ムービー&ギャラリー #}
<script>
$(document).on('drop dragover', function(e) {
e.preventDefault();
});
$(function () {
// ファイルアップロード
// see https://pqina.nl/filepond/
var inputFileElement = document.querySelector('input[type=file][id="admin_product_product_gallery"');
{% if eccube_config.locale == 'ja' or eccube_config.locale == 'en' %}
FilePond.setOptions(FilePondLocale_{{ eccube_config.locale }});
{% endif %}
FilePond.setOptions();
var pond = FilePond.create(inputFileElement, {
allowFileTypeValidation: true,
acceptedFileTypes: [
'image/gif',
'image/png',
'image/jpeg'
],
allowFileSizeValidation: true,
maxFileSize: 10000000,
allowBrowse: true,
allowDrop: true,
allowReorder: true,
labelIdle: '<i class="fa fa-cloud-upload fa-3x text-ec-lightGray mx-3 align-middle" aria-hidden="true" style="font-size: 40px"></i>{{ 'admin.common.drag_and_drop_image_description'|trans }}<span class="filepond--label-action">{{ 'admin.common.file_select'|trans }}</span>',
styleItemPanelAspectRatio: 0.5625,
// 保存されている画像のロード
files: [
{% for image in form.gallery_images %}
{
source: '{{ image.vars.value }}',
options: {
type: 'local'
}
},
{% endfor %}
// 追加してすぐの画像のロード. バリデーションエラーの場合など.
{% for add_image in form.gallery_add_images %}
{
source: '{{ add_image.vars.value }}',
options: {
type: 'local'
}
},
{% endfor %}
],
server: {
process: {
url: '{{ path('admin_product_image_process') }}',
headers: {
'ECCUBE-CSRF-TOKEN': $('meta[name="eccube-csrf-token"]').attr('content'),
'X-Requested-With': 'XMLHttpRequest'
}
},
load: {
url: '{{ path('admin_product_image_load') }}?source=',
headers: {
'X-Requested-With': 'XMLHttpRequest'
}
},
revert: {
url: '{{ path('admin_product_image_revert') }}',
headers: {
'ECCUBE-CSRF-TOKEN': $('meta[name="eccube-csrf-token"]').attr('content'),
'X-Requested-With': 'XMLHttpRequest'
}
}
}
});
// 画像が追加されたら gallery_add_images にファイル名を追加する
var proto_add = '{{ form_widget(form.gallery_add_images.vars.prototype) }}';
pond.on('processfile', function(error, file) {
if (error) {
console.log(error);
} else {
$('#upload-zone').append(
$(proto_add.replace(/__name__/g, file.id))
.val(file.serverId)
.addClass('gallery_add_images')
);
}
});
// 画像が削除されたら gallery_delete_images にファイル名を追加する
var proto_del = '{{ form_widget(form.gallery_delete_images.vars.prototype) }}';
pond.on('removefile', function(error, file) {
if (error) {
console.log(error);
} else {
// file.serverId にはアップロードしたファイル名が格納される.
if (file.serverId) {
$('#upload-zone').append(
$(proto_del.replace(/__name__/g, file.id))
.val(file.serverId)
.addClass('del_images')
);
}
// 追加してすぐ削除した画像があれば削除する
$('#upload-zone').find('#admin_product_gallery_add_images_' + file.id).remove(); // 追加してすぐ削除した画像
$('#upload-zone').find('.gallery_add_images[value="' + file.filename + '"]').remove(); // 追加後, バリデーションエラーが発生した後に削除した画像
}
});
pond.on('initfile', function() {
$('#product_image_error').hide();
});
pond.on('error', function(error, file) {
var message = '{{ 'admin.common.upload_error'|trans }}';
if (error.main !== undefined) {
message = `${error.main}: ${error.sub}`;
}
$('#product_image_error')
.show()
.find('.form-error-message').text(message);
// エラーメッセージが表示されてからプレビューエリアのエラーメッセージを非表示にする
setTimeout(function() {
$('.filepond--file-status').hide();
}, 300);
});
// バリデーションエラーが出た場合に画像を保持するための hidden を追加しておく
var proto_image = '{{ form_widget(form.gallery_images.vars.prototype) }}';
{% for image in form.gallery_images %}
$('#upload-zone').append(
$(proto_image.replace(/__name__/g, '{{ loop.index0 }}'))
.val('{{ image.vars.value }}')
.addClass('gallery_images')
);
{% endfor %}
{% for add_image in form.gallery_add_images %}
$('#upload-zone').append(
$('{{ form_widget(add_image) }}')
.val('{{ add_image.vars.value }}')
.addClass('gallery_add_images')
);
{% endfor %}
{% for delete_image in form.gallery_delete_images %}
$('#upload-zone').append(
$('{{ form_widget(delete_image) }}').addClass('del_images')
);
{% endfor %}
});
</script>
{# 商品仕様(詳細) #}
<script>
$(document).on('drop dragover', function(e) {
e.preventDefault();
});
$(function () {
// ファイルアップロード
// see https://pqina.nl/filepond/
var inputFileElement = document.querySelector('input[type=file][id="admin_product_product_detail_image"');
{% if eccube_config.locale == 'ja' or eccube_config.locale == 'en' %}
FilePond.setOptions(FilePondLocale_{{ eccube_config.locale }});
{% endif %}
FilePond.setOptions();
var pond = FilePond.create(inputFileElement, {
allowFileTypeValidation: true,
acceptedFileTypes: [
'image/gif',
'image/png',
'image/jpeg'
],
allowFileSizeValidation: true,
maxFileSize: 10000000,
allowBrowse: true,
allowDrop: true,
allowReorder: true,
labelIdle: '<i class="fa fa-cloud-upload fa-3x text-ec-lightGray mx-3 align-middle" aria-hidden="true" style="font-size: 40px"></i>{{ 'admin.common.drag_and_drop_image_description'|trans }}<span class="filepond--label-action">{{ 'admin.common.file_select'|trans }}</span>',
styleItemPanelAspectRatio: 0.5625,
// 保存されている画像のロード
files: [
{% for image in form.detail_images %}
{
source: '{{ image.vars.value }}',
options: {
type: 'local'
}
},
{% endfor %}
// 追加してすぐの画像のロード. バリデーションエラーの場合など.
{% for add_image in form.detail_add_images %}
{
source: '{{ add_image.vars.value }}',
options: {
type: 'local'
}
},
{% endfor %}
],
server: {
process: {
url: '{{ path('admin_product_image_process') }}',
headers: {
'ECCUBE-CSRF-TOKEN': $('meta[name="eccube-csrf-token"]').attr('content'),
'X-Requested-With': 'XMLHttpRequest'
}
},
load: {
url: '{{ path('admin_product_image_load') }}?source=',
headers: {
'X-Requested-With': 'XMLHttpRequest'
}
},
revert: {
url: '{{ path('admin_product_image_revert') }}',
headers: {
'ECCUBE-CSRF-TOKEN': $('meta[name="eccube-csrf-token"]').attr('content'),
'X-Requested-With': 'XMLHttpRequest'
}
}
}
});
// 画像が追加されたら detail_add_images にファイル名を追加する
var proto_add = '{{ form_widget(form.detail_add_images.vars.prototype) }}';
pond.on('processfile', function(error, file) {
if (error) {
console.log(error);
} else {
$('#upload-zone').append(
$(proto_add.replace(/__name__/g, file.id))
.val(file.serverId)
.addClass('detail_add_images')
);
}
});
// 画像が削除されたら detail_delete_images にファイル名を追加する
var proto_del = '{{ form_widget(form.detail_delete_images.vars.prototype) }}';
pond.on('removefile', function(error, file) {
if (error) {
console.log(error);
} else {
// file.serverId にはアップロードしたファイル名が格納される.
if (file.serverId) {
$('#upload-zone').append(
$(proto_del.replace(/__name__/g, file.id))
.val(file.serverId)
.addClass('del_images')
);
}
// 追加してすぐ削除した画像があれば削除する
$('#upload-zone').find('#admin_product_detail_add_images_' + file.id).remove(); // 追加してすぐ削除した画像
$('#upload-zone').find('.detail_add_images[value="' + file.filename + '"]').remove(); // 追加後, バリデーションエラーが発生した後に削除した画像
}
});
pond.on('initfile', function() {
$('#detail_image_error').hide();
});
pond.on('error', function(error, file) {
var message = '{{ 'admin.common.upload_error'|trans }}';
if (error.main !== undefined) {
message = `${error.main}: ${error.sub}`;
}
$('#detail_image_error')
.show()
.find('.form-error-message').text(message);
// エラーメッセージが表示されてからプレビューエリアのエラーメッセージを非表示にする
setTimeout(function() {
$('.filepond--file-status').hide();
}, 300);
});
// バリデーションエラーが出た場合に画像を保持するための hidden を追加しておく
var proto_image = '{{ form_widget(form.detail_images.vars.prototype) }}';
{% for image in form.detail_images %}
$('#upload-zone').append(
$(proto_image.replace(/__name__/g, '{{ loop.index0 }}'))
.val('{{ image.vars.value }}')
.addClass('detail_images')
);
{% endfor %}
{% for add_image in form.detail_add_images %}
$('#upload-zone').append(
$('{{ form_widget(add_image) }}')
.val('{{ add_image.vars.value }}')
.addClass('detail_add_images')
);
{% endfor %}
{% for delete_image in form.detail_delete_images %}
$('#upload-zone').append(
$('{{ form_widget(delete_image) }}').addClass('del_images')
);
{% endfor %}
});
</script>
{# 商品仕様(名入れ) #}
<script>
$(document).on('drop dragover', function(e) {
e.preventDefault();
});
$(function () {
// ファイルアップロード
// see https://pqina.nl/filepond/
var inputFileElement = document.querySelector('input[type=file][id="admin_product_product_naire_image"');
{% if eccube_config.locale == 'ja' or eccube_config.locale == 'en' %}
FilePond.setOptions(FilePondLocale_{{ eccube_config.locale }});
{% endif %}
FilePond.setOptions();
var pond = FilePond.create(inputFileElement, {
allowFileTypeValidation: true,
acceptedFileTypes: [
'image/gif',
'image/png',
'image/jpeg'
],
allowFileSizeValidation: true,
maxFileSize: 10000000,
allowBrowse: true,
allowDrop: true,
allowReorder: true,
labelIdle: '<i class="fa fa-cloud-upload fa-3x text-ec-lightGray mx-3 align-middle" aria-hidden="true" style="font-size: 40px"></i>{{ 'admin.common.drag_and_drop_image_description'|trans }}<span class="filepond--label-action">{{ 'admin.common.file_select'|trans }}</span>',
styleItemPanelAspectRatio: 0.5625,
// 保存されている画像のロード
files: [
{% for image in form.naire_images %}
{
source: '{{ image.vars.value }}',
options: {
type: 'local'
}
},
{% endfor %}
// 追加してすぐの画像のロード. バリデーションエラーの場合など.
{% for add_image in form.naire_add_images %}
{
source: '{{ add_image.vars.value }}',
options: {
type: 'local'
}
},
{% endfor %}
],
server: {
process: {
url: '{{ path('admin_product_image_process') }}',
headers: {
'ECCUBE-CSRF-TOKEN': $('meta[name="eccube-csrf-token"]').attr('content'),
'X-Requested-With': 'XMLHttpRequest'
}
},
load: {
url: '{{ path('admin_product_image_load') }}?source=',
headers: {
'X-Requested-With': 'XMLHttpRequest'
}
},
revert: {
url: '{{ path('admin_product_image_revert') }}',
headers: {
'ECCUBE-CSRF-TOKEN': $('meta[name="eccube-csrf-token"]').attr('content'),
'X-Requested-With': 'XMLHttpRequest'
}
}
}
});
// 画像が追加されたら naire_add_images にファイル名を追加する
var proto_add = '{{ form_widget(form.naire_add_images.vars.prototype) }}';
pond.on('processfile', function(error, file) {
if (error) {
console.log(error);
} else {
$('#upload-zone').append(
$(proto_add.replace(/__name__/g, file.id))
.val(file.serverId)
.addClass('naire_add_images')
);
}
});
// 画像が削除されたら naire_delete_images にファイル名を追加する
var proto_del = '{{ form_widget(form.naire_delete_images.vars.prototype) }}';
pond.on('removefile', function(error, file) {
if (error) {
console.log(error);
} else {
// file.serverId にはアップロードしたファイル名が格納される.
if (file.serverId) {
$('#upload-zone').append(
$(proto_del.replace(/__name__/g, file.id))
.val(file.serverId)
.addClass('del_images')
);
}
// 追加してすぐ削除した画像があれば削除する
$('#upload-zone').find('#admin_product_naire_add_images_' + file.id).remove(); // 追加してすぐ削除した画像
$('#upload-zone').find('.naire_add_images[value="' + file.filename + '"]').remove(); // 追加後, バリデーションエラーが発生した後に削除した画像
}
});
pond.on('initfile', function() {
$('#naire_image_error').hide();
});
pond.on('error', function(error, file) {
var message = '{{ 'admin.common.upload_error'|trans }}';
if (error.main !== undefined) {
message = `${error.main}: ${error.sub}`;
}
$('#naire_image_error')
.show()
.find('.form-error-message').text(message);
// エラーメッセージが表示されてからプレビューエリアのエラーメッセージを非表示にする
setTimeout(function() {
$('.filepond--file-status').hide();
}, 300);
});
// バリデーションエラーが出た場合に画像を保持するための hidden を追加しておく
var proto_image = '{{ form_widget(form.naire_images.vars.prototype) }}';
{% for image in form.naire_images %}
$('#upload-zone').append(
$(proto_image.replace(/__name__/g, '{{ loop.index0 }}'))
.val('{{ image.vars.value }}')
.addClass('naire_images')
);
{% endfor %}
{% for add_image in form.naire_add_images %}
$('#upload-zone').append(
$('{{ form_widget(add_image) }}')
.val('{{ add_image.vars.value }}')
.addClass('naire_add_images')
);
{% endfor %}
{% for delete_image in form.naire_delete_images %}
$('#upload-zone').append(
$('{{ form_widget(delete_image) }}').addClass('del_images')
);
{% endfor %}
});
</script>
{# 製作者紹介 #}
<script>
$(document).on('drop dragover', function(e) {
e.preventDefault();
});
$(function() {
// ファイルアップロード
// see https://pqina.nl/filepond/
{% if eccube_config.locale == 'ja' or eccube_config.locale == 'en' %}
FilePond.setOptions(FilePondLocale_{{ eccube_config.locale }});
{% endif %}
var inputFileElement = document.querySelector('input[type=file][id="{{ form.producer_file.vars.id }}"]');
var pond = FilePond.create(inputFileElement, {
allowFileTypeValidation: true,
acceptedFileTypes: [
'image/gif',
'image/png',
'image/jpeg'
],
allowFileSizeValidation: true,
maxFileSize: 10000000,
maxFiles: 1,
allowBrowse: true,
labelIdle: '{{ 'admin.common.drag_and_drop_image_description'|trans }}<span class="filepond--label-action">{{ 'admin.common.file_select'|trans }}</span>',
// 保存されている画像のロード
files: [
{% if form.producer_file_name.vars.value is not empty %}
{
source: '{{ form.producer_file_name.vars.value }}',
options: {
type: 'local'
}
}
{% endif %}
],
server: {
process: {
url: '{{ path('admin_product_image_process_key', { key_name: 'producer_file' }) }}',
headers: {
'ECCUBE-CSRF-TOKEN': $('meta[name="eccube-csrf-token"]').attr('content'),
'X-Requested-With': 'XMLHttpRequest'
}
},
load: {
url: '{{ path('admin_product_image_load') }}?source=',
headers: {
'X-Requested-With': 'XMLHttpRequest'
}
},
revert: {
url: '{{ path('admin_product_image_revert') }}',
headers: {
'ECCUBE-CSRF-TOKEN': $('meta[name="eccube-csrf-token"]').attr('content'),
'X-Requested-With': 'XMLHttpRequest'
}
}
}
});
pond.on('initfile', function() {
$('#{{ form.producer_file_name.vars.id }}_error').hide();
});
pond.on('error', function(error, file) {
var message = '{{ 'admin.common.upload_error'|trans }}';
if (error.main !== undefined) {
message = `${error.main}: ${error.sub}`;
}
$('#{{ form.producer_file_name.vars.id }}_error')
.show()
.find('.form-error-message').text(message);
// エラーメッセージが表示されてからプレビューエリアのエラーメッセージを非表示にする
setTimeout(function() {
$('.filepond--file-status').hide();
}, 300);
});
// 画像が追加されたらファイル名を追加する
pond.on('processfile', function(error, file) {
if (error) {
console.log(error);
} else {
$('#{{ form.producer_file_name.vars.id }}').val(file.serverId);
}
});
// 画像が削除されたらファイル名を削除する
pond.on('removefile', function(error, file) {
if (error) {
console.log(error);
} else {
$('#{{ form.producer_file_name.vars.id }}').val('');
}
});
});
</script>

src/Eccube/Resource/template/admin/Product/_parts/js_product_other_image.twig line 1