Skip to content

Commit

Permalink
fixes
Browse files Browse the repository at this point in the history
- Delete extra </div>
- Move preview under the input field
- respect landscape/portrait images
  • Loading branch information
dgrammatiko committed Sep 3, 2016
1 parent d472643 commit 97fe13c
Show file tree
Hide file tree
Showing 4 changed files with 14 additions and 13 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -118,17 +118,13 @@

JHtml::_('script', 'media/mediafield.min.js', false, true, false, false, true);
?>
<?php if ($showPreview && !$showAsTooltip) : ?>
<div class="field-media-preview" style="width: <?php echo $previewWidth; ?>px; max-height: <?php echo $previewHeight; ?>px;"></div>
<?php endif; ?>
<?php if ($showPreview && $showAsTooltip) : ?>
<div class="input-prepend input-append">
<span rel="popover" class="add-on pop-helper field-media-preview"
title="<?php echo JText::_('JLIB_FORM_MEDIA_PREVIEW_SELECTED_IMAGE'); ?>" data-content="<?php echo JText::_('JLIB_FORM_MEDIA_PREVIEW_EMPTY'); ?>"
data-original-title="<?php echo JText::_('JLIB_FORM_MEDIA_PREVIEW_SELECTED_IMAGE'); ?>" data-trigger="hover">
<i class="icon-eye"></i>
</span>
</div>
<?php else: ?>
<div class="input-append">
<?php endif; ?>
Expand All @@ -138,4 +134,7 @@
<a class="btn icon-remove hasTooltip add-on button-clear" title="<?php echo JText::_("JLIB_FORM_BUTTON_CLEAR"); ?>"></a>
<?php endif; ?>
</div>
<?php if ($showPreview && !$showAsTooltip) : ?>
<div class="field-media-preview" style="width: <?php echo $previewWidth; ?>px; max-height: <?php echo $previewHeight; ?>px;margin-top:10px;"></div>
<?php endif; ?>
</div>
9 changes: 6 additions & 3 deletions media/media/js/mediafield.js
Original file line number Diff line number Diff line change
Expand Up @@ -100,10 +100,13 @@
if (!value) {
this.$containerPreview.append('');
} else {
var imgPreview = new Image(this.options.previewWidth, this.options.previewHeight);
var imgPreview = new Image();
imgPreview.src = this.options.basepath + value;

this.$containerPreview.html($('<img>',{src: imgPreview.src}));
if (imgPreview.width > imgPreview.height) {
this.$containerPreview.html($('<img>',{src: imgPreview.src, style: 'width: ' + this.options.previewWidth + 'px'}));
} else {
this.$containerPreview.html($('<img>',{src: imgPreview.src, style: 'height: ' + this.options.previewHeight + 'px'}));
}
}
} else {
// Reset tooltip and preview
Expand Down
2 changes: 1 addition & 1 deletion media/media/js/mediafield.min.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

9 changes: 4 additions & 5 deletions templates/protostar/html/layouts/joomla/form/field/media.php
Original file line number Diff line number Diff line change
Expand Up @@ -118,24 +118,23 @@

JHtml::_('script', 'media/mediafield.min.js', false, true, false, false, true);
?>
<?php if ($showPreview && !$showAsTooltip) : ?>
<div class="field-media-preview" style="width: <?php echo $previewWidth; ?>px; height: <?php echo $previewHeight; ?>px;"></div>
<?php endif; ?>
<?php if ($showPreview && $showAsTooltip) : ?>
<div class="input-prepend input-append">
<span rel="popover" class="add-on pop-helper field-media-preview"
title="<?php echo JText::_('JLIB_FORM_MEDIA_PREVIEW_SELECTED_IMAGE'); ?>" data-content="<?php echo JText::_('JLIB_FORM_MEDIA_PREVIEW_EMPTY'); ?>"
data-original-title="<?php echo JText::_('JLIB_FORM_MEDIA_PREVIEW_SELECTED_IMAGE'); ?>" data-trigger="hover">
<i class="icon-eye"></i>
</span>
</div>
<?php else: ?>
<div class="input-append">
<?php endif; ?>
<?php endif; ?>
<input type="text" name="<?php echo $name; ?>" id="<?php echo $id; ?>" value="<?php echo htmlspecialchars($value, ENT_COMPAT, 'UTF-8'); ?>" readonly="readonly"<?php echo $attr; ?>/>
<?php if ($disabled != true) : ?>
<a class="btn add-on button-select"><?php echo JText::_("JLIB_FORM_BUTTON_SELECT"); ?></a>
<a class="btn icon-remove hasTooltip add-on button-clear" title="<?php echo JText::_("JLIB_FORM_BUTTON_CLEAR"); ?>"></a>
<?php endif; ?>
</div>
<?php if ($showPreview && !$showAsTooltip) : ?>
<div class="field-media-preview" style="width: <?php echo $previewWidth; ?>px; max-height: <?php echo $previewHeight; ?>px;margin-top:10px;"></div>
<?php endif; ?>
</div>

0 comments on commit 97fe13c

Please sign in to comment.