#103 - design fixes and improvements: font size increased, image icon removed, uploaded popup fixed

inc/classes/BxDolUploader.php

@@ -405,7 +405,7 @@ abstract class BxDolUploader extends BxDol
 
         $a = $oStorage->getRestrictionsTextArray(bx_get_logged_profile_id());
         foreach ($a as $s)
-            $sTextRestrictions .= '<div class="bx-uploader-msg-info">' . $s . '</div>';
+            $sTextRestrictions .= '<div class="bx-uploader-msg-info bx-def-font-grayed">' . $s . '</div>';
 
         return $sTextRestrictions;
     }

inc/js/classes/BxDolUploader.js

@@ -57,25 +57,21 @@ BxDolUploaderSimple.prototype.showUploaderForm = function () {
     var $this = this;
     var sUrl = this._getUrlWithStandardParams() + '&a=show_uploader_form&m=' + (this._isMultiple ? 1 : 0) + '&c=' + this._iContentId + '&_t=' + escape(new Date());
 
-    $('#' + $this._sPopupContainerId).remove();
-    $('<div id="' + this._sPopupContainerId + '" style="display: none;"></div>').prependTo('body').load(
-        sUrl,
-        function() {
-             $(this).dolPopup({
-                onBeforeShow: function() {
-                    if ($this.isMultiple())
-                        $('#' + $this._sPopupContainerId + ' .bx-uploader-add-more-files').show();
-                    else
-                        $('#' + $this._sPopupContainerId + ' .bx-uploader-add-more-files').hide();
-                    $('#' + $this._sPopupContainerId + ' .bx-popup-element-close').click(function() {
-                        $this.onClickCancel();
-                    });
-                },
-                closeElement: false,
-                closeOnOuterClick: false
+    $(window).dolPopupAjax({
+        url: sUrl,
+        id: {force: true, value: this._sPopupContainerId},
+        onBeforeShow: function() {
+            if ($this.isMultiple())
+                $('#' + $this._sPopupContainerId + ' .bx-uploader-add-more-files').show();
+            else
+                $('#' + $this._sPopupContainerId + ' .bx-uploader-add-more-files').hide();
+            $('#' + $this._sPopupContainerId + ' .bx-popup-element-close').click(function() {
+                $this.onClickCancel();
             });
-        }
-    );
+        },
+        closeElement: false,
+        closeOnOuterClick: false
+    });
 }
 
 BxDolUploaderSimple.prototype.onClickCancel = function () {
@@ -177,9 +173,9 @@ BxDolUploaderSimple.prototype._showError = function (s, bAppend) {
     if (s == undefined || !s.length)
         return;
     if (!bAppend)
-        $('#' + this._sErrorsContainerId).html(this._sTemplateError.replace('{error}', s));
+        $('#' + this._sPopupContainerId + ' #' + this._sErrorsContainerId).html(this._sTemplateError.replace('{error}', s));
     else
-        $('#' + this._sErrorsContainerId).prepend(this._sTemplateError.replace('{error}', s));
+        $('#' + this._sPopupContainerId + ' #' + this._sErrorsContainerId).prepend(this._sTemplateError.replace('{error}', s));
     this._isErrorShown = true;
 }
 

inc/js/jquery.dolPopup.js

@@ -146,7 +146,7 @@
                 
                 setTimeout(function () {
                     o.onShow();                    
-                    $el.find('input').focus(); // put cursor to the first input element
+                    $el.find('input[type=text]').focus(); // put cursor to the first input element
                 }, o.speed);
 
             }, 10);

template/css/default.less

@@ -457,7 +457,7 @@ h3,
     bottom:0;
     .min-width(@bx-font-size-small + 5);
     .height(@bx-font-size-small + 5);
-    .line-height(@bx-font-size-small + 6);
+    .line-height(@bx-font-size-small + 5);
     .radius(@bx-font-size-small);
     .border (1px, solid, #fff);
     .font-size(@bx-font-size-small);
@@ -467,7 +467,7 @@ h3,
 .bx-def-unit-alert-middle {
     .min-width(@bx-font-size-middle + 2);
     .height(@bx-font-size-middle + 2);
-    .line-height(@bx-font-size-middle + 1);
+    .line-height(@bx-font-size-middle + 2);
     .radius(@bx-font-size-middle);
     .font-size(@bx-font-size-middle);
     .padding(3px);

template/css/uploaders.css

@@ -1,14 +1,5 @@
 
-.bx-uploader-msg-info {
-    padding:1px 0px 1px 16px;
-    background-image:url(../images/icons/information-small-white.png);
-    background-repeat:no-repeat;    
-}
-
 .bx-uploader-msg-err {
-    padding:1px 0px 1px 16px;
-    background-image:url(../images/icons/exclamation-small-red.png);
-    background-repeat:no-repeat;    
     color:#900;
 }
 

template/scripts/BxBaseConfig.php

@@ -44,13 +44,13 @@ class BxBaseConfig extends BxDol implements iBxDolSingleton
             'bx-border-type' => 'solid',
             'bx-border-color' => '#d0d0d0',
 
-            'bx-font-size-default' => '16px',
-            'bx-font-size-small' => '12px',
-            'bx-font-size-middle' => '14px',
-            'bx-font-size-large' => '18px',
-            'bx-font-size-h1' => '24px',
-            'bx-font-size-h2' => '20px',
-            'bx-font-size-h3' => '16px',
+            'bx-font-size-default' => '18px',
+            'bx-font-size-small' => '14px',
+            'bx-font-size-middle' => '16px',
+            'bx-font-size-large' => '22px',
+            'bx-font-size-h1' => '28px',
+            'bx-font-size-h2' => '24px',
+            'bx-font-size-h3' => '18px',
 
             'bx-font-color-default' => '#333',
             'bx-font-color-grayed' => '#999',

template/scripts/BxBaseUploaderHTML5.php

@@ -54,9 +54,7 @@ class BxBaseUploaderHTML5 extends BxDolUploader
      */
     public function getUploaderForm($isMultiple = true, $iContentId = false)
     {
-        parent::getUploaderForm($isMultiple, $iContentId);
-
-        $sForm = $this->_oTemplate->parseHtmlByName('uploader_form_html5.html', array(
+        return $this->_oTemplate->parseHtmlByName('uploader_form_html5.html', array(
             'form_container_id' => $this->_sFormContainerId,
             'errors_container_id' => $this->_sErrorsContainerId,
             'uploader_instance_name' => $this->getNameJsInstanceUploader(),
@@ -64,9 +62,6 @@ class BxBaseUploaderHTML5 extends BxDolUploader
             'div_id' => $this->_sDivId,
             'content_id' => $iContentId,
         ));
-
-        bx_import('BxTemplFunctions');
-        return BxTemplFunctions::getInstance()->transBox('', $sForm);
     }
 
     /**

template/scripts/BxBaseUploaderSimple.php

@@ -43,9 +43,7 @@ class BxBaseUploaderSimple extends BxDolUploader
      */
     public function getUploaderForm($isMultiple = true, $iContentId = false)
     {
-        parent::getUploaderForm($isMultiple, $iContentId);
-
-        $sForm = $this->_oTemplate->parseHtmlByName('uploader_form_simple.html', array(
+        return $this->_oTemplate->parseHtmlByName('uploader_form_simple.html', array(
             'form_container_id' => $this->_sFormContainerId,
             'errors_container_id' => $this->_sErrorsContainerId,
             'uploader_instance_name' => $this->getNameJsInstanceUploader(),
@@ -57,9 +55,6 @@ class BxBaseUploaderSimple extends BxDolUploader
             'multiple' => $isMultiple,
             'content_id' => $iContentId,
         ));
-
-        bx_import('BxTemplFunctions');
-        return BxTemplFunctions::getInstance()->transBox('', $sForm);
     }
 
 }

template/uploader_button_html5_js.html

@@ -4,7 +4,7 @@
             'multiple': __multiple__,
             'content_id': '__content_id__',
             'images_transcoder' : '__images_transcoder__',
-            'template_error_msg': '<div class="bx-uploader-msg-err">{error}</div>',            
+            'template_error_msg': '<div class="bx-uploader-msg-err">{error}</div>',
             'template_ghost': __template_ghost__
         });
     });

template/uploader_form_html5.html

@@ -1,4 +1,4 @@
-<div id="__form_container_id__" class="bx-uploader-form-cont bx-def-padding bx-def-color-bg-block">
+<div id="__form_container_id__" class="bx-uploader-form-cont">
     <div class="bx-def-padding-sec-bottom">__restrictions_text__</div>
     <div id="__errors_container_id__"></div>
     <div id="__div_id__"></div>

template/uploader_form_simple.html

@@ -1,4 +1,4 @@
-<div id="__form_container_id__" class="bx-uploader-form-cont bx-def-padding bx-def-color-bg-block">
+<div id="__form_container_id__" class="bx-uploader-form-cont">
 
     <form enctype="multipart/form-data" method="POST" target="__iframe_id__" action="<bx_url_root />storage_uploader.php" onsubmit="__uploader_instance_name__.onBeforeUpload(this);">
 
@@ -24,18 +24,16 @@
 
         </div>
         
-        <div class="bx-def-padding-top">
+        <div class="bx-def-padding-top bx-clearfix">
 
             <div class="bx-btn bx-btn-primary bx-def-margin-sec-right" onclick="$('#__form_container_id__ form').submit();"><bx_text:_sys_uploader_simple_submit_button /></div> 
 
             <div class="bx-btn" onclick="__uploader_instance_name__.onClickCancel()"><bx_text:_sys_uploader_close /></div>
 
-            <div class="bx-clear"></div>
-
         </div>
 
     </form>
 
-    <iframe name="__iframe_id__" id="__iframe_id__" style="width:0px; height:0px; border: 0px"></iframe>
+    <iframe name="__iframe_id__" id="__iframe_id__" style="width:0px; height:0px; border:0px; float:left;"></iframe>
 
 </div>