Rename PublicUserList to UserList

2025-07-29 07:01:35 +00:00 · 2023-01-11 13:47:09 +01:00
parent ce03201133
commit d462c1e4d6
3 changed files with 5 additions and 5 deletions
--- a/app/static/js/ResourceLists/UserList.js
+++ b/app/static/js/ResourceLists/UserList.js
@@ -0,0 +1,104 @@
+class UserList extends ResourceList {
+  static autoInit() {
+    for (let publicUserListElement of document.querySelectorAll('.user-list:not(.no-autoinit)')) {
+      new UserList(publicUserListElement);
+    }
+  }
+
+  constructor(listContainerElement, options = {}) {
+    super(listContainerElement, options);
+    this.listjs.list.addEventListener('click', (event) => {this.onClick(event)});
+  }
+
+  get item() {
+    return `
+      <tr class="list-item clickable hoverable">
+        <td><img alt="user-image" class="circle responsive-img avatar" style="width:50%"></td>
+        <td><b><span class="username"></span><b></td>
+        <td><span class="full-name"></span></td>
+        <td><span class="location"></span></td>
+        <td><span class="organization"></span></td>
+        <td><span class="corpora-online"></span></td>
+        <td class="right-align">
+          <a class="list-action-trigger btn-floating waves-effect waves-light" data-list-action="view"><i class="material-icons">send</i></a>
+        </td>
+      </tr>
+    `.trim();
+  }
+
+  get valueNames() {
+    return [
+      {data: ['id']},
+      {data: ['member-since']},
+      {name: 'avatar', attr: 'src'},
+      'username',
+      'full-name',
+      'location',
+      'organization',
+      'corpora-online'
+    ];
+  }
+
+  initListContainerElement() {
+    if (!this.listContainerElement.hasAttribute('id')) {
+      this.listContainerElement.id = Utils.generateElementId('public-user-list-');
+    }
+    let listSearchElementId = Utils.generateElementId(`${this.listContainerElement.id}-search-`);
+    this.listContainerElement.innerHTML = `
+      <div class="input-field">
+        <i class="material-icons prefix">search</i>
+        <input id="${listSearchElementId}" class="search" type="text"></input>
+        <label for="${listSearchElementId}">Search public user</label>
+      </div>
+      <table>
+        <thead>
+          <tr>
+            <th style="width:15%;"></th>
+            <th>Username</th>
+            <th>Full name</th>
+            <th>Location</th>
+            <th>Organization</th>
+            <th>Corpora online</th>
+            <th></th>
+          </tr>
+        </thead>
+        <tbody class="list"></tbody>
+      </table>
+      <ul class="pagination"></ul>
+    `.trim();
+  }
+
+  mapResourceToValue(user) {
+    return {
+      'id': user.id,
+      'member-since': user.member_since,
+      'avatar': user.avatar ? `/users/${user.id}/avatar` : '/static/images/user_avatar.png',
+      'username': user.username,
+      'full-name': user.full_name ? user.full_name : '',
+      'location': user.location ? user.location : '',
+      'organization': user.organization ? user.organization : '',
+      'corpora-online': '0'
+    };
+  };
+
+  sort() {
+    this.listjs.sort('member-since', {order: 'desc'});
+  }
+
+  onClick(event) {
+    let listItemElement = event.target.closest('.list-item[data-id]');
+    if (listItemElement === null) {return;}
+    let itemId = listItemElement.dataset.id;
+    let listActionElement = event.target.closest('.list-action-trigger[data-list-action]');
+    let listAction = listActionElement === null ? 'view' : listActionElement.dataset.listAction;
+    switch (listAction) {
+      case 'view': {
+        window.location.href = `/users/${itemId}`;
+        break;
+      }
+      default: {
+        break;
+      }
+    }
+  }
+}