@@ -44,8 +44,9 @@ qx.Class.define("osparc.share.NewCollaboratorsManager", {
4444 __resourceData : null ,
4545 __showOrganizations : null ,
4646 __textFilter : null ,
47- __searchButton : null ,
4847 __collabButtonsContainer : null ,
48+ __searchingCollaborators : null ,
49+ __searchDelayer : null ,
4950 __shareButton : null ,
5051 __selectedCollaborators : null ,
5152 __potentialCollaborators : null ,
@@ -72,17 +73,24 @@ qx.Class.define("osparc.share.NewCollaboratorsManager", {
7273 } ) ) ;
7374 const filter = this . __textFilter = new osparc . filter . TextFilter ( "name" , "collaboratorsManager" ) ;
7475 filter . setCompact ( true ) ;
75- this . addListener ( "appear" , ( ) => filter . getChildControl ( "textfield" ) . focus ( ) ) ;
76+ const filterTextField = filter . getChildControl ( "textfield" ) ;
77+ filterTextField . setPlaceholder ( this . tr ( "Search" ) ) ;
78+ this . addListener ( "appear" , ( ) => filterTextField . focus ( ) ) ;
7679 toolbar . add ( filter , {
7780 flex : 1
7881 } ) ;
79- const searchButton = this . __searchButton = new osparc . ui . form . FetchButton ( this . tr ( "Search" ) , "@FontAwesome5Solid/search/12" ) . set ( {
80- maxHeight : 30 ,
82+ filterTextField . addListener ( "input" , e => {
83+ const filterValue = e . getData ( ) ;
84+ if ( this . __searchDelayer ) {
85+ clearTimeout ( this . __searchDelayer ) ;
86+ }
87+ if ( filterValue . length > 3 ) {
88+ const waitBeforeSearching = 1000 ;
89+ this . __searchDelayer = setTimeout ( ( ) => {
90+ this . __searchUsers ( ) ;
91+ } , waitBeforeSearching ) ;
92+ }
8193 } ) ;
82- const command = new qx . ui . command . Command ( "Enter" ) ;
83- searchButton . setCommand ( command ) ;
84- searchButton . addListener ( "execute" , ( ) => this . __searchUsers ( ) , this ) ;
85- toolbar . add ( searchButton ) ;
8694 this . add ( toolbar ) ;
8795
8896 const collabButtonsContainer = this . __collabButtonsContainer = new qx . ui . container . Composite ( new qx . ui . layout . VBox ( ) ) ;
@@ -92,6 +100,10 @@ qx.Class.define("osparc.share.NewCollaboratorsManager", {
92100 flex : 1
93101 } ) ;
94102
103+ const searchingCollaborators = this . __searchingCollaborators = new osparc . filter . SearchingCollaborators ( ) ;
104+ searchingCollaborators . exclude ( ) ;
105+ this . __collabButtonsContainer . add ( searchingCollaborators ) ;
106+
95107 const buttons = new qx . ui . container . Composite ( new qx . ui . layout . HBox ( ) . set ( {
96108 alignX : "right"
97109 } ) ) ;
@@ -105,8 +117,8 @@ qx.Class.define("osparc.share.NewCollaboratorsManager", {
105117 } ,
106118
107119 __searchUsers : function ( ) {
120+ this . __searchingCollaborators . show ( ) ;
108121 const text = this . __textFilter . getChildControl ( "textfield" ) . getValue ( ) ;
109- this . __searchButton . setFetching ( true ) ;
110122 osparc . store . Users . getInstance ( ) . searchUsers ( text )
111123 . then ( users => {
112124 users . forEach ( user => user [ "collabType" ] = 2 ) ;
@@ -116,7 +128,7 @@ qx.Class.define("osparc.share.NewCollaboratorsManager", {
116128 console . error ( err ) ;
117129 osparc . FlashMessenger . getInstance ( ) . logAs ( err . message , "ERROR" ) ;
118130 } )
119- . finally ( ( ) => this . __searchButton . setFetching ( false ) ) ;
131+ . finally ( ( ) => this . __searchingCollaborators . exclude ( ) ) ;
120132 } ,
121133
122134 __showProductEveryone : function ( ) {
@@ -208,6 +220,10 @@ qx.Class.define("osparc.share.NewCollaboratorsManager", {
208220 }
209221 this . __collabButtonsContainer . add ( this . __collaboratorButton ( potentialCollaborator ) ) ;
210222 } ) ;
223+
224+ // move it to last position
225+ this . __collabButtonsContainer . remove ( this . __searchingCollaborators ) ;
226+ this . __collabButtonsContainer . add ( this . __searchingCollaborators ) ;
211227 } ,
212228
213229 __shareClicked : function ( ) {
0 commit comments