mirror of
				https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git
				synced 2025-11-03 20:02:47 +00:00 
			
		
		
		
	Merge branch 'profile-page' into development
This commit is contained in:
		
							
								
								
									
										79
									
								
								app/static/js/RessourceLists/PublicUserList.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										79
									
								
								app/static/js/RessourceLists/PublicUserList.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,79 @@
 | 
			
		||||
class PublicUserList extends RessourceList {
 | 
			
		||||
  static autoInit() {
 | 
			
		||||
    for (let publicUserListElement of document.querySelectorAll('.public-user-list:not(.no-autoinit)')) {
 | 
			
		||||
      new PublicUserList(publicUserListElement);
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  static options = {
 | 
			
		||||
    initialHtmlGenerator: (id) => {
 | 
			
		||||
      console.log(id);
 | 
			
		||||
      return `
 | 
			
		||||
        <div class="input-field">
 | 
			
		||||
          <i class="material-icons prefix">search</i>
 | 
			
		||||
          <input id="${id}-search" class="search" type="search"></input>
 | 
			
		||||
          <label for="${id}-search">Search user</label>
 | 
			
		||||
        </div>
 | 
			
		||||
        <table>
 | 
			
		||||
          <thead>
 | 
			
		||||
            <tr>
 | 
			
		||||
              <th style="width:15%;"></th>
 | 
			
		||||
              <th>Username</th>
 | 
			
		||||
              <th></th>
 | 
			
		||||
            </tr>
 | 
			
		||||
          </thead>
 | 
			
		||||
          <tbody class="list"></tbody>
 | 
			
		||||
        </table>
 | 
			
		||||
        <ul class="pagination"></ul>
 | 
			
		||||
      `.trim();
 | 
			
		||||
    },
 | 
			
		||||
    item: `
 | 
			
		||||
      <tr class="clickable hoverable">
 | 
			
		||||
        <td><img alt="user-image" class="circle responsive-img avatar" style="width:80%"></td>
 | 
			
		||||
        <td><span class="username"></span></td>
 | 
			
		||||
        <td class="right-align">
 | 
			
		||||
          <a class="action-button btn-floating waves-effect waves-light" data-action="view"><i class="material-icons">send</i></a>
 | 
			
		||||
        </td>
 | 
			
		||||
      </tr>
 | 
			
		||||
    `.trim(),
 | 
			
		||||
    ressourceMapper: (user) => {
 | 
			
		||||
      return {
 | 
			
		||||
        'id': user.id,
 | 
			
		||||
        'member-since': user.member_since,
 | 
			
		||||
        'avatar': `/static/images/user_avatar.png`,
 | 
			
		||||
        'username': user.username
 | 
			
		||||
      };
 | 
			
		||||
    },
 | 
			
		||||
    sortArgs: ['member-since', {order: 'desc'}],
 | 
			
		||||
    valueNames: [
 | 
			
		||||
      {data: ['id']},
 | 
			
		||||
      {data: ['member-since']},
 | 
			
		||||
      {name: 'avatar', attr: 'src'},
 | 
			
		||||
      'username'
 | 
			
		||||
    ]
 | 
			
		||||
  };
 | 
			
		||||
 | 
			
		||||
  constructor(listElement, options = {}) {
 | 
			
		||||
    super(listElement, {...PublicUserList.options, ...options});
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  init(users) {
 | 
			
		||||
    super._init(Object.values(users));
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  onClick(event) {
 | 
			
		||||
    let actionButtonElement = event.target.closest('.action-button');
 | 
			
		||||
    let action = actionButtonElement === null ? 'view' : actionButtonElement.dataset.action;
 | 
			
		||||
    let publicUserElement = event.target.closest('tr');
 | 
			
		||||
    let publicUserId = publicUserElement.dataset.id;
 | 
			
		||||
    switch (action) {
 | 
			
		||||
      case 'view': {
 | 
			
		||||
        window.location.href = `/profile/${publicUserId}`;
 | 
			
		||||
        break;
 | 
			
		||||
      }
 | 
			
		||||
      default: {
 | 
			
		||||
        break;
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
@@ -10,6 +10,8 @@ class RessourceList {
 | 
			
		||||
    JobList.autoInit();
 | 
			
		||||
    JobInputList.autoInit();
 | 
			
		||||
    JobResultList.autoInit();
 | 
			
		||||
    PublicCorporaList.autoInit();
 | 
			
		||||
    PublicUserList.autoInit();
 | 
			
		||||
    SpaCyNLPPipelineModelList.autoInit();
 | 
			
		||||
    TesseractOCRPipelineModelList.autoInit();
 | 
			
		||||
    UserList.autoInit();
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user