Files

590 lines
36 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 */
/* @var bool $showIntakeGoalSection */
$showIntakeGoalSection = isset($showIntakeGoalSection) ? (bool)$showIntakeGoalSection : false;
$intakeGoalInput = Yii::$app->request->post('IntakeGoal', []);
if (!is_array($intakeGoalInput)) {
$intakeGoalInput = [];
}
$intakeGoalEnabled = !empty($isEdit) ? false : ((int)($intakeGoalInput['enabled'] ?? 0) === 1);
$intakeGoalTitle = trim((string)($intakeGoalInput['title'] ?? ''));
$intakeGoalTargetAmount = trim((string)($intakeGoalInput['target_amount'] ?? ''));
$intakeGoalDescription = trim((string)($intakeGoalInput['description'] ?? ''));
$intakeGoalIsActive = !empty($isEdit) ? true : ((int)($intakeGoalInput['is_active'] ?? 1) === 1);
?>
<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">
<?php if (empty($isEdit) && $showIntakeGoalSection): ?>
<div class="panel panel-default" style="margin-bottom:14px;">
<div class="panel-heading"><strong><?= Yii::t('AnimalManagementModule.base', 'Intake Donation Goal') ?></strong></div>
<div class="panel-body" style="padding-bottom:8px;">
<div class="checkbox" style="margin-top:0;">
<label>
<input type="checkbox" name="IntakeGoal[enabled]" value="1" id="intake-goal-enabled" <?= $intakeGoalEnabled ? 'checked' : '' ?>>
<?= Yii::t('AnimalManagementModule.base', 'Create a donation goal for this animal on intake') ?>
</label>
</div>
<div id="intake-goal-fields" style="display:<?= $intakeGoalEnabled ? 'block' : 'none' ?>;">
<div class="form-group">
<label class="control-label" for="intake-goal-title"><?= Yii::t('AnimalManagementModule.base', 'Goal Title') ?></label>
<input type="text" id="intake-goal-title" name="IntakeGoal[title]" class="form-control" maxlength="190" value="<?= Html::encode($intakeGoalTitle) ?>" placeholder="<?= Html::encode(Yii::t('AnimalManagementModule.base', 'Example: {animalName} Care Fund', ['animalName' => 'Animal'])) ?>">
</div>
<div class="form-group">
<label class="control-label" for="intake-goal-target"><?= Yii::t('AnimalManagementModule.base', 'Target Amount') ?></label>
<input type="number" id="intake-goal-target" name="IntakeGoal[target_amount]" class="form-control" min="1" step="1" value="<?= Html::encode($intakeGoalTargetAmount) ?>" placeholder="1500">
</div>
<div class="form-group">
<label class="control-label" for="intake-goal-description"><?= Yii::t('AnimalManagementModule.base', 'Goal Description') ?></label>
<textarea id="intake-goal-description" name="IntakeGoal[description]" class="form-control" rows="3" placeholder="<?= Html::encode(Yii::t('AnimalManagementModule.base', 'Optional context for supporters.')) ?>"><?= Html::encode($intakeGoalDescription) ?></textarea>
</div>
<div class="checkbox" style="margin-bottom:0;">
<label>
<input type="hidden" name="IntakeGoal[is_active]" value="0">
<input type="checkbox" name="IntakeGoal[is_active]" value="1" <?= $intakeGoalIsActive ? 'checked' : '' ?>>
<?= Yii::t('AnimalManagementModule.base', 'Goal is active immediately') ?>
</label>
</div>
</div>
</div>
</div>
<?php endif; ?>
<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', 'Complete Intake'))->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">&times;</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', 'Complete Intake'),
]) ?>
</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">&times;</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', 'Complete Intake'),
]) ?>
</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', '');
}
});
$('#intake-goal-enabled').on('change', function() {
if ($(this).is(':checked')) {
$('#intake-goal-fields').slideDown(120);
} else {
$('#intake-goal-fields').slideUp(120);
}
});
$('#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
);
?>