535 lines
31 KiB
PHP
535 lines
31 KiB
PHP
<?php
|
|
|
|
use humhub\modules\animal_management\models\forms\AnimalForm;
|
|
use humhub\modules\animal_management\models\forms\DisplaySettingsForm;
|
|
use humhub\modules\animal_management\models\Animal;
|
|
use humhub\modules\rescue_foundation\components\UploadStandards;
|
|
use humhub\modules\space\models\Space;
|
|
use humhub\widgets\Button;
|
|
use yii\bootstrap\ActiveForm;
|
|
use yii\helpers\Html;
|
|
|
|
/* @var AnimalForm $model */
|
|
/* @var Space $space */
|
|
/* @var bool $isEdit */
|
|
/* @var Animal|null $animal */
|
|
?>
|
|
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<?php if (!empty($isEdit)): ?>
|
|
<?= Yii::t('AnimalManagementModule.base', '<strong>Edit Animal</strong> Profile') ?>
|
|
<?php else: ?>
|
|
<?= Yii::t('AnimalManagementModule.base', '<strong>New Animal</strong> Intake') ?>
|
|
<?php endif; ?>
|
|
</div>
|
|
<div class="panel-body">
|
|
<?php $form = ActiveForm::begin(['options' => ['enctype' => 'multipart/form-data']]); ?>
|
|
|
|
<?= $form->errorSummary($model, ['showAllErrors' => true]) ?>
|
|
|
|
<?php
|
|
$customDefinitions = $model->getCustomFieldDefinitions();
|
|
$galleryImageOptions = $model->getGalleryImageOptions();
|
|
$galleryImageUrls = array_keys($galleryImageOptions);
|
|
|
|
$knownProfileFieldKeys = [
|
|
'dob',
|
|
'age',
|
|
'rescue',
|
|
'lineage',
|
|
'backstory',
|
|
'previous_owner_user_id',
|
|
'previous_owner_name',
|
|
'previous_owner_business_name',
|
|
'previous_owner_street_address',
|
|
'previous_owner_city',
|
|
'previous_owner_state',
|
|
'previous_owner_zip',
|
|
'previous_owner_cell_phone',
|
|
'previous_owner_business_phone',
|
|
'previous_owner_email',
|
|
];
|
|
|
|
$renderCustomField = static function (string $fieldKey, AnimalForm $model, array $definitions): string {
|
|
if (!isset($definitions[$fieldKey])) {
|
|
return '';
|
|
}
|
|
|
|
$definition = $definitions[$fieldKey];
|
|
$inputType = (string)$definition['input_type'];
|
|
$label = (string)$definition['label'];
|
|
if ((int)$definition['required'] === 1) {
|
|
$label .= ' *';
|
|
}
|
|
|
|
$fieldName = "AnimalForm[customFields][$fieldKey]";
|
|
$fieldValue = $model->customFields[$fieldKey] ?? '';
|
|
|
|
ob_start();
|
|
?>
|
|
<?php if ($inputType === 'textarea'): ?>
|
|
<div class="form-group">
|
|
<label class="control-label" for="animalform-customfields-<?= Html::encode($fieldKey) ?>"><?= Html::encode($label) ?></label>
|
|
<?= Html::textarea($fieldName, (string)$fieldValue, ['class' => 'form-control', 'rows' => 3, 'id' => "animalform-customfields-$fieldKey"]) ?>
|
|
</div>
|
|
<?php elseif ($inputType === 'boolean'): ?>
|
|
<div class="checkbox" style="margin-bottom:10px;">
|
|
<label>
|
|
<?= Html::hiddenInput($fieldName, '0') ?>
|
|
<?= Html::checkbox($fieldName, !empty($fieldValue), ['value' => '1']) ?>
|
|
<?= Html::encode($label) ?>
|
|
</label>
|
|
</div>
|
|
<?php elseif ($inputType === 'select'): ?>
|
|
<div class="form-group">
|
|
<label class="control-label" for="animalform-customfields-<?= Html::encode($fieldKey) ?>"><?= Html::encode($label) ?></label>
|
|
<?= Html::dropDownList(
|
|
$fieldName,
|
|
(string)$fieldValue,
|
|
$model->getCustomFieldSelectOptions($fieldKey),
|
|
['class' => 'form-control', 'prompt' => Yii::t('AnimalManagementModule.base', 'Select...'), 'id' => "animalform-customfields-$fieldKey"]
|
|
) ?>
|
|
</div>
|
|
<?php elseif ($inputType === 'number'): ?>
|
|
<div class="form-group">
|
|
<label class="control-label" for="animalform-customfields-<?= Html::encode($fieldKey) ?>"><?= Html::encode($label) ?></label>
|
|
<?= Html::input('number', $fieldName, (string)$fieldValue, ['class' => 'form-control', 'step' => 'any', 'id' => "animalform-customfields-$fieldKey"]) ?>
|
|
</div>
|
|
<?php elseif ($inputType === 'date'): ?>
|
|
<div class="form-group">
|
|
<label class="control-label" for="animalform-customfields-<?= Html::encode($fieldKey) ?>"><?= Html::encode($label) ?></label>
|
|
<?= Html::input('date', $fieldName, (string)$fieldValue, ['class' => 'form-control', 'id' => "animalform-customfields-$fieldKey"]) ?>
|
|
</div>
|
|
<?php elseif ($inputType === 'datetime'): ?>
|
|
<div class="form-group">
|
|
<label class="control-label" for="animalform-customfields-<?= Html::encode($fieldKey) ?>"><?= Html::encode($label) ?></label>
|
|
<?= Html::input('datetime-local', $fieldName, (string)$fieldValue, ['class' => 'form-control', 'id' => "animalform-customfields-$fieldKey"]) ?>
|
|
</div>
|
|
<?php else: ?>
|
|
<div class="form-group">
|
|
<label class="control-label" for="animalform-customfields-<?= Html::encode($fieldKey) ?>"><?= Html::encode($label) ?></label>
|
|
<?= Html::textInput($fieldName, (string)$fieldValue, ['class' => 'form-control', 'id' => "animalform-customfields-$fieldKey"]) ?>
|
|
</div>
|
|
<?php endif; ?>
|
|
<?php
|
|
return (string)ob_get_clean();
|
|
};
|
|
?>
|
|
|
|
<div class="panel panel-default" style="margin-bottom:14px;">
|
|
<div class="panel-heading"><strong><?= Yii::t('AnimalManagementModule.base', 'Profile & Cover Images') ?></strong></div>
|
|
<div class="panel-body" style="padding-bottom:8px;">
|
|
<div class="help-block" style="margin-top:0;">
|
|
<?= Yii::t('AnimalManagementModule.base', 'Tap the edit icon on either image to choose from gallery thumbnails or upload from device camera roll.') ?>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-sm-6" style="margin-bottom:10px;">
|
|
<div id="animal-cover-preview" style="position:relative;border-radius:10px;overflow:hidden;background:#eef1f4;min-height:180px;">
|
|
<?php if ($model->getExistingCoverImagePath()): ?>
|
|
<img src="<?= Html::encode($model->getExistingCoverImagePath()) ?>" alt="<?= Yii::t('AnimalManagementModule.base', 'Cover Image') ?>" style="width:100%;height:220px;object-fit:cover;display:block;">
|
|
<?php else: ?>
|
|
<div style="height:220px;display:flex;align-items:center;justify-content:center;color:#9ba5af;">
|
|
<i class="fa fa-image fa-3x"></i>
|
|
</div>
|
|
<?php endif; ?>
|
|
<button type="button" class="btn btn-default" data-toggle="modal" data-target="#animal-cover-image-manage-modal" style="position:absolute;top:10px;right:10px;border-radius:999px;">
|
|
<i class="fa fa-pencil"></i>
|
|
</button>
|
|
</div>
|
|
<div style="margin-top:6px;font-weight:600;"><?= Yii::t('AnimalManagementModule.base', 'Cover Image') ?></div>
|
|
</div>
|
|
<div class="col-sm-6" style="margin-bottom:10px;">
|
|
<div id="animal-profile-preview" style="position:relative;border-radius:10px;overflow:hidden;background:#eef1f4;min-height:180px;">
|
|
<?php if ($model->getExistingProfileImagePath()): ?>
|
|
<img src="<?= Html::encode($model->getExistingProfileImagePath()) ?>" alt="<?= Yii::t('AnimalManagementModule.base', 'Profile Image') ?>" style="width:100%;height:220px;object-fit:cover;display:block;">
|
|
<?php else: ?>
|
|
<div style="height:220px;display:flex;align-items:center;justify-content:center;color:#9ba5af;">
|
|
<i class="fa fa-user-circle fa-3x"></i>
|
|
</div>
|
|
<?php endif; ?>
|
|
<button type="button" class="btn btn-default" data-toggle="modal" data-target="#animal-profile-image-manage-modal" style="position:absolute;top:10px;right:10px;border-radius:999px;">
|
|
<i class="fa fa-pencil"></i>
|
|
</button>
|
|
</div>
|
|
<div style="margin-top:6px;font-weight:600;"><?= Yii::t('AnimalManagementModule.base', 'Profile Image') ?></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div style="display:none;">
|
|
<?= $form->field($model, 'coverImageGalleryPath')->hiddenInput()->label(false) ?>
|
|
<?= $form->field($model, 'profileImageGalleryPath')->hiddenInput()->label(false) ?>
|
|
<?= $form->field($model, 'coverImageFile')->fileInput(['accept' => 'image/*']) ?>
|
|
<?= $form->field($model, 'profileImageFile')->fileInput(['accept' => 'image/*']) ?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="panel panel-default" style="margin-bottom:14px;">
|
|
<div class="panel-heading"><strong><?= Yii::t('AnimalManagementModule.base', 'Details') ?></strong></div>
|
|
<div class="panel-body" style="padding-bottom:8px;">
|
|
<div class="row">
|
|
<div class="col-sm-6"><?php if ($model->isFieldActive('name')) { echo $form->field($model, 'name')->textInput(['maxlength' => 190]); } ?></div>
|
|
<div class="col-sm-6"><?php if ($model->isFieldActive('species')) { echo $form->field($model, 'species')->textInput(['maxlength' => 120]); } ?></div>
|
|
<div class="col-sm-6"><?php if ($model->isFieldActive('breed')) { echo $form->field($model, 'breed')->textInput(['maxlength' => 120]); } ?></div>
|
|
<div class="col-sm-6"><?php if ($model->isFieldActive('sex')) { echo $form->field($model, 'sex')->textInput(['maxlength' => 32]); } ?></div>
|
|
<div class="col-sm-6"><?= $renderCustomField('dob', $model, $customDefinitions) ?></div>
|
|
<div class="col-sm-6"><?= $renderCustomField('age', $model, $customDefinitions) ?></div>
|
|
<div class="col-sm-6"><?php if ($model->isFieldActive('status')) { echo $form->field($model, 'status')->dropDownList($model->getStatusOptions()); } ?></div>
|
|
<div class="col-sm-6"><?php if ($model->isFieldActive('in_possession')) { echo $form->field($model, 'in_possession')->checkbox(); } ?></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel panel-default" style="margin-bottom:14px;">
|
|
<div class="panel-heading"><strong><?= Yii::t('AnimalManagementModule.base', 'Location') ?></strong></div>
|
|
<div class="panel-body" style="padding-bottom:8px;">
|
|
<div class="row">
|
|
<div class="col-sm-6"><?= $renderCustomField('rescue', $model, $customDefinitions) ?></div>
|
|
<div class="col-sm-6"><?php if ($model->isFieldActive('location_name')) { echo $form->field($model, 'location_name')->textInput(['maxlength' => 120]); } ?></div>
|
|
<div class="col-sm-4"><?php if ($model->isFieldActive('city')) { echo $form->field($model, 'city')->textInput(['maxlength' => 120]); } ?></div>
|
|
<div class="col-sm-4"><?php if ($model->isFieldActive('state')) { echo $form->field($model, 'state')->textInput(['maxlength' => 2]); } ?></div>
|
|
<div class="col-sm-4"><?php if ($model->isFieldActive('zip')) { echo $form->field($model, 'zip')->textInput(['maxlength' => 10]); } ?></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel panel-default" style="margin-bottom:14px;">
|
|
<div class="panel-heading"><strong><?= Yii::t('AnimalManagementModule.base', 'History') ?></strong></div>
|
|
<div class="panel-body" style="padding-bottom:8px;">
|
|
<?= $renderCustomField('lineage', $model, $customDefinitions) ?>
|
|
<?= $renderCustomField('backstory', $model, $customDefinitions) ?>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel panel-default" style="margin-bottom:14px;">
|
|
<div class="panel-heading"><strong><?= Yii::t('AnimalManagementModule.base', 'Public') ?></strong></div>
|
|
<div class="panel-body" style="padding-bottom:8px;">
|
|
<?php if ($model->isFieldActive('public_summary')): ?>
|
|
<?= $form->field($model, 'public_summary')->textarea(['rows' => 4]) ?>
|
|
<?php endif; ?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-6">
|
|
<div class="panel panel-default" style="margin-bottom:14px;">
|
|
<div class="panel-heading"><strong><?= Yii::t('AnimalManagementModule.base', 'Previous Owner') ?></strong></div>
|
|
<div class="panel-body" style="padding-bottom:8px;">
|
|
<div class="row">
|
|
<div class="col-sm-6"><?= $renderCustomField('previous_owner_user_id', $model, $customDefinitions) ?></div>
|
|
<div class="col-sm-6"><?= $renderCustomField('previous_owner_name', $model, $customDefinitions) ?></div>
|
|
<div class="col-sm-12"><?= $renderCustomField('previous_owner_business_name', $model, $customDefinitions) ?></div>
|
|
<div class="col-sm-12"><?= $renderCustomField('previous_owner_street_address', $model, $customDefinitions) ?></div>
|
|
<div class="col-sm-4"><?= $renderCustomField('previous_owner_city', $model, $customDefinitions) ?></div>
|
|
<div class="col-sm-4"><?= $renderCustomField('previous_owner_state', $model, $customDefinitions) ?></div>
|
|
<div class="col-sm-4"><?= $renderCustomField('previous_owner_zip', $model, $customDefinitions) ?></div>
|
|
<div class="col-sm-6"><?= $renderCustomField('previous_owner_cell_phone', $model, $customDefinitions) ?></div>
|
|
<div class="col-sm-6"><?= $renderCustomField('previous_owner_business_phone', $model, $customDefinitions) ?></div>
|
|
<div class="col-sm-12"><?= $renderCustomField('previous_owner_email', $model, $customDefinitions) ?></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel panel-default" style="margin-bottom:14px;">
|
|
<div class="panel-heading"><strong><?= Yii::t('AnimalManagementModule.base', 'Display Field Overrides') ?></strong></div>
|
|
<div class="panel-body" style="padding-bottom:8px;">
|
|
<div class="row">
|
|
<div class="col-sm-6">
|
|
<label class="control-label" style="display:block;"><?= Yii::t('AnimalManagementModule.base', 'Tile Fields') ?></label>
|
|
<?= Html::checkboxList('AnimalForm[tileDisplayFields]', $model->tileDisplayFields, DisplaySettingsForm::fieldOptions(), ['separator' => '<br>']) ?>
|
|
</div>
|
|
<div class="col-sm-6">
|
|
<label class="control-label" style="display:block;"><?= Yii::t('AnimalManagementModule.base', 'Hero Fields') ?></label>
|
|
<?= Html::checkboxList('AnimalForm[heroDisplayFields]', $model->heroDisplayFields, DisplaySettingsForm::fieldOptions(), ['separator' => '<br>']) ?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<?php
|
|
$remainingCustomFields = [];
|
|
foreach ($customDefinitions as $fieldKey => $definition) {
|
|
if (in_array($fieldKey, $knownProfileFieldKeys, true)) {
|
|
continue;
|
|
}
|
|
$remainingCustomFields[$fieldKey] = $definition;
|
|
}
|
|
?>
|
|
|
|
<?php if (!empty($remainingCustomFields)): ?>
|
|
<div class="panel panel-default" style="margin-bottom:14px;">
|
|
<div class="panel-heading"><strong><?= Yii::t('AnimalManagementModule.base', 'Custom Fields') ?></strong></div>
|
|
<div class="panel-body" style="padding-bottom:8px;">
|
|
<?php foreach ($remainingCustomFields as $fieldKey => $definition): ?>
|
|
<?= $renderCustomField($fieldKey, $model, $remainingCustomFields) ?>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</div>
|
|
<?php endif; ?>
|
|
</div>
|
|
</div>
|
|
|
|
<?= Button::save(!empty($isEdit)
|
|
? Yii::t('AnimalManagementModule.base', 'Save Changes')
|
|
: Yii::t('AnimalManagementModule.base', 'Create Animal'))->submit() ?>
|
|
<?= Button::asLink(Yii::t('AnimalManagementModule.base', 'Cancel'))->link(
|
|
!empty($isEdit) && $animal instanceof Animal
|
|
? $space->createUrl('/animal_management/animals/view', ['id' => $animal->id])
|
|
: $space->createUrl('/animal_management/animals/index')
|
|
) ?>
|
|
<?php if (!empty($isEdit) && $animal instanceof Animal): ?>
|
|
<?= Html::a(
|
|
Yii::t('AnimalManagementModule.base', 'Delete Animal'),
|
|
$space->createUrl('/animal_management/animals/delete', ['id' => $animal->id]),
|
|
[
|
|
'class' => 'btn btn-danger pull-right',
|
|
'style' => 'margin-left:8px;',
|
|
'data-method' => 'post',
|
|
'data-confirm' => Yii::t('AnimalManagementModule.base', 'Delete {name}? This will remove the animal record and local gallery uploads. This cannot be undone.', ['name' => $animal->getDisplayName()]),
|
|
]
|
|
) ?>
|
|
<?php endif; ?>
|
|
|
|
<div class="modal fade" id="animal-cover-image-manage-modal" tabindex="-1" role="dialog" aria-hidden="true">
|
|
<div class="modal-dialog modal-lg" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="<?= Yii::t('AnimalManagementModule.base', 'Close') ?>"><span aria-hidden="true">×</span></button>
|
|
<h4 class="modal-title"><?= Yii::t('AnimalManagementModule.base', 'Manage Cover Image') ?></h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="help-block"><?= Yii::t('AnimalManagementModule.base', 'Select an existing gallery image or upload a new cover image.') ?></div>
|
|
<div class="alert alert-info" style="padding:8px 10px;margin-bottom:10px;">
|
|
<?= Yii::t('AnimalManagementModule.base', 'Your image preview updates immediately. Final save happens when you click {action} at the bottom of this intake form.', [
|
|
'action' => !empty($isEdit)
|
|
? Yii::t('AnimalManagementModule.base', 'Save Changes')
|
|
: Yii::t('AnimalManagementModule.base', 'Create Animal'),
|
|
]) ?>
|
|
</div>
|
|
<?php if (!empty($galleryImageUrls)): ?>
|
|
<div class="row" style="max-height:260px;overflow:auto;margin-bottom:8px;">
|
|
<?php foreach ($galleryImageUrls as $galleryUrl): ?>
|
|
<div class="col-xs-6 col-sm-4" style="margin-bottom:8px;">
|
|
<button type="button" class="btn btn-default animal-image-select-thumb" data-select-kind="cover" data-select-target="#animalform-coverimagegallerypath" data-select-value="<?= Html::encode($galleryUrl) ?>" style="padding:3px;width:100%;">
|
|
<img src="<?= Html::encode($galleryUrl) ?>" alt="<?= Yii::t('AnimalManagementModule.base', 'Cover option') ?>" style="width:100%;height:120px;object-fit:cover;border-radius:4px;">
|
|
</button>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
<?php else: ?>
|
|
<div class="text-muted" style="margin-bottom:8px;"><?= Yii::t('AnimalManagementModule.base', 'No gallery images available yet.') ?></div>
|
|
<?php endif; ?>
|
|
<div class="form-group">
|
|
<button type="button" class="btn btn-default" id="animal-cover-upload-trigger">
|
|
<i class="fa fa-upload"></i> <?= Yii::t('AnimalManagementModule.base', 'Upload New Cover Image') ?>
|
|
</button>
|
|
<div id="animal-cover-upload-file-name" class="help-block" style="margin-bottom:0;"></div>
|
|
</div>
|
|
<?= $form->field($model, 'removeCoverImage')->checkbox() ?>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-default" data-dismiss="modal"><?= Yii::t('AnimalManagementModule.base', 'Done') ?></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal fade" id="animal-profile-image-manage-modal" tabindex="-1" role="dialog" aria-hidden="true">
|
|
<div class="modal-dialog modal-lg" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="<?= Yii::t('AnimalManagementModule.base', 'Close') ?>"><span aria-hidden="true">×</span></button>
|
|
<h4 class="modal-title"><?= Yii::t('AnimalManagementModule.base', 'Manage Profile Image') ?></h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="help-block"><?= Yii::t('AnimalManagementModule.base', 'Select an existing gallery image or upload a new profile image.') ?></div>
|
|
<div class="alert alert-info" style="padding:8px 10px;margin-bottom:10px;">
|
|
<?= Yii::t('AnimalManagementModule.base', 'Your image preview updates immediately. Final save happens when you click {action} at the bottom of this intake form.', [
|
|
'action' => !empty($isEdit)
|
|
? Yii::t('AnimalManagementModule.base', 'Save Changes')
|
|
: Yii::t('AnimalManagementModule.base', 'Create Animal'),
|
|
]) ?>
|
|
</div>
|
|
<?php if (!empty($galleryImageUrls)): ?>
|
|
<div class="row" style="max-height:260px;overflow:auto;margin-bottom:8px;">
|
|
<?php foreach ($galleryImageUrls as $galleryUrl): ?>
|
|
<div class="col-xs-6 col-sm-4" style="margin-bottom:8px;">
|
|
<button type="button" class="btn btn-default animal-image-select-thumb" data-select-kind="profile" data-select-target="#animalform-profileimagegallerypath" data-select-value="<?= Html::encode($galleryUrl) ?>" style="padding:3px;width:100%;">
|
|
<img src="<?= Html::encode($galleryUrl) ?>" alt="<?= Yii::t('AnimalManagementModule.base', 'Profile option') ?>" style="width:100%;height:120px;object-fit:cover;border-radius:4px;">
|
|
</button>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
<?php else: ?>
|
|
<div class="text-muted" style="margin-bottom:8px;"><?= Yii::t('AnimalManagementModule.base', 'No gallery images available yet.') ?></div>
|
|
<?php endif; ?>
|
|
<div class="form-group">
|
|
<button type="button" class="btn btn-default" id="animal-profile-upload-trigger">
|
|
<i class="fa fa-upload"></i> <?= Yii::t('AnimalManagementModule.base', 'Upload New Profile Image') ?>
|
|
</button>
|
|
<div id="animal-profile-upload-file-name" class="help-block" style="margin-bottom:0;"></div>
|
|
</div>
|
|
<?= $form->field($model, 'removeProfileImage')->checkbox() ?>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-default" data-dismiss="modal"><?= Yii::t('AnimalManagementModule.base', 'Done') ?></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<?php ActiveForm::end(); ?>
|
|
</div>
|
|
</div>
|
|
|
|
<?php
|
|
$this->registerCss(<<<CSS
|
|
.animal-image-select-thumb.is-selected {
|
|
border-color: #2f7df4 !important;
|
|
box-shadow: 0 0 0 2px rgba(47, 125, 244, 0.22);
|
|
}
|
|
CSS
|
|
);
|
|
|
|
$this->registerJs(<<<JS
|
|
(function() {
|
|
function renderPlaceholder(kind) {
|
|
if (kind === 'profile') {
|
|
return '<div style="height:220px;display:flex;align-items:center;justify-content:center;color:#9ba5af;"><i class="fa fa-user-circle fa-3x"></i></div>';
|
|
}
|
|
|
|
return '<div style="height:220px;display:flex;align-items:center;justify-content:center;color:#9ba5af;"><i class="fa fa-image fa-3x"></i></div>';
|
|
}
|
|
|
|
function updatePreview(kind, value) {
|
|
var previewId = kind === 'profile' ? '#animal-profile-preview' : '#animal-cover-preview';
|
|
if (value && (value.indexOf('/') === 0 || /^https?:\/\//i.test(value) || /^data:image\//i.test(value))) {
|
|
$(previewId).html('<img src="' + value + '" alt="' + kind + ' image" style="width:100%;height:220px;object-fit:cover;display:block;">' +
|
|
'<button type="button" class="btn btn-default" data-toggle="modal" data-target="' + (kind === 'profile' ? '#animal-profile-image-manage-modal' : '#animal-cover-image-manage-modal') + '" style="position:absolute;top:10px;right:10px;border-radius:999px;"><i class="fa fa-pencil"></i></button>');
|
|
return;
|
|
}
|
|
|
|
$(previewId).html(renderPlaceholder(kind) +
|
|
'<button type="button" class="btn btn-default" data-toggle="modal" data-target="' + (kind === 'profile' ? '#animal-profile-image-manage-modal' : '#animal-cover-image-manage-modal') + '" style="position:absolute;top:10px;right:10px;border-radius:999px;"><i class="fa fa-pencil"></i></button>');
|
|
}
|
|
|
|
function markSelectedThumb(kind, value) {
|
|
var modalId = kind === 'profile' ? '#animal-profile-image-manage-modal' : '#animal-cover-image-manage-modal';
|
|
$(modalId + ' .animal-image-select-thumb').removeClass('is-selected');
|
|
if (!value) {
|
|
return;
|
|
}
|
|
|
|
$(modalId + ' .animal-image-select-thumb').each(function() {
|
|
if ($(this).data('select-value') === value) {
|
|
$(this).addClass('is-selected');
|
|
}
|
|
});
|
|
}
|
|
|
|
$(document).on('click', '.animal-image-select-thumb', function() {
|
|
var kind = $(this).data('select-kind') || 'cover';
|
|
var target = $(this).data('select-target');
|
|
var value = $(this).data('select-value');
|
|
if (target && value !== undefined) {
|
|
$(target).val(value);
|
|
if (kind === 'profile') {
|
|
$('#animalform-profileimagefile').val('');
|
|
$('#animalform-removeprofileimage').prop('checked', false);
|
|
} else {
|
|
$('#animalform-coverimagefile').val('');
|
|
$('#animalform-removecoverimage').prop('checked', false);
|
|
}
|
|
updatePreview(kind, value);
|
|
markSelectedThumb(kind, value);
|
|
if (kind === 'profile') {
|
|
$('#animal-profile-upload-file-name').text('');
|
|
} else {
|
|
$('#animal-cover-upload-file-name').text('');
|
|
}
|
|
}
|
|
|
|
$(this).closest('.modal').modal('hide');
|
|
});
|
|
|
|
$('#animal-cover-upload-trigger').on('click', function() {
|
|
$('#animalform-coverimagefile').trigger('click');
|
|
});
|
|
|
|
$('#animal-profile-upload-trigger').on('click', function() {
|
|
$('#animalform-profileimagefile').trigger('click');
|
|
});
|
|
|
|
$('#animalform-coverimagefile').on('change', function() {
|
|
var file = this.files && this.files[0] ? this.files[0] : null;
|
|
$('#animalform-coverimagegallerypath').val('');
|
|
$('#animalform-removecoverimage').prop('checked', false);
|
|
|
|
if (!file) {
|
|
return;
|
|
}
|
|
|
|
var reader = new FileReader();
|
|
reader.onload = function(e) {
|
|
updatePreview('cover', e.target.result);
|
|
markSelectedThumb('cover', '');
|
|
};
|
|
reader.readAsDataURL(file);
|
|
$('#animal-cover-upload-file-name').text(file.name || '');
|
|
$('#animal-cover-image-manage-modal').modal('hide');
|
|
});
|
|
|
|
$('#animalform-profileimagefile').on('change', function() {
|
|
var file = this.files && this.files[0] ? this.files[0] : null;
|
|
$('#animalform-profileimagegallerypath').val('');
|
|
$('#animalform-removeprofileimage').prop('checked', false);
|
|
|
|
if (!file) {
|
|
return;
|
|
}
|
|
|
|
var reader = new FileReader();
|
|
reader.onload = function(e) {
|
|
updatePreview('profile', e.target.result);
|
|
markSelectedThumb('profile', '');
|
|
};
|
|
reader.readAsDataURL(file);
|
|
$('#animal-profile-upload-file-name').text(file.name || '');
|
|
$('#animal-profile-image-manage-modal').modal('hide');
|
|
});
|
|
|
|
$('#animalform-removecoverimage').on('change', function() {
|
|
if ($(this).is(':checked')) {
|
|
$('#animalform-coverimagegallerypath').val('');
|
|
$('#animalform-coverimagefile').val('');
|
|
$('#animal-cover-upload-file-name').text('');
|
|
markSelectedThumb('cover', '');
|
|
updatePreview('cover', '');
|
|
}
|
|
});
|
|
|
|
$('#animalform-removeprofileimage').on('change', function() {
|
|
if ($(this).is(':checked')) {
|
|
$('#animalform-profileimagegallerypath').val('');
|
|
$('#animalform-profileimagefile').val('');
|
|
$('#animal-profile-upload-file-name').text('');
|
|
markSelectedThumb('profile', '');
|
|
updatePreview('profile', '');
|
|
}
|
|
});
|
|
|
|
$('#animal-cover-image-manage-modal').on('shown.bs.modal', function() {
|
|
markSelectedThumb('cover', $('#animalform-coverimagegallerypath').val());
|
|
});
|
|
|
|
$('#animal-profile-image-manage-modal').on('shown.bs.modal', function() {
|
|
markSelectedThumb('profile', $('#animalform-profileimagegallerypath').val());
|
|
});
|
|
})();
|
|
JS
|
|
);
|
|
?>
|