Ticket #780

inc/js/functions.js

@@ -757,4 +757,48 @@ function bx_get_param(s) {
     return aDolOptions[s];
 }
 
+function bx_autocomplete_fields(id, url, name, b_img){
+	$('#' + id + ' input[type=text]').autocomplete({
+		source: url,
+		select: function(e, ui) {
+			$(this).val(ui.item.label);
+			$(this).trigger('superselect', ui.item);
+			e.preventDefault();
+		}
+	});
+
+	$('#' + id + ' input[type=text]').on('superselect', function(e, item) {
+		$(this).hide();
+		if ('undefined' != typeof(item))
+			$(this).before('<b class="bx-def-color-bg-hl bx-def-round-corners">' + (b_img ? '<img class="bx-def-thumb bx-def-thumb-size bx-def-margin-sec-right" src="' + item.thumb + '">' : '') + item.label +'<input type="hidden" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" name="' + name + '[]" value="'+ item.value +'" /></b>');
+
+		fAutoShrinkInput();
+		$(this).show();
+		this.value = '';
+
+	}).on('keydown', function(e) {
+
+		// if: comma,enter (delimit more keyCodes with | pipe)
+		if (/(13)/.test(e.which))
+			e.preventDefault();
+
+	});
+
+	$('#' + id).on('click', 'b', function() {
+		$(this).remove();
+		fAutoShrinkInput();
+	});
+
+	fAutoShrinkInput = function () {
+		var iWidthCont = $('#' + id + '.bx-form-input-autotoken').innerWidth();
+		var iWidthExisting = 0;
+		$('#' + id + '.bx-form-input-autotoken b').each(function () {
+			iWidthExisting += $(this).outerWidth(true);
+		});
+		$('#' + id + '.bx-form-input-autotoken input').width(parseInt(iWidthCont - iWidthExisting > 180 ? iWidthCont - iWidthExisting : 180) - 5);
+	};
+
+	fAutoShrinkInput();
+};
+
 /** @} */

modules/base/profile/classes/BxBaseModProfileModule.php

@@ -157,10 +157,10 @@ class BxBaseModProfileModule extends BxBaseModGeneralModule implements iBxDolCon
 
     public function serviceProfilesSearch ($sTerm, $iLimit)
     {
-        $aRet = array();
+		$aRet = array();
         $a = $this->_oDb->searchByTerm($sTerm, $iLimit);
         foreach ($a as $r)
-            $aRet[] = array ('label' => $this->serviceProfileName($r['content_id']), 'value' => $r['profile_id']);
+            $aRet[] = array ('label' => $this->serviceProfileName($r['content_id']), 'value' => $r['profile_id'], 'thumb' =>  BxDolProfile::getInstance($r['profile_id']) -> getThumb());
         return $aRet;
     }
 

modules/boonex/market/classes/BxMarketFormEntry.php

@@ -256,6 +256,7 @@ class BxMarketFormEntry extends BxBaseModTextFormEntry
             'id' => $aInput['name'] . time(),
             'url_get_recipients' => $sGetSubentriesUrl,
             'name' => $aInput['name'],
+			'b_img' => false,
             'placeholder' => $sPlaceholder,
             'vals' => $sVals,
         ));

modules/boonex/market/template/css/forms.css

@@ -1,3 +1,7 @@
 
 @import url(../../../../base/text/template/css/forms.css);
 
+.bx-form-value .bx-form-input-autotoken b 
+{
+	padding-left:0.5rem;
+}

template/css/forms.css

@@ -490,6 +490,7 @@
     float:left;
     padding:0px;
     height:auto;
+	box-shadow: none;
 }
 .bx-form-value .bx-form-input-autotoken b {
     cursor:pointer;
@@ -498,17 +499,18 @@
     line-height: 40px;
     line-height: 2.5rem;
     padding-right: 1.5em; 
-    padding-left: 0.5em;
     margin-left:0.1em;
     margin-right:0.1em;
     font-weight:normal;
+	border-radius: 1.25rem;
 }
 .bx-form-value .bx-form-input-autotoken b:hover {
     opacity:0.7;
 }
 .bx-form-value .bx-form-input-autotoken b:after {
-    position:absolute;
-    content:"x";
+	font-family: 'sys-user';
+    content: "\f00d";    
+    position:absolute;    
     padding:0 0.5em;
     margin-left: 0.5em;
     font-size:0.7em;
@@ -519,4 +521,12 @@
     margin:0;
     padding:0 0 0 5px;
     width:auto;
+	float:left;
 }
+
+.bx-form-value .bx-form-input-autotoken img.bx-def-thumb-size {
+    width: 2.5rem;
+    height: 2.5rem;
+    line-height: 2.5rem;
+	float:left;	
+}

template/form_field_custom_suggestions.html

@@ -1,49 +1,9 @@
-<script>
-    $(function() {
-
-        $('#__id__ input[type=text]').autocomplete({
-            source: "__url_get_recipients__",
-            select: function(e, ui) {
-                $(this).val(ui.item.label);
-                $(this).trigger('superselect', ui.item);
-                e.preventDefault();
-            }
-        });
-
-        $('#__id__ input[type=text]').on('superselect', function(e, item) {
-            $(this).hide();
-            if ('undefined' != typeof(item))
-                $(this).before('<b class="bx-def-color-bg-hl bx-def-round-corners">'+ item.label +'<input type="hidden" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" name="__name__[]" value="'+ item.value +'" /></b>');
-            fAutoShrinkInput();
-            $(this).show();
-            this.value = '';
-
-        }).on('keydown', function(e) {
-
-            // if: comma,enter (delimit more keyCodes with | pipe)
-            if (/(13)/.test(e.which))
-                e.preventDefault();
-
-        });
-
-        $('#__id__').on('click', 'b', function() {
-            $(this).remove();
-            fAutoShrinkInput();
-        });
-
-        fAutoShrinkInput = function () {
-            var iWidthCont = $('#__id__.bx-form-input-autotoken').innerWidth();
-            var iWidthExisting = 0;
-            $('#__id__.bx-form-input-autotoken b').each(function () {
-                iWidthExisting += $(this).outerWidth(true);
-            });
-            $('#__id__.bx-form-input-autotoken input').width(parseInt(iWidthCont - iWidthExisting > 180 ? iWidthCont - iWidthExisting : 180) - 5);
-        };
-
-        fAutoShrinkInput();
-    });
-</script>
 <div id="__id__" class="bx-form-input-autotoken bx-def-font-inputs bx-form-input-text">
     __vals__
     <input type="text" value="" placeholder="__placeholder__" class="bx-def-font-inputs bx-form-input-text" />
 </div>
+<script>
+$(function(){
+	bx_autocomplete_fields('__id__','__url_get_recipients__', '__name__',__b_img__);
+});
+</script>

template/scripts/BxBaseFormView.php

@@ -946,7 +946,7 @@ BLAH;
             foreach ($aInput['value'] as $sVal) {
                 if (!$sVal || !($oProfile = BxDolProfile::getInstance($sVal)))
                     continue;
-               $sVals .= '<b class="val bx-def-color-bg-hl bx-def-round-corners">' . $oProfile->getDisplayName() . '<input type="hidden" name="' . $aInput['name'] . '[]" value="' . $sVal . '" /></b>';
+               $sVals .= '<b class="val bx-def-color-bg-hl bx-def-round-corners"><img class="bx-def-thumb bx-def-thumb-size bx-def-margin-sec-right" src="' . $oProfile->getThumb() . '">' . $oProfile->getDisplayName() . '<input type="hidden" name="' . $aInput['name'] . '[]" value="' . $sVal . '" /></b>';
             }
             $sVals = trim($sVals, ',');
         }
@@ -955,6 +955,7 @@ BLAH;
             'id' => $aInput['name'] . time() . mt_rand(0, 100),
             'url_get_recipients' => $aInput['ajax_get_suggestions'],
             'name' => $aInput['name'],
+			'b_img' => true,
             'placeholder' => bx_html_attribute(isset($aInput['placeholder']) ? $aInput['placeholder'] : _t('_sys_form_paceholder_profiles_suggestions'), BX_ESCAPE_STR_QUOTE),
             'vals' => $sVals,
         ));