Advertisement
Guest User

Untitled

a guest
Jan 18th, 2019
122
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. initContacts(){
  2.        
  3.         this._user.on('contactschange', docs => {
  4.  
  5.             this.el.contactsMessagesList.innerHTML = '';
  6.  
  7.             docs.forEach(doc => {
  8.                
  9.             let contact = doc.data();
  10.             let div = document.createElement('div');
  11.  
  12.         div.className = 'contact-item';
  13.  
  14.         div.innerHTML = `
  15.                 <div class="dIyEr">
  16.                     <div class="_1WliW" style="height: 49px; width: 49px;">
  17.                         <img src="#" class="Qgzj8 gqwaM photo" style="display:none;">
  18.                         <div class="_3ZW2E">
  19.                             <span data-icon="default-user" class="">
  20.                                 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 212 212" width="212" height="212">
  21.                                     <path fill="#DFE5E7" d="M106.251.5C164.653.5 212 47.846 212 106.25S164.653 212 106.25 212C47.846 212 .5 164.654.5 106.25S47.846.5 106.251.5z"></path>
  22.                                     <g fill="#FFF">
  23.                                         <path d="M173.561 171.615a62.767 62.767 0 0 0-2.065-2.955 67.7 67.7 0 0 0-2.608-3.299 70.112 70.112 0 0 0-3.184-3.527 71.097 71.097 0 0 0-5.924-5.47 72.458 72.458 0 0 0-10.204-7.026 75.2 75.2 0 0 0-5.98-3.055c-.062-.028-.118-.059-.18-.087-9.792-4.44-22.106-7.529-37.416-7.529s-27.624 3.089-37.416 7.529c-.338.153-.653.318-.985.474a75.37 75.37 0 0 0-6.229 3.298 72.589 72.589 0 0 0-9.15 6.395 71.243 71.243 0 0 0-5.924 5.47 70.064 70.064 0 0 0-3.184 3.527 67.142 67.142 0 0 0-2.609 3.299 63.292 63.292 0 0 0-2.065 2.955 56.33 56.33 0 0 0-1.447 2.324c-.033.056-.073.119-.104.174a47.92 47.92 0 0 0-1.07 1.926c-.559 1.068-.818 1.678-.818 1.678v.398c18.285 17.927 43.322 28.985 70.945 28.985 27.678 0 52.761-11.103 71.055-29.095v-.289s-.619-1.45-1.992-3.778a58.346 58.346 0 0 0-1.446-2.322zM106.002 125.5c2.645 0 5.212-.253 7.68-.737a38.272 38.272 0 0 0 3.624-.896 37.124 37.124 0 0 0 5.12-1.958 36.307 36.307 0 0 0 6.15-3.67 35.923 35.923 0 0 0 9.489-10.48 36.558 36.558 0 0 0 2.422-4.84 37.051 37.051 0 0 0 1.716-5.25c.299-1.208.542-2.443.725-3.701.275-1.887.417-3.827.417-5.811s-.142-3.925-.417-5.811a38.734 38.734 0 0 0-1.215-5.494 36.68 36.68 0 0 0-3.648-8.298 35.923 35.923 0 0 0-9.489-10.48 36.347 36.347 0 0 0-6.15-3.67 37.124 37.124 0 0 0-5.12-1.958 37.67 37.67 0 0 0-3.624-.896 39.875 39.875 0 0 0-7.68-.737c-21.162 0-37.345 16.183-37.345 37.345 0 21.159 16.183 37.342 37.345 37.342z"></path>
  24.                                     </g>
  25.                                 </svg>
  26.                             </span>
  27.                         </div>
  28.                     </div>
  29.                 </div>
  30.                 <div class="_3j7s9">
  31.                     <div class="_2FBdJ">
  32.                         <div class="_25Ooe">
  33.                             <span dir="auto" title="${contact.name}" class="_1wjpf">${contact.name}</span>
  34.                         </div>
  35.                         <div class="_3Bxar">
  36.                             <span class="_3T2VG">${contact.lastMessageTime}</span>
  37.                         </div>
  38.                     </div>
  39.                     <div class="_1AwDx">
  40.                         <div class="_itDl">
  41.                             <span title="digitando…" class="vdXUe _1wjpf typing" style="display:none">digitando…</span>
  42.                             <span class="_2_LEW last-message">
  43.                                 <div class="_1VfKB">
  44.                                     <span data-icon="status-dblcheck" class="">
  45.                                         <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18" width="18" height="18">
  46.                                             <path fill="#263238" fill-opacity=".4" d="M17.394 5.035l-.57-.444a.434.434 0 0 0-.609.076l-6.39 8.198a.38.38 0 0 1-.577.039l-.427-.388a.381.381 0 0 0-.578.038l-.451.576a.497.497 0 0 0 .043.645l1.575 1.51a.38.38 0 0 0 .577-.039l7.483-9.602a.436.436 0 0 0-.076-.609zm-4.892 0l-.57-.444a.434.434 0 0 0-.609.076l-6.39 8.198a.38.38 0 0 1-.577.039l-2.614-2.556a.435.435 0 0 0-.614.007l-.505.516a.435.435 0 0 0 .007.614l3.887 3.8a.38.38 0 0 0 .577-.039l7.483-9.602a.435.435 0 0 0-.075-.609z"></path>
  47.                                         </svg>
  48.                                     </span>
  49.                                 </div>
  50.                                 <span dir="ltr" class="_1wjpf _3NFp9">${contact.lastMessage}</span>
  51.                                 <div class="_3Bxar">
  52.                                     <span>
  53.                                         <div class="_15G96">
  54.                                             <span class="OUeyt messages-count-new" style="display:none;">1</span>
  55.                                         </div>
  56.                                 </span></div>
  57.                                 </span>
  58.                         </div>
  59.                     </div>
  60.                 </div>`;
  61.  
  62.             if (contact.photo) {
  63.                 let img = div.querySelector('.photo');
  64.                 img.src = contact.photo;
  65.                 img.show();
  66.             }
  67.  
  68.             div.on('click', e => {
  69.  
  70.                 this.el.activeName.innerHTML = contact.name;
  71.                 this.el.activeStatus.innerHTML = contact.status;
  72.  
  73.                 if (contact.photo) {
  74.                     let img = this.el.activePhoto;
  75.                     img.src = contact.photo;
  76.                     img.show();
  77.                 }
  78.  
  79.                 this.el.home.hide();
  80.                 this.el.main.css({
  81.                     display:'flex'                    
  82.                 });
  83.  
  84.             });
  85.  
  86.             this.el.contactsMessagesList.appendChild(div);
  87.  
  88.             });
  89.  
  90.         });
  91.  
  92.         this._user.getContacts();
  93.  
  94.     }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement