#1 - Standard image popup in Comments.

inc/classes/BxDolCmts.php

@@ -673,15 +673,6 @@ class BxDolCmts extends BxDol implements iBxDolReplaceable
         return $this->getComments(array('vparent_id' => $iCmtVParentId, 'start' => $iCmtStart, 'per_view' => $iCmtPerView, 'type' => $sCmtBrowse, 'filter' => $sCmtFilter), array('type' => $sCmtDisplay));
     }
 
-    public function actionGetImage ()
-    {
-        if (!$this->isEnabled())
-           return '';
-
-        $iImgId = bx_process_input(bx_get('ImgId'), BX_DATA_INT);
-        return $this->getImage($iImgId);
-    }
-
     public function actionSubmitPostForm()
     {
         if(!$this->isEnabled() || !$this->isPostReplyAllowed()) {

inc/js/classes/BxDolCmts.js

@@ -266,40 +266,8 @@ BxDolCmts.prototype.showMore = function(oLink)
 	$(oLink).parent('span').next('span').show().prev('span').remove();
 };
 
-BxDolCmts.prototype.showImage = function(oLink, iId) {
-	var $this = this;
-
-    var oData = this._getDefaultActions();
-    oData['action'] = 'GetImage';
-    oData['ImgId'] = iId;
-
-    if(oLink)
-    	this._loadingInContent(oLink, true);
-
-    jQuery.get (
-        this._sActionsUrl,
-        oData,
-        function (s) {
-        	var oPopup = $(s).hide(); 
-
-	    	$('#' + oPopup.attr('id')).remove();
-	        oPopup.prependTo('body').find('img').bind('load', function() {
-	        	if(oLink)
-	        		$this._loadingInContent(oLink, false);
-
-	        	$(this).parents('.bx-popup-wrapper').dolPopup({
-		        	fog: {
-						color: '#fff',
-						opacity: .7
-		            }
-		        });	        	
-	        });	        
-        }
-    );
-};
-
-BxDolCmts.prototype.hideImage = function(oLink) {
-	$(".bx-popup-applied:visible").dolPopupHide();
+BxDolCmts.prototype.showImage = function(oLink, sUrl) {
+	$(this._sRootId + '-view-image-popup').dolPopupImage(sUrl);
 };
 
 BxDolCmts.prototype.toggleReply = function(e, iCmtParentId)

modules/boonex/english/data/langs/system.xml

@@ -1268,13 +1268,11 @@
 	<string name="_cmt_browse_popular"><![CDATA[Popular]]></string>
 	<string name="_cmt_browse_subscriptions"><![CDATA[Subscriptions]]></string>
 	<string name="_cmt_browse_tail"><![CDATA[Newest]]></string>
-	<string name="_cmt_close_attached_image"><![CDATA[Close]]></string>
 	<string name="_cmt_display_flat"><![CDATA[Flat]]></string>
 	<string name="_cmt_display_threaded"><![CDATA[Threaded]]></string>
 	<string name="_cmt_err_cannot_perform_action"><![CDATA[Cannot perform action. Please report.]]></string>
 	<string name="_cmt_page_view_header"><![CDATA[Comment to {0}]]></string>
 	<string name="_cmt_page_view_title"><![CDATA[Comment to <a href="{0}">{1}</a>]]></string>
-	<string name="_cmt_view_attached_image"><![CDATA[View attached image]]></string>
 	<string name="_copyright"><![CDATA[&copy; {0} Company]]></string>
 	<string name="_delete"><![CDATA[delete]]></string>
 	<string name="_error occured"><![CDATA[Error occurred]]></string>

template/comment.html

@@ -30,7 +30,7 @@
 						<div class="__style_prefix__-attached bx-def-margin-thd-leftright-neg bx-clearfix">
 							<bx_repeat:attached>
 								<div class="__style_prefix__-attached-preview bx-def-round-corners bx-def-margin-thd">
-									<a href="javascript:void(0)" onclick="__js_object__.showImage(this, __id__); return false;" title="<bx_text_attribute:_cmt_view_attached_image />">
+									<a href="javascript:void(0)" onclick="__js_object__.showImage(this, '__image_orig__'); return false;" title="<bx_text_attribute:_cmt_view_attached_image />">
 										<img src="<bx_image_url:spacer.gif />" style="background-image:url(__image__)" />
 									</a>
 								</div>

template/comment_block.html

@@ -5,4 +5,5 @@
 		</ul>
 	</div>
 </div>
+__view_image_popup__
 __script__

template/comments_block.html

@@ -8,4 +8,5 @@
 	</div>
 	__post_form_bottom__
 </div>
+__view_image_popup__
 __script__

template/css/cmts.css

@@ -136,15 +136,6 @@
 		background-position: center center;
 		background-repeat: no-repeat;
 	}
-
-	img.cmt-attached-image {
-		position: relative;
-		max-width: 600px;
-		max-width: 37.5rem;
-		max-height: 600px;
-		max-height: 37.5rem;
-		cursor: pointer;
-	}
 	
     /*--- Comment Actions ---*/
 	div.cmt-actions {

template/scripts/BxBaseCmts.php

@@ -92,6 +92,7 @@ class BxBaseCmts extends BxDolCmts
             'comments' => $sCmts,
             'post_form_top' => $this->getFormBoxPost($aBp, array('type' => $this->_sDisplayType, 'position' => BX_CMT_PFP_TOP)),
             'post_form_bottom'  => $this->getFormBoxPost($aBp, array('type' => $this->_sDisplayType, 'position' => BX_CMT_PFP_BOTTOM)),
+        	'view_image_popup' => $this->_getViewImagePopup(),
             'script' => $this->getJsScript()
         ));
 
@@ -135,6 +136,7 @@ class BxBaseCmts extends BxDolCmts
             'system' => $this->_sSystem,
             'id' => $this->getId(),
             'comment' => $this->getComment($iCmtId, array('type' => $this->_sBrowseType), array('type' => BX_CMT_DISPLAY_THREADED)),
+        	'view_image_popup' => $this->_getViewImagePopup(), 
             'script' => $this->getJsScript()
         ));
     }
@@ -206,15 +208,18 @@ class BxBaseCmts extends BxDolCmts
         if($this->isAttachImageEnabled()) {
             $aImages = $this->_oQuery->getImages($this->_aSystem['system_id'], $aCmt['cmt_id']);
             if(!empty($aImages) && is_array($aImages)) {
-                bx_import('BxDolImageTranscoder');
+                bx_import('BxDolStorage');
+        		$oStorage = BxDolStorage::getObjectInstance($this->_sStorageObject);
+
+            	bx_import('BxDolImageTranscoder');
                 $oTranscoder = BxDolImageTranscoder::getObjectInstance($this->_sTranscoderPreview);
 
                 foreach($aImages as $aImage)
                     $aTmplImages[] = array(
                         'style_prefix' => $this->_sStylePrefix,
                         'js_object' => $this->_sJsObjName,
-                        'id' => $aImage['image_id'],
-                        'image' => $oTranscoder->getImageUrl($aImage['image_id'])
+                        'image' => $oTranscoder->getImageUrl($aImage['image_id']),
+                    	'image_orig' => $oStorage->getFileUrlById($aImage['image_id'])
                     );
             }
         }
@@ -298,30 +303,6 @@ class BxBaseCmts extends BxDolCmts
         return $this->_getFormEdit($aCmt);
     }
 
-    function getImage($iImgId)
-    {
-        if(!$this->isAttachImageEnabled())
-            return '';
-
-        $oTemplate = BxDolTemplate::getInstance();
-
-        bx_import('BxDolStorage');
-        $oStorage = BxDolStorage::getObjectInstance($this->_sStorageObject);
-
-        $sContent = $oTemplate->parseHtmlByName('bx_img.html', array(
-            'src' => $oStorage->getFileUrlById($iImgId),
-            'bx_repeat:attrs' => array(
-                array('key' => 'alt', 'value' => bx_html_attribute(_t('_cmt_view_attached_image'))),
-                array('key' => 'title', 'value' => bx_html_attribute(_t('_cmt_close_attached_image'))),
-                array('key' => 'onclick', 'value' => $this->_sJsObjName . '.hideImage(this);'),
-                array('key' => 'class', 'value' => $this->_sStylePrefix . '-attached-image')
-            )
-        ));
-
-        bx_import('BxTemplStudioFunctions');
-        return BxTemplStudioFunctions::getInstance()->transBox($this->_sSystem . '-attached-image', $sContent, true);
-    }
-
     /**
      * private functions
      */
@@ -702,6 +683,16 @@ class BxBaseCmts extends BxDolCmts
         ));
     }
 
+    protected function _getViewImagePopup()
+    {
+    	$sViewImagePopupId = 'cmts-box-' . $this->_sSystem . '-' . $this->getId() . '-view-image-popup' ;
+        $sViewImagePopupContent = BxDolTemplate::getInstance()->parseHtmlByName('popup_image.html', array(
+    		'image_url' => ''
+    	));
+
+    	bx_import('BxTemplFunctions');
+    	return BxTemplFunctions::getInstance()->transBox($sViewImagePopupId, $sViewImagePopupContent, true);
+    }
     protected function _echoResultJson($a, $isAutoWrapForFormFileSubmit = false)
     {