if ( $view.innerWidth() === 0 ) {
return ;
}
- var inputBox = $view.find( ".ui-tokentextarea-input" );
self._modifyInputBoxWidth();
$( inputbox ).removeClass( "ui-tokentextarea-input-invisible" ).addClass( "ui-tokentextarea-input-visible" );
});
textBlock = self._ellipsisTextBlock( textBlock );
textBlock.css( {'visibility': 'visible'} );
- self._currentWidth += self._calcBlockWidth( textBlock );
self._modifyInputBoxWidth();
- $view.trigger( "add" );
+
+ textBlock.hide();
+ textBlock.fadeIn( "fast", function() {
+ self._currentWidth += self._calcBlockWidth( textBlock );
+ $view.trigger( "add" );
+ });
},
_removeTextBlock : function () {
if ( lockBlock !== null && lockBlock.length > 0 ) {
self._currentWidth -= self._calcBlockWidth( lockBlock );
- lockBlock.remove();
- self._modifyInputBoxWidth();
+
+ lockBlock.fadeOut( "fast", function() {
+ lockBlock.remove();
+ self._modifyInputBoxWidth();
+ });
this._eventRemoveCall = true;
if ( $view[0].remove ) {
inputBoxWidth = self._viewWidth;
}
} else {
- if ( blockWidth >= inputBoxWidth ) {
+ if ( blockWidth > inputBoxWidth ) {
inputBoxWidth = self._viewWidth - blockWidth;
} else {
inputBoxWidth -= blockWidth;
statement = self._stringFormat( self.options.description, blocks.length - lastIndex - 1 );
tempBlock = $( document.createElement( 'label' ) );
tempBlock.text( statement );
- tempBlock.addClass( "ui-tokentextarea-desclabel" ).addClass( "ui-tokentextarea-desclabel" );
+ tempBlock.addClass( "ui-tokentextarea-desclabel" );
$( blocks[lastIndex] ).after( tempBlock );
}
}
if ( arguments.length === 0 ) {
- blocks.remove();
- this._trigger( "clear" );
+ blocks.fadeOut( "fast", function() {
+ blocks.remove();
+ self._modifyInputBoxWidth();
+ this._trigger( "clear" );
+ });
} else if ( !isNaN( position ) ) {
// remove selected button
index = ( ( position < blocks.length ) ? position : ( blocks.length - 1 ) );
- $( blocks[index] ).remove();
+
+ $( blocks[index] ).fadeOut( "fast", function() {
+ $( blocks[index] ).remove();
+ self._modifyInputBoxWidth();
+ });
this._eventRemoveCall = true;
if ( $view[0].remove ) {
}
this._eventRemoveCall = false;
}
- self._modifyInputBoxWidth();
},
length : function () {
.ui-tokentextarea {
display : table;
outline : none;
+ position : relative;
}
.ui-tokentextarea .ui-tokentextarea-label {
display : inline-block;
text-align : center;
position : relative;
- margin-left : .3em;
- margin-right : .3em;
- padding : .6em 0em;
+ margin-left : 5px;
+ margin-right : 5px;
+ padding : 10px 0px;
color : @color_tokentextarea_label_text;
font-weight : bold;
text-align : center;
position : relative;
border : 0 !important;
padding : 0 !important;
- margin : .5em;
+ margin : 8px;
color : @color_tokentextarea_input_text;
text-align : left;
font-size : 1em;
text-align : center;
cursor : pointer;
position : relative;
- margin-left : .3em;
- margin-right : .3em;
- margin-bottom : .3em;
- margin-top : .3em;
- padding : .2em .5em;
+ margin-left : 5px;
+ margin-right : 5px;
+ margin-bottom : 5px;
+ margin-top : 5px;
+ padding : 3px 8px;
font-size : 1em;
text-shadow : 0 .1em .1em rgba(0,0,0,.3);
-ms-border-radius : .2em;
background-image : url(./images/00_contacts_button_header.png);
background-size : contain;
background-repeat : no-repeat;
- padding-left : .7em;
+ padding-left : 11px;
}
div.ui-tokentextarea-sblock {
background-image : url(./images/00_contacts_button_header_press.png);
background-size : contain;
background-repeat : no-repeat;
- padding-left : .7em;
+ padding-left : 11px;
}
.ui-tokentextarea .ui-tokentextarea-desclabel {
font-size : 1em;
}
-.ui-tokentextarea-focus-button {
- background-image : url(./images/00_button_expand_opened.png);
- }
+.ui-tokentextarea-link-base {
+ position : absolute;
+ right : 0em;
+ bottom : .2em;
+}
@color_tokentextarea_block_bg : rgb(95, 138, 189);
@color_tokentextarea_press_bg : rgb(54, 89, 132);
@color_tokentextarea_input_text : #222222;
-@color_tokentextarea_link : rgb(186, 185, 180);
@color_tokentextarea_label_text : rgb(102, 102, 102);
/***************************************************************************