← All changes | libraries/html/form/fields/media.php +147 -0 1.6.0 → 1.8.16 View file →

		@@ -1,0 +1,147 @@
	1	+<?php
	2	+/**
	3	+ * @package VikBooking - Libraries
	4	+ * @subpackage html.form
	5	+ * @author E4J s.r.l.
	6	+ * @copyright Copyright (C) 2018 E4J s.r.l. All Rights Reserved.
	7	+ * @license http://www.gnu.org/licenses/gpl-2.0.html GNU/GPL
	8	+ * @link https://vikwp.com
	9	+ */
	10	+
	11	+// No direct access
	12	+defined('ABSPATH') or die('No script kiddies please!');
	13	+
	14	+$name = isset($displayData['name']) ? $displayData['name'] : '';
	15	+$value = isset($displayData['value']) ? $displayData['value'] : '';
	16	+$id = isset($displayData['id']) ? $displayData['id'] : uniqid();
	17	+$class = isset($displayData['class']) ? $displayData['class'] : '';
	18	+$req = isset($displayData['required']) ? $displayData['required'] : 0;
	19	+$multiple = isset($displayData['multiple']) ? $displayData['multiple'] : 0;
	20	+
	21	+$upload_image_id = $id . '-image-preview';
	22	+$upload_button_id = $id . '-upload-button';
	23	+$clear_button_id = $id . '-clear-button';
	24	+
	25	+if ($value)
	26	+{
	27	+ $img = JUri::root() . $value;
	28	+}
	29	+else
	30	+{
	31	+ $img = '';
	32	+}
	33	+
	34	+JText::script('JMEDIA_CHOOSE_IMAGE');
	35	+JText::script('JMEDIA_CHOOSE_IMAGES');
	36	+JText::script('JMEDIA_SELECT');
	37	+
	38	+?>
	39	+
	40	+<div class="media-control<?php echo $class ? ' ' . $class : ''; ?>">
	41	+
	42	+ <div class="image-preview-wrapper" id="<?php echo $upload_image_id; ?>" style="<?php echo $value ? '' : 'display: none'; ?>">
	43	+ <img src="<?php echo esc_attr($img); ?>" />
	44	+ </div>
	45	+
	46	+ <button type="button" class="button" id="<?php echo $upload_button_id; ?>">
	47	+ <?php echo JText::translate('JMEDIA_UPLOAD_BUTTON'); ?>
	48	+ </button>
	49	+
	50	+ <button type="button" class="button" id="<?php echo $clear_button_id; ?>" style="<?php echo $value ? '' : 'display: none;'; ?>">
	51	+ <?php echo JText::translate('JMEDIA_CLEAR_BUTTON'); ?>
	52	+ </button>
	53	+
	54	+ <input type="hidden" class="<?php echo $req ? 'required' : ''; ?>" name="<?php echo esc_attr($name); ?>" id="<?php echo esc_attr($id); ?>" value="<?php echo $value; ?>" />
	55	+
	56	+</div>
	57	+
	58	+<script>
	59	+
	60	+ jQuery(function($) {
	61	+ var file_frame;
	62	+ var multiple = <?php echo $multiple ? 'true' : 'false'; ?>;
	63	+
	64	+ jQuery('#<?php echo $upload_button_id; ?>').on('click', function(event) {
	65	+ event.preventDefault();
	66	+
	67	+ // if the media frame already exists, reopen it
	68	+ if (file_frame) {
	69	+ file_frame.open();
	70	+ return;
	71	+ }
	72	+
	73	+ // create the media frame.
	74	+ file_frame = wp.media.frames.file_frame = wp.media({
	75	+ title: Joomla.JText._(multiple ? 'JMEDIA_CHOOSE_IMAGES' : 'JMEDIA_CHOOSE_IMAGE'),
	76	+ button: {
	77	+ text: Joomla.JText._('JMEDIA_SELECT'),
	78	+ },
	79	+ multiple: multiple,
	80	+ });
	81	+
	82	+ // when an image is selected, run a callback
	83	+ file_frame.on('select', function() {
	84	+ // extract selected image
	85	+ attachment = file_frame.state().get('selection').first().toJSON();
	86	+
	87	+ var path = attachment.url.replace(/^<?php echo str_replace('/', '\\/', JUri::root()); ?>/, '');
	88	+
	89	+ // clear current extra images
	90	+ clearCurrentMultiSelection();
	91	+
	92	+ // turn on preview box
	93	+ jQuery('#<?php echo $upload_image_id; ?>').show();
	94	+ // turn on clear button
	95	+ jQuery('#<?php echo $clear_button_id; ?>').show();
	96	+
	97	+ // do something with attachment.id and/or attachment.url here
	98	+ jQuery('#<?php echo $upload_image_id; ?> img').attr('src', attachment.url);
	99	+ jQuery('#<?php echo $id; ?>').val(path);
	100	+
	101	+ if (multiple) {
	102	+ // extract all selected images, first one excluded
	103	+ var list = file_frame.state().get('selection').toJSON().splice(1);
	104	+
	105	+ for (var i = 0; i < list.length; i++) {
	106	+ path = list[i].url.replace(/^<?php echo str_replace('/', '\\/', JUri::root()); ?>/, '');
	107	+
	108	+ jQuery('#<?php echo $upload_image_id; ?>').append('<img src="' + list[i].url + '" />\n');
	109	+ jQuery('#<?php echo $id; ?>').parent().append('<input type="hidden" class="multi-upload" name="<?php echo esc_attr($name); ?>" value="' + path + '" />');
	110	+ }
	111	+ }
	112	+
	113	+ // trigger the event media.change
	114	+ jQuery(window).trigger('media.change');
	115	+ });
	116	+
	117	+ // finally, open the modal
	118	+ file_frame.open();
	119	+ });
	120	+
	121	+ jQuery('#<?php echo $clear_button_id; ?>').on('click', function(event) {
	122	+ event.preventDefault();
	123	+
	124	+ // turn off button
	125	+ jQuery(this).hide();
	126	+ // turn off preview box
	127	+ jQuery('#<?php echo $upload_image_id; ?>').hide();
	128	+
	129	+ // clear preview
	130	+ jQuery('#<?php echo $upload_image_id; ?> img').attr('src', '');
	131	+ // clear input
	132	+ jQuery('#<?php echo $id; ?>').val('');
	133	+
	134	+ clearCurrentMultiSelection();
	135	+ });
	136	+
	137	+ function clearCurrentMultiSelection() {
	138	+ if (multiple) {
	139	+ // remove from DOM additional input
	140	+ jQuery('#<?php echo $id; ?>').siblings().filter('.multi-upload').remove();
	141	+ // remove from DOM additional images
	142	+ jQuery('#<?php echo $upload_image_id; ?> img:not(:first-child)').remove();
	143	+ }
	144	+ }
	145	+ });
	146	+
	147	+</script>