@@ -81,30 +81,43 @@ class ContactPage {
8181 email : 'Email'
8282 } ;
8383
84- const ListOfContacts = document . getElementById ( 'list-of-contacts' ) ;
84+ const listOfContacts = document . getElementById ( 'list-of-contacts' ) ;
8585
8686 if ( TH_ELEM_CONTAINS === PREDICT_TEXT_CONTENT . firstName ) {
87- const sortedListByFirsName = this . sortUsersByValue ( 'firstName' , users ) ;
88- ListOfContacts . innerHTML = this . contactListComponent ( sortedListByFirsName ) ;
87+ const firstName = 0 ;
88+ const sortedListByFirsName = this . mergeSort ( users , firstName ) ;
89+ listOfContacts . innerHTML = this . contactListComponent ( sortedListByFirsName ) ;
8990 return ;
9091 }
9192
9293 if ( TH_ELEM_CONTAINS === PREDICT_TEXT_CONTENT . lastName ) {
93- const sortedListByLastName = this . sortUsersByValue ( 'lastName' , users ) ;
94- ListOfContacts . innerHTML = this . contactListComponent ( sortedListByLastName ) ;
94+ const lastName = 1 ;
95+ const sortedListByLastName = this . mergeSort ( users , lastName ) ;
96+ listOfContacts . innerHTML = this . contactListComponent ( sortedListByLastName ) ;
9597 return ;
9698 }
9799
98100 if ( TH_ELEM_CONTAINS === PREDICT_TEXT_CONTENT . email ) {
99101 const sortedListByEmail = this . sortUsersByValue ( 'email' , users ) ;
100- ListOfContacts . innerHTML = this . contactListComponent ( sortedListByEmail ) ;
102+ listOfContacts . innerHTML = this . contactListComponent ( sortedListByEmail ) ;
101103 return ;
102104 }
103105 } )
104106
105107 /* SORT USERS BY INPUTED LETTERS OF NAME */
108+ const contactSearchField = document . querySelector ( '#search' ) ;
106109
107-
110+ contactSearchField . addEventListener ( 'input' , ( ) => {
111+ const VALUE = contactSearchField . value ;
112+ const filteredUsers = this . filterUsersByInputValueByName ( VALUE ) ;
113+ const listOfContacts = document . getElementById ( 'list-of-contacts' ) ;
114+
115+ filteredUsers . length === 0
116+ ? listOfContacts . innerHTML = /*html*/ `<p>No such users</p>`
117+ : listOfContacts . innerHTML = this . contactListComponent ( filteredUsers ) ;
118+
119+
120+ } )
108121 }
109122
110123 sortUsersByValue ( key , users ) {
@@ -115,6 +128,52 @@ class ContactPage {
115128
116129 return [ ...users ] . sort ( sortFunction ) ;
117130 }
131+
132+ mergeSort ( arr , index ) {
133+
134+ const len = arr . length ;
135+ if ( len < 2 ) return arr ;
136+ const mid = Math . floor ( len / 2 ) ,
137+ left = arr . slice ( 0 , mid ) ,
138+ right = arr . slice ( mid ) ;
139+
140+ return this . merge ( this . mergeSort ( left , index ) , this . mergeSort ( right , index ) , index ) ;
141+ }
142+
143+ merge ( left , right , index ) {
144+ let result = [ ] ,
145+ lLen = left . length ,
146+ rLen = right . length ,
147+ l = 0 ,
148+ r = 0 ;
149+ while ( l < lLen && r < rLen ) {
150+ const leftWord = left [ l ] . fullName . split ( ' ' ) [ index ] ;
151+ const rightWord = right [ r ] . fullName . split ( ' ' ) [ index ] ;
152+ if ( leftWord < rightWord ) {
153+ result . push ( left [ l ++ ] ) ;
154+ }
155+ else {
156+ result . push ( right [ r ++ ] ) ;
157+ }
158+ }
159+
160+ return result . concat ( left . slice ( l ) ) . concat ( right . slice ( r ) ) ;
161+ }
162+
163+ filterUsersByInputValueByName ( inputValue ) {
164+ return users . reduce ( ( newUsers , user ) => {
165+ const firstName = user . fullName . split ( ' ' ) [ 0 ] . toLowerCase ( ) ;
166+
167+ const comparedPartOfName = firstName . slice ( 0 , inputValue . length ) ;
168+
169+ if ( inputValue . toLowerCase ( ) === comparedPartOfName ) {
170+ newUsers . push ( user ) ;
171+ }
172+
173+ return newUsers ;
174+ } , [ ] ) ;
175+
176+ }
118177}
119178
120179/* ================== CONTACT END================== */
0 commit comments