#157 - Vector country flags in Studio.

studio/classes/BxDolStudioLanguagesUtils.php

@@ -47,7 +47,7 @@ class BxDolStudioLanguagesUtils extends BxDolLanguages implements iBxDolSingleto
         $this->oDb->getLanguagesBy(array('type' => 'by_name', 'value' => $sName), $aLanguage, false);
 
         if(!empty($aLanguage))
-            $aLanguage['icon'] = BxDolStudioTemplate::getInstance()->getIconUrl('sys_fl_' . $aLanguage['flag'] . '.gif');
+            $aLanguage['icon'] = genFlag($aLanguage['name'], BxDolStudioTemplate::getInstance());
 
         return $aLanguage;
     }
@@ -61,7 +61,7 @@ class BxDolStudioLanguagesUtils extends BxDolLanguages implements iBxDolSingleto
 
         $oTemplate  = BxDolStudioTemplate::getInstance();
         foreach($aLanguages as $iKey => $aLanguage)
-            $aLanguages[$iKey]['icon'] = $oTemplate->getIconUrl('sys_fl_' . $aLanguage['flag'] . '.gif');
+            $aLanguages[$iKey]['icon'] = genFlag($aLanguage['name'], $oTemplate);
 
         return $aLanguages;
     }

studio/template/css/forms.css

@@ -38,9 +38,6 @@ div.bx-form-input-language,
 div.bx-form-input-language-current{
 	position: relative;
 	height: 17px;
-	padding-left: 22px;
-	background-repeat: no-repeat;
-	background-position: 0px center;
 	line-height: 17px;
 }
 

studio/template/form_view_translatable.html

@@ -1,6 +1,6 @@
 <div class="bx-form-input-translator">
-    <div class="bx-form-input-language-current bx-def-font-small" style="background-image:url(__flag__)">
-        <a href="javascript:void(0)" onclick="javascript: fvtTogglePopup('__name__', this)">__title__</a>
+    <div class="bx-form-input-language-current bx-def-font-small">
+        <a href="javascript:void(0)" onclick="javascript: fvtTogglePopup('__name__', this)">__flag__ __title__</a>
     </div>
     __popup__
 </div>

studio/template/form_view_translator.html

@@ -1,7 +1,7 @@
 <div class="bx-def-padding-sec-leftright bx-def-color-bg-block">
     <bx_repeat:languages>
-        <div id="bx-form-language-__name__-__lang_name__-act" class="bx-form-input-language bx-def-margin-sec-topbottom active" style="background-image:url(__lang_flag__);<bx_if:hide_active> display:none;</bx_if:hide_active>">
-            __lang_title__: 
+        <div id="bx-form-language-__name__-__lang_name__-act" class="bx-form-input-language bx-def-margin-sec-topbottom active" style="<bx_if:hide_active> display:none;</bx_if:hide_active>">
+            __lang_flag__ __lang_title__: 
             <bx_if:act_value>
                 <span class="bx-form-input-language-value">__value__</span>
             </bx_if:act_value>
@@ -11,8 +11,8 @@
                 </span>
             </bx_if:act_missing>
         </div>
-        <div id="bx-form-language-__name__-__lang_name__-pas" class="bx-form-input-language bx-def-margin-sec-topbottom not-active" style="background-image:url(__lang_flag__);<bx_if:hide_passive> display:none;</bx_if:hide_passive>">
-            <a href="javascript:void(0)" onclick="javascript:fvtSelectLanguage('__name__', '__lang_name__', this);">__lang_title__</a>: 
+        <div id="bx-form-language-__name__-__lang_name__-pas" class="bx-form-input-language bx-def-margin-sec-topbottom not-active" style="<bx_if:hide_passive> display:none;</bx_if:hide_passive>">
+            <a href="javascript:void(0)" onclick="javascript:fvtSelectLanguage('__name__', '__lang_name__', this);">__lang_flag__ __lang_title__</a>: 
             <bx_if:pas_value>
                 <span class="bx-form-input-language-value">__value__</span>
             </bx_if:pas_value>

studio/template/scripts/BxBaseStudioFormView.php

@@ -22,6 +22,10 @@ class BxBaseStudioFormView extends BxDolStudioForm
         $this->oTemplate->addJs(array(
             'forms.js'
         ));
+
+        $this->oTemplate->addCss(array(
+        	BX_DOL_URL_PLUGINS_PUBLIC . 'flag-icon-css/css/flag-icon.min.css'
+        ));
     }
 
     function genRow(&$aInput)