#3599 - Icons view enhancement

inc/classes/BxDolVoteReactions.php

@@ -107,7 +107,7 @@ class BxDolVoteReactions extends BxTemplVote
     {
         $aReaction = isset($this->_aDataList[$sReaction]) ? $this->_aDataList[$sReaction] : $this->_aDataList[$this->_sDefault];
 
-    	return $aReaction['icon'] . ($bWithColor && !empty($aReaction['color']) ? ' ' . $aReaction['color'] : '');
+    	return $aReaction['icon'] . ($bWithColor && !empty($aReaction['color']) ? ' sys-icon-emoji ' . $aReaction['color'] : ' sys-icon-emoji ');
     }
     
     public function getEmoji($sReaction, $bWithColor = true)

inc/js/classes/BxDolVoteReactions.js

@@ -80,14 +80,20 @@ BxDolVoteReactions.prototype.onVote = function (oLink, oData, onComplete)
 
     oLink = $('.' + this._aHtmlIds['main'] + ' .' + this._sClassDo);
 
+    console.log(oData);
     //--- Update Do button.
     oLink.each(function() {
-        if(oData && oData.label_icon)
+        if(oData && oData.label_icon){
             $(this).find('.sys-action-do-icon .sys-icon').attr('class', 'sys-icon ' + oData.label_icon).html('');
+        }
         if(oData && oData.label_emoji){
-            $(this).find('.sys-action-do-icon .sys-icon').html(oData.label_emoji).attr('class', 'sys-icon ');
+            $(this).find('.sys-action-do-icon .sys-icon').html(oData.label_emoji);
+        }
+        else{
+            $(this).find('.sys-action-do-icon .sys-icon').removeClass('sys-icon-emoji');
         }
         
+        
         if(oData && oData.label_title) {
             $(this).attr('title', oData.label_title);
             $(this).find('.sys-action-do-text').html(oData.label_title);

modules/base/general/template/css/main.css

@@ -294,9 +294,10 @@ div.bx-badges-list div.bx-badge{
     margin:0 0.25rem;
 }
 
-img.bx-badge-icon {
-    width: 14px;
-    height: 14px;
+img.bx-badge-icon,
+svg.bx-badge-icon{
+    width: 16px;
+    height: 16px;
 }
 div.bx-badge img,
 div.bx-badge svg{

modules/boonex/forum/classes/BxForumGridCategories.php

@@ -32,7 +32,7 @@ class BxForumGridCategories extends BxTemplStudioGrid
         if (isset($aData['icon']))
             $mixedValue = $aData['icon'];
         
-        $mixedValue = $this->_oTemplate->getIcon($mixedValue, array('class' => 'bx-item-icon bx-def-border'));
+        $mixedValue = $this->_oTemplate->getIcon($mixedValue, array('class' => 'bx-item-icon'));
         return parent::_getCellDefault($mixedValue, $sKey, $aField, $aRow);
     }
 
@@ -336,7 +336,8 @@ class BxForumGridCategories extends BxTemplStudioGrid
                     'required' => '0',
                     'db' => array (
                         'pass' => 'Xss',
-                    )
+                    ),
+                    'attrs' => array('class' => 'bx-form-input-textarea-small'),
                 ),
                 'icon_image' => array(
                     'type' => 'file',

studio/template/css/badges.css

@@ -64,9 +64,10 @@ div.bx-badge {
 	text-overflow: ellipsis; 
     overflow: hidden;
 }
-img.bx-badge-icon {
-    width: 14px;
-    height: 14px;
+img.bx-badge-icon,
+svg.bx-badge-icon{
+    width: 16px;
+    height: 16px;
 }
 div.bx-badge img{
 

studio/template/scripts/BxBaseStudioBadgesGrid.php

@@ -216,7 +216,7 @@ class BxBaseStudioBadgesGrid extends BxDolStudioBadgesGrid
     
     protected function _getCellIcon ($mixedValue, $sKey, $aField, $aRow)
     {
-        $mixedValue = $this->_oTemplate->getIcon($mixedValue, array('class' => 'bx-badge-icon bx-def-border'));
+        $mixedValue = $this->_oTemplate->getIcon($mixedValue, array('class' => 'bx-item-icon'));
         return parent::_getCellDefault($mixedValue, $sKey, $aField, $aRow);
     }
     

studio/template/scripts/BxBaseStudioNavigationImport.php

@@ -121,7 +121,7 @@ class BxBaseStudioNavigationImport extends BxDolStudioNavigationImport
 
     protected function _getCellIcon ($mixedValue, $sKey, $aField, $aRow)
     {
-        $mixedValue = $this->_oTemplate->getIcon($mixedValue, array('class' => 'bx-nav-item-icon bx-def-border'));
+        $mixedValue = $this->_oTemplate->getIcon($mixedValue, array('class' => 'bx-item-icon'));
         return parent::_getCellDefault($mixedValue, $sKey, $aField, $aRow);
     }
 

studio/template/scripts/BxBaseStudioNavigationItems.php

@@ -407,7 +407,7 @@ class BxBaseStudioNavigationItems extends BxDolStudioNavigationItems
 
     protected function _getCellIcon ($mixedValue, $sKey, $aField, $aRow)
     {
-        $mixedValue = $this->_oTemplate->getIcon($mixedValue, array('class' => 'bx-nav-item-icon bx-def-border'));
+        $mixedValue = $this->_oTemplate->getIcon($mixedValue, array('class' => 'bx-item-icon'));
         return parent::_getCellDefault($mixedValue, $sKey, $aField, $aRow);
     }
 

studio/template/scripts/BxBaseStudioPermissionsLevels.php

@@ -279,7 +279,7 @@ class BxBaseStudioPermissionsLevels extends BxDolStudioPermissionsLevels
     }
     protected function _getCellIcon ($mixedValue, $sKey, $aField, $aRow)
     {
-        $mixedValue = $this->_oTemplate->getImage($mixedValue, array('class' => 'bx-prm-level-icon'));
+        $mixedValue = $this->_oTemplate->getImage($mixedValue, array('class' => 'bx-item-icon'));
         return parent::_getCellDefault($mixedValue, $sKey, $aField, $aRow);
     }
 

template/css/general.css

@@ -7,13 +7,6 @@
 .bx-page-html-container {
     overflow:hidden;
 }
-/* icons */
-.sys-icon-emoji{
-    font-weight: normal !important;
-}
-.sys-icon-svg{
-    color: transparent !important;
-}
 
 /* --------------- toolbar */
 

template/css/icons.css

@@ -4266,3 +4266,15 @@
 
 .sys-icon.zhihu:before, .fa-zhihu:before {
   content: "\f63f"; }
+
+/* icons */
+.sys-icon-emoji{
+    font-weight: normal !important;
+}
+.sys-icon-image,
+.sys-icon-svg{
+    width: 1.5rem;
+    height: 1.5rem;
+    background-size: contain;
+    display: inline-block;
+}

template/menu_icon.html

@@ -1,3 +1,3 @@
 <bx_if:icon><i class="sys-icon __icon__"></i></bx_if:icon>
-<bx_if:image><img style="background-image:url(__icon_url__)" src="<bx_icon_url:spacer.gif />" /></bx_if:image>
+<bx_if:image><img class="sys-icon-image" style="background-image:url(__icon_url__)" src="<bx_icon_url:spacer.gif />" /></bx_if:image>
 <bx_if:icon-html>__icon__</bx_if:icon-html>

template/scripts/BxBaseFunctions.php

@@ -201,10 +201,38 @@ class BxBaseFunctions extends BxDolFactory implements iBxDolSingleton
 				}
 				else{
 					//emoji
-					if(preg_match('/([0-9#][\x{20E3}])|[\x{00ae}\x{00a9}\x{203C}\x{2047}\x{2048}\x{2049}\x{3030}\x{303D}\x{2139}\x{2122}\x{3297}\x{3299}][\x{FE00}-\x{FEFF}]?|[\x{2190}-\x{21FF}][\x{FE00}-\x{FEFF}]?|[\x{2300}-\x{23FF}][\x{FE00}-\x{FEFF}]?|[\x{2460}-\x{24FF}][\x{FE00}-\x{FEFF}]?|[\x{25A0}-\x{25FF}][\x{FE00}-\x{FEFF}]?|[\x{2600}-\x{27BF}][\x{FE00}-\x{FEFF}]?|[\x{2900}-\x{297F}][\x{FE00}-\x{FEFF}]?|[\x{2B00}-\x{2BF0}][\x{FE00}-\x{FEFF}]?|[\x{1F000}-\x{1F6FF}][\x{FE00}-\x{FEFF}]?/u', $sCode, $aTmp)){
+                
+                    $sEmojIsRegex =
+                        '/[\x{0080}-\x{02AF}'
+                        .'\x{0300}-\x{03FF}'
+                        .'\x{0600}-\x{06FF}'
+                        .'\x{0C00}-\x{0C7F}'
+                        .'\x{1DC0}-\x{1DFF}'
+                        .'\x{1E00}-\x{1EFF}'
+                        .'\x{2000}-\x{209F}'
+                        .'\x{20D0}-\x{214F}'
+                        .'\x{2190}-\x{23FF}'
+                        .'\x{2460}-\x{25FF}'
+                        .'\x{2600}-\x{27EF}'
+                        .'\x{2900}-\x{29FF}'
+                        .'\x{2B00}-\x{2BFF}'
+                        .'\x{2C60}-\x{2C7F}'
+                        .'\x{2E00}-\x{2E7F}'
+                        .'\x{3000}-\x{303F}'
+                        .'\x{A490}-\x{A4CF}'
+                        .'\x{E000}-\x{F8FF}'
+                        .'\x{FE00}-\x{FE0F}'
+                        .'\x{FE30}-\x{FE4F}'
+                        .'\x{1F000}-\x{1F02F}'
+                        .'\x{1F0A0}-\x{1F0FF}'
+                        .'\x{1F100}-\x{1F64F}'
+                        .'\x{1F680}-\x{1F6FF}'
+                        .'\x{1F910}-\x{1F96B}'
+                        .'\x{1F980}-\x{1F9E0}]/u';
+                    if(preg_match($sEmojIsRegex, $sCode, $aTmp)){
 						$sIconHtml = $this->_oTemplate->parseHtmlByName('icon_emoji.html', array('icon' => $sCode, 'class' => $sClass, 'attrs' => $sAttrs));
 					}
-						else{
+                    else{
 						if (false === strpos($sCode, '.')) { 
 							if (0 === strncmp($sCode, 'a:', 2)){
 								$sIconA = substr($sCode, 2); // animated icon
@@ -222,7 +250,7 @@ class BxBaseFunctions extends BxDolFactory implements iBxDolSingleton
         }
         return array ($sIconFont, $sIconUrl, $sIconA, $sIconHtml, $sIconFontWithHtml);
     }
-    
+      
     function getFontIconAsHtml($sIconFont, $sClass = '', $sAttrs = '')
     {
         return  '<i class="sys-icon ' . $sIconFont .' ' . $sClass . '"' . $sAttrs . '></i>';