TinyMce / MediaManager MediaPicker work and cleanup.

e107_admin/image.php

@@ -1382,7 +1382,7 @@ class media_admin_ui extends e_admin_ui
 		$tp = e107::getParser();
 
 		$options = array();
-		$options['bbcode'] = ($this->getQuery('bbcode')=='img') ? 'img' : FALSE;
+		$options['bbcode'] = ($this->getQuery('bbcode')) ? $this->getQuery('bbcode') : FALSE;
 
 		if(isset($_GET['from']))
 		{
@@ -1400,6 +1400,13 @@ class media_admin_ui extends e_admin_ui
 			'core-media-glyphs'   => array('caption'=> $tp->toGlyph('fa-flag')."Glyphs",             'method' => 'glyphTab'),
 		);
 
+		if(!empty($options['bbcode']))
+		{
+			$tabOptions['core-media-img'] = $tabOptions['core-media-image'];
+			$tabOptions['core-media-glyph'] = $tabOptions['core-media-glyphs'];
+
+		}
+
 		$tabs = array();
 
 		// check tab options against URL
@@ -1415,13 +1422,27 @@ class media_admin_ui extends e_admin_ui
 
 		}
 
+		if($options['bbcode'] === 'img')
+		{
+			$tabs['core-media-attributes']  = array('caption'=> $tp->toGlyph('fa-image').IMALAN_152, 'text' => $this->imageAttributesTab());
+		}
+
 		if(getperms('A|A1'))
 		{
 			$tabs['core-media-upload']  = array('caption'=> $tp->toGlyph('fa-upload').IMALAN_150, 'text' => $this->uploadTab());
 		}
 
+
+
 		$text = $frm->tabs($tabs, array('id'=>'admin-ui-media-manager', 'class'=>'media-manager'));
 
+		if($options['bbcode'] || E107_DEBUG_LEVEL > 0)
+		{
+			$text .= $this->mediaManagerSaveButtons($options);
+		}
+
+		$text .= $this->mediaManagerPlaceholders();
+
 		return $text;
 
 	}
@@ -1547,11 +1568,60 @@ class media_admin_ui extends e_admin_ui
 		 * 
 		 */
 		
-		if($options['bbcode']) //TODO move to imagestyleTab();
+		if($options['bbcode'])
 		{
-			$text .= "<div class='tab-pane' id='core-media-style'>
+			$text .= "<div class='tab-pane' id='core-media-style'>".$this->imageAttributesTab()."</div>";
+		}	
+		
+
+		
+		if($this->getQuery('video') || $this->getQuery('bbcode') == 'video')
+		{
+			$text .= "<div class='tab-pane clearfix {$youtubeActive}' id='core-media-youtube' >";
+			$text .= $this->youtubeTab();
+			$text .= "</div>";
+
+		}
+			
+
+		if($this->getQuery('audio') || $this->getQuery('bbcode') == 'audio')
+		{
+				$text .= "<div class='tab-pane clearfix {$videoActive}' id='core-media-audio' >";
+				$text .= $this->audioTab();
+				$text .= "</div>";
+		}
+
+		if($this->getQuery('glyphs') == 1 || $this->getQuery('bbcode') == 'glyph')
+		{
+			$text .= "<div class='tab-pane clearfix {$glyphActive}' id='core-media-glyphs'>";
+			$text .= $this->glyphTab();
+			$text .= "</div>
+			";
+
+		}
+		
+		
+		$text .= "</div>";
+		
+		// For BBCODE/TinyMce mode.
+		// e-dialog-save
 				
-				<div class='row'>
+		if($options['bbcode'] || E107_DEBUG_LEVEL > 0)
+		{
+			$text .= $this->mediaManagerSaveButtons($options);
+		}
+		
+		$text .= $this->mediaManagerPlaceholders();
+		
+		return $text;
+	}
+
+
+	private function imageAttributesTab()
+	{
+		$frm = e107::getForm();
+
+		$text = "<div class='row'>
 				<div class='col-md-6 span6'>
 				<table class='table'>
 				<colgroup>
@@ -1606,48 +1676,34 @@ class media_admin_ui extends e_admin_ui
 			<img class='well' id='preview' src='".e_IMAGE_ABS."generic/blank.gif' style='min-width:220px; min-height:180px;' />
 			
 		
-			</div>
 			</div>
 			</div>";
-		}	
-		
 
-		
+		return $text;
-		if($this->getQuery('video') || $this->getQuery('bbcode') == 'video')
-		{
-			$text .= "<div class='tab-pane clearfix {$youtubeActive}' id='core-media-youtube' >";
-			$text .= $this->youtubeTab();
-			$text .= "</div>";
 
-		}
+	}
-			
 
-		if($this->getQuery('audio') || $this->getQuery('bbcode') == 'audio')
-		{
-				$text .= "<div class='tab-pane clearfix {$videoActive}' id='core-media-audio' >";
-				$text .= $this->audioTab();
-				$text .= "</div>";
-		}
 
-		if($this->getQuery('glyphs') == 1 || $this->getQuery('bbcode') == 'glyph')
+	private function mediaManagerPlaceholders()
-		{
+	{
-			$text .= "<div class='tab-pane clearfix {$glyphActive}' id='core-media-glyphs'>";
+			$type = (E107_DEBUG_LEVEL > 0) ?  "text" : "hidden";
-			$text .= $this->glyphTab();
+		$br = (E107_DEBUG_LEVEL > 0) ?  "<br />" : "";
-			$text .= "</div>
-			";
 
-		}
+		$text = "
-		
+		".$br."<input title='bbcode' type='{$type}' readonly='readonly' class='span11 col-md-11' id='bbcode_holder' name='bbcode_holder' value='' />
-		
+		".$br."<input title='html/wysiwyg' type='{$type}' class='span11 col-md-11' readonly='readonly' id='html_holder' name='html_holder' value='' />
-		$text .= "</div>";
+		".$br."<input title='(preview) src' type='{$type}' class='span11 col-md-11' readonly='readonly' id='src' name='src' value='' />
-		
+		".$br."<input title='path (saved to db)' type='{$type}' class='span11 col-md-11' readonly='readonly' id='path' name='path' value='' />
-		// For BBCODE/TinyMce mode.
+		";
-		// e-dialog-save
+
-				
+		return $text;
-		if($options['bbcode'] || E107_DEBUG_LEVEL > 0)
+	}
-		{
+
-						
+
-			$text .= "<div style='text-align:right;padding:5px'>
+
+	private function mediaManagerSaveButtons($options = array())
+	{
+		$text = "<div style='text-align:right;padding:5px'>
 			
 			<button type='submit' class='btn btn-success submit e-dialog-save' data-bbcode='".$options['bbcode']."' data-target='".$this->getQuery('tagid')."' name='save_image' value='Save it'  >
 			<span>".LAN_SAVE."</span>
@@ -1657,22 +1713,12 @@ class media_admin_ui extends e_admin_ui
 			</button>
 			</div>";
 
-		}
-		
-		$type = (E107_DEBUG_LEVEL > 0) ?  "text" : "hidden";
-		$br = (E107_DEBUG_LEVEL > 0) ?  "<br />" : "";
 
-		$text .= "
-		".$br."<input title='bbcode' type='{$type}' readonly='readonly' class='span11 col-md-11' id='bbcode_holder' name='bbcode_holder' value='' />
-		".$br."<input title='html/wysiwyg' type='{$type}' class='span11 col-md-11' readonly='readonly' id='html_holder' name='html_holder' value='' />
-		".$br."<input title='(preview) src' type='{$type}' class='span11 col-md-11' readonly='readonly' id='src' name='src' value='' />
-		".$br."<input title='path (saved to db)' type='{$type}' class='span11 col-md-11' readonly='readonly' id='path' name='path' value='' />
-		";		
-		
 		return $text;
 	}
 
 
+
 	/**
 	 * @deprecated to be replaced by imageTab2
 	 * @param $type
@@ -1785,7 +1831,7 @@ class media_admin_ui extends e_admin_ui
 			'action'	=>'image2', 	// Used by AJAX to identify correct function.
 			'perPage'	=> 8,
 			'gridClass'	=> 'col-sm-3 media-carousel-item-image',
-			'bbcode'	=> 'image',
+			'bbcode'	=> 'img', // bbcode tag.
 			'close'		=> 'true'
 
 		);

e107_web/js/core/mediaManager.js

@@ -46,8 +46,9 @@ var e107 = e107 || {'settings': {}, 'behaviors': {}};
 				});
 			});
 */
-            $(context).on('click', '.e-media-select', function ()
+            $(context).on('click', '.e-media-select', function (e)
             {
+            	e.preventDefault();
                 e107.mediaManager.eMediaSelect(this);
             });
 
@@ -304,6 +305,9 @@ var e107 = e107 || {'settings': {}, 'behaviors': {}};
 	 */
 	e107.mediaManager.eMediaSelect = function (that)
 	{
+
+
+
 		var $this = $(that);
 		// ID of the Media Manager Item.
 		var id = $this.attr('data-id');
@@ -334,6 +338,7 @@ var e107 = e107 || {'settings': {}, 'behaviors': {}};
 
 
 
+
 		// Remove "selected" class from elements.
 		$('.e-media-select').removeClass('media-select-active');
 
@@ -341,6 +346,10 @@ var e107 = e107 || {'settings': {}, 'behaviors': {}};
 		$this.addClass('media-select-active');
 		$this.closest('img').addClass('active');
 
+
+
+		
+
 		if(bbcode === "file" && $bbcodeHolder.length > 0) // not needed for Tinymce
 		{
 			bbpath = '[file=' + id + ']' + name + '[/file]';
@@ -348,10 +357,12 @@ var e107 = e107 || {'settings': {}, 'behaviors': {}};
 			return;
 		}
 
-		if(bbcode === "video" && $bbcodeHolder.length > 0)
+		if((bbcode === "video" || bbcode === "img") && $bbcodeHolder.length > 0)
 		{
+			e107.mediaManager.eMediaAttribute($this, bbcode);
 			bbpath = '[' + bbcode + ']' + path + '[/' + bbcode + ']';
 			$bbcodeHolder.val(bbpath);
+
 		}
 
 		if(bbcode === "glyph" && $bbcodeHolder.length > 0)
@@ -439,7 +450,7 @@ var e107 = e107 || {'settings': {}, 'behaviors': {}};
 			console.log("Mode: Image");
 		}
 
-
+		console.log("Bbpath: " + bbpath);
 		console.log("Preview: "+preview);
 		console.log("Save Path: "+path);