restore static preview

joomla · Jun 21, 2016 · c9f4246 · c9f4246
1 parent 4c054f9
commit c9f4246
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 14 deletions.
diff --git a/administrator/templates/isis/html/layouts/joomla/form/field/media.php b/administrator/templates/isis/html/layouts/joomla/form/field/media.php
@@ -59,6 +59,8 @@
 	case 'yes': // Deprecated parameter value
 	case 'true':
 	case 'show':
+		$showPreview = true;
+		$showAsTooltip = false;
 		break;
 	case 'tooltip':
 	default:
@@ -98,6 +100,7 @@
 	data-button-clear=".button-clear"
 	data-button-save-selected=".button-save-selected"
 	data-preview="<?php echo $showPreview ? 'true' : 'false'; ?>"
+	data-previewAsTooltip="<?php echo $showAsTooltip ? 'true' : 'false'; ?>"
 	data-preview-container=".field-media-preview"
 	data-preview-width="<?php echo $previewWidth; ?>"
 	data-preview-height="<?php echo $previewHeight; ?>"
@@ -115,8 +118,11 @@
 
 	JHtml::_('script', 'media/mediafield.min.js', false, true, false, false, true);
 	?>
-	<?php if ($showPreview) : ?>
+	<?php if ($showPreview && !$showAsTooltip) : ?>
+	<div class="field-media-preview" style="width: <?php echo $previewWidth; ?>; height: <?php echo $previewHeight; ?>;"></div>
+	<?php endif; ?>
 	<div class="input-prepend input-append">
+		<?php if ($showPreview && $showAsTooltip) : ?>
 		<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">

diff --git a/media/media/js/mediafield.js b/media/media/js/mediafield.js
@@ -94,20 +94,33 @@
 			return;
 		}
 
-		// Reset tooltip and preview
-		this.$containerPreview.popover('destroy');
-		this.$input.tooltip('destroy');
+		if (this.options.preview && !this.options.showAsTooltip) {
+			var value = this.$input.val();
 
-		var value = this.$input.val();
+			if (!value) {
+				this.$containerPreview.append('');
+			} else {
+				var imgPreview = new Image(this.options.previewWidth, this.options.previewHeight);
+				imgPreview.src = this.options.basepath + value;
 
-		if (!value) {
-			this.$containerPreview.popover();
+				this.$containerPreview.prepend($('<img>',{src: imgPreview.src}));
+			}
 		} else {
-			var imgPreview = new Image(this.options.previewWidth, this.options.previewHeight);
-			imgPreview.src = this.options.basepath + value;
+			// Reset tooltip and preview
+			this.$containerPreview.popover('destroy');
+			this.$input.tooltip('destroy');
+
+			var value = this.$input.val();
 
-			this.$containerPreview.popover({content: imgPreview});
-			this.$input.tooltip({placement: 'top', title: value});
+			if (!value) {
+				this.$containerPreview.popover();
+			} else {
+				var imgPreview = new Image(this.options.previewWidth, this.options.previewHeight);
+				imgPreview.src = this.options.basepath + value;
+
+				this.$containerPreview.popover({content: imgPreview});
+				this.$input.tooltip({placement: 'top', title: value});
+			}
 		}
 	};
 
@@ -119,6 +132,7 @@
 		buttonSaveSelected: '.button-save-selected', // selector for button to save the selected value
 		input: '.field-media-input', // selector for the input
 		preview: true, // whether use the preview
+		previewAsTooltip: true, // whether use the preview
 		previewContainer: '.field-media-preview', // selector for the preview container
 		previewWidth: 200, // preview width
 		previewHeight: 200, // preview height
@@ -133,7 +147,7 @@
 			var $el = $(this), instance = $el.data('fieldMedia');
 			if(!instance){
 				var options = options || {},
-						data = $el.data();
+					data = $el.data();
 
 				// Check options in the element
 				for (var p in data) {

diff --git a/media/media/js/mediafield.min.js b/media/media/js/mediafield.min.js
diff --git a/templates/protostar/html/layouts/joomla/form/field/media.php b/templates/protostar/html/layouts/joomla/form/field/media.php
@@ -59,6 +59,8 @@
 	case 'yes': // Deprecated parameter value
 	case 'true':
 	case 'show':
+		$showPreview = true;
+		$showAsTooltip = false;
 		break;
 	case 'tooltip':
 	default:
@@ -98,6 +100,7 @@
 	data-button-clear=".button-clear"
 	data-button-save-selected=".button-save-selected"
 	data-preview="<?php echo $showPreview ? 'true' : 'false'; ?>"
+	data-previewAsTooltip="<?php echo $showAsTooltip ? 'true' : 'false'; ?>"
 	data-preview-container=".field-media-preview"
 	data-preview-width="<?php echo $previewWidth; ?>"
 	data-preview-height="<?php echo $previewHeight; ?>"
@@ -115,8 +118,11 @@
 
 	JHtml::_('script', 'media/mediafield.min.js', false, true, false, false, true);
 	?>
-	<?php if ($showPreview) : ?>
+	<?php if ($showPreview && !$showAsTooltip) : ?>
+	<div class="field-media-preview" style="width: <?php echo $previewWidth; ?>; height: <?php echo $previewHeight; ?>;"></div>
+	<?php endif; ?>
 	<div class="input-prepend input-append">
+		<?php if ($showPreview && $showAsTooltip) : ?>
 		<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">