Merge pull request #27 from cis3296s24/user_checkbox

User checkbox

receiptifyv1/public/index.html

@@ -232,8 +232,14 @@ <h2>Top Track Generator</h2>
                 </div>
               </div>
               <div class="customize">
+                <!-- Somewhere here add the checkbox-->
+
                 <div class="mobile-ad"><div id="home_header"></div></div>
                 <p class="customize-header">Customize Receipt</p>
+
+                <div id="user-checkbox">
+                </div>
+
                 <p>Metric</p>
                 <form
                   class="form-group"
@@ -411,10 +417,7 @@ <h2 class='logo'>
             <p class='date'>
               ORDER #000{{num}}
               FOR
-              {{name}}
-            </p>
-            <p class='users'>
-              Current Users: {{users}}
+              {{users}}
             </p>
             <p class='date'>
               {{time}}

receiptifyv1/public/server.js

@@ -627,7 +627,35 @@ async function fetchUsers(sessionID, type) {
 ;}
 
 
-const displayReceipt = (response, stats) => {
+function checkboxUpdate(response, stats, state, users_checkbox, user, isChecked) {
+  if (users_checkbox.includes(null)){
+    console.log('true null');
+    users_checkbox.shift();
+  }
+  console.log("onclick redisplay");
+  if (!isChecked){
+    console.log(`Before: ${users_checkbox}`);
+    for (let i = 0; i < users_checkbox.length; i++) {
+      if (users_checkbox[i] == user){
+        users_checkbox.splice(i, 1);
+      }
+    }
+    console.log(`After: ${users_checkbox}`);
+  } else {
+    console.log(`Before: ${users_checkbox}`);
+    users_checkbox.push(user);
+    console.log(`After: ${users_checkbox}`);
+  }
+  if (users_checkbox.length == 0){
+    users_checkbox.push(null);
+    console.log(users_checkbox);
+  }
+  displayReceipt(response, stats, state, users_checkbox);
+;}
+
+const displayReceipt = (response, stats, state, users_checkbox = []) => {
+  const scrollPosition = window.scrollY;
+  console.log(state, users_checkbox);
   const type = getType();
   const font = getFont();
   const timeRange = getPeriod();
@@ -678,7 +706,7 @@ const displayReceipt = (response, stats) => {
   const sessionID = params.sessionID;
   const name = showSearch && response.label ? response.label : displayName;
 
-  let users;
+  let users = [];
   (async () => {
     try {
       users = await fetchUsers(sessionID, 'display_name');
@@ -701,13 +729,46 @@ const displayReceipt = (response, stats) => {
       });
       const totalFormatted =
         type === 'tracks' || showSearch ? getMinSeconds(total) : total.toFixed(2);
+
+
+      if (users_checkbox.length == 0){
+        console.log("No Previous users_checkbox");
+        users_checkbox = [...users];
+        const userCheckbox = document.getElementById('user-checkbox');
+        const userCheckboxTitle = document.createElement('p');
+        userCheckboxTitle.textContent = "Select Users";
+        userCheckbox.appendChild(userCheckboxTitle);
+        for (let i = 0; i < users.length; i++) {
+          const user = users[i];
+          console.log(user);
+          const checkbox = document.createElement('input');
+          checkbox.type = 'checkbox';
+          checkbox.id = `user${i}`;
+          checkbox.checked = (users_checkbox.includes(users[i]));
+          checkbox.onclick = (event) =>{
+            const isChecked = event.target.checked;
+            checkboxUpdate(response, stats, state, users_checkbox, users[i], isChecked);
+          }
+
+          const label = document.createElement('label');
+          label.textContent = user;
+          label.htmlFor = checkbox.id;
+
+          userCheckbox.appendChild(checkbox);
+          userCheckbox.appendChild(label);
+          userCheckbox.appendChild(document.createElement('br'));
+        }
+      } else {
+        console.log("Previous users_checkbox");
+      }
+
 
       userProfilePlaceholder.innerHTML = userProfileTemplate({
         tracks: tracksFormatted,
         total: totalFormatted,
         time: date,
         sessionID: sessionID,
-        users: users,
+        users: users_checkbox,
         num: showSearch ? 1 : TIME_RANGE_OPTIONS[timeRange].num,
         name: name,
         period: showSearch
@@ -747,6 +808,7 @@ const displayReceipt = (response, stats) => {
         } catch (error) {
           console.error('Error: ', error);
         }
+  window.scrollTo(0, scrollPosition);
   })();
 };
 
@@ -812,6 +874,7 @@ function displayStats(response, artists, tracks) {
           duration_ms: stats[key],
         };
       });
+      console.log("1");
       displayReceipt(response, statsArr);
     },
   });
@@ -925,8 +988,8 @@ function retrieveItems() {
             },
             success: (response2) => {
               displayReceipt({
-                ...response,
-                items: [...response.items, ...response2.items],
+                 ...response,
+                items: [...response.items, ...response2.items]
               });
             },
           });

receiptifyv1/test.js

@@ -0,0 +1,5 @@
+const test = (param1, param2, param3) => {
+    console.log(param1, param2, param3);
+}
+var param1="womp";
+test(param1, "stomp");

receiptifyv1/users.csv

@@ -1,17 +1,3 @@
-display_name, access_token, sessionID, access_time
+display_name, access_token, sessionID
+
 
-Ari,BQCP-pEB5lhDy5fNsXl5LoVLNipiN0WDz-inBZRu6ZYEOya5zykLidrXpy1gfhFdfq9H_K5rJeHiRgfGCZWI0i2NPm7lqCCuvkx_mRFwiED_EmFCnisn15nKfwKKd9Rf8TlrKG7Ggfp9v6Rlu2uG0H0dG0VnkukkqAO95CeR-YNUJBeuES-VFAZHhb0ZsxMr53c0wfy3ywVPI9cWmN-Q1YjPrxJqSYMZnMwL1InaOKDw6Xhb7WEYn57-,291061,2024-4-15 14:34:47,
-Ari,BQDxR2Qq9zQ320bpRgN1Wyx7XpmEHTdEAJSdRN2ARQO5Js3-m4fQnOkd80j6iF42fdPGjttX1rbpgu0qjlak5aeUuw_wN0L8UkSqEJZGWvn7aW8bDiwdhACdhExY7C6HVXeNAR8pMoZ_T6ug1kCFfasVtj1OF0j3baFCLeBrSmJnxO5DrhSBpt2LToBxTYJJk1mADVbDi9EkIl8qUW9o_eXjiqkEUy9Oq6Seg1mHgLCIMGjxer3fvTHu,673079,2024-4-15 14:36:50,
-Ari,BQC_6CBiI09pRgGIiNEsu8uYg1Ok-5CWLA8OjaAvCV_cg-RedtPbB9hSizFjywBrcCqqVs-QhJ7VrhnkKz89yduHpc9oMixyzNYIHAHtMJAs_U4VM83cNCVilmh0uxmFz5lDYYeySJH2Oe79P82kypyy-ZgxPyN6LoxkEKupYPAUTRfgIMuWIpdM-UQ0MT2MO0cd7U10Zn7_T_lfeNlt6PiytXVqE_palrUDDnX7w8EmwTzKGNGTAqFt,155495,2024-4-15 14:37:42,
-Ari,BQBwL8Ws7yHCjdd9QV1G3pt-5W3yi0aM7dGujwAGU7HasXUTUVCuc9VLy6kSSw1uOnTv6zy5JWdgsjwj_zJD0vLRIfV20W8kKQLEQDyBDIU2nT5YTdjCpaCpardJsum4yA5utNifSte6jSPD-OSE_kFkRyySQJEVjMGvlwHW9itJHT0gJ0vnYSYQrUHaZFzef1c7lHA_DchqPPnEYN01myNUUlsMS_EjzsWG8iTJUZelzZAyalCFesrI,390038,2024-4-15 14:39:2,
-Ari,BQDL5xAhbDHRKyAFTJpk-a1RKr1_lBbk3PiwA76051ku84IdIHZS3fd52G7gVZzmYT24f6p98dmCWzHcXC5UBl3UPv5Hl0-NbVWHYA6qjT1BAgT2sjEWPGoaSI_wK5T7qq6LpG-3zNzZ6P8y0J-fblgqP-82Pz2u5PTcAcpfkXVPmv5DxED6qkb1hqJppgJ44tRZqA9PwoEC_EyecWa0KHcjeHAep72odnmHz_3C_1h2ibrU_l_x75CT,396375,2024-4-15 14:40:18,
-Ari,BQB0bMB_3wwtSv0QXfthdzm4hyREALV7sCNo6YH3ukzQTPMSH-FtYWiScH-IT3mTivtMR5Uqb7SdJXqf9q4gXsLCFLG1ZP5xOyZo4ohUvzuwVIRTDv5dDN7dWxZBInJ_wxzWnvC5ZYu5sXDs8529Of9Mw2FZB5MWu5wyzi_fRGMhI61I38Qe3zCc3c_lXK8ZvYxCmHVOYsWUiMwDjmOVrT2w-KEKJ8VstbEGACGgMCZAWlw9G6Yzy7zv,714200,2024-4-15 14:44:55,
-Ari,BQDPj3P66_P4pdfXY06WBuphOLGAS2u2XGrUnGPgy8DXDSkXFRa6q1dNnKqLujXV8cidm1EYvTSAmKrzAqlLJWeIGxaectySGkUC-Q1XoQRtZ9FUMKaLZhuZDvF975bXhYzPlQUdYQ26lQhBXiL900awAYL7bKMgnga_wYsHJL5sB8awcnQ_eP0JGcMd2zn_c8YAgdPZbr_HaKiqE1ixGodiEmsjDgEmQRnHBgc4FoJUdmNZ_ZRFY0jQ,564607,2024-4-15 14:45:49,
-Ari,BQCUpHjjSj0Tm4v2nOBN6pxh7BdF08i1ZR-b2UYV0IYFcqwSEgzkGxjpByi7u-VyZ3oPcSz40BUVAX44U4rQWMb3MpF_oEMebbuPCMENMEhlmrZBt5XO1ht2KCgvE4h2_0RVG5QLbL_5xI-ri4R33-BCEx3MjRZTuGOPx7GK5ZN7IqtEJ87xBKVudpSqhVWTezIAGDTRKcdopvq3zY89Pq8JgExco-SdN0iFYxU6FVd2rHv6N-e5ARuF,528179,2024-4-15 14:46:33,
-Ari,BQD8la1RfCxvzudwnw99fsEBk9Jp_7L_p0P6oOMvfOd9Vk3DK-afRLrQDNo9_jY9IgE1lyYAbbl9E8d4d12kfI1uPxW6wdV70EKOlSTQcZDfgH5EDGI1JiSlPmYK-Zmv-4cU9U0gdoHyQmN9W-x6x7JFD-j7uF6dM7I6v9OQgLz47oerjmWaoCA4gM2gZujbCfkOfWEY07R_ooMySklr_j-Bb3b6CL-7jprW9ohd_xBtq52SbKhE33Ds,783469,2024-4-15 14:47:8,
-Ari,BQC-tetSYPxQAebmeB0ZzmMZ0OagVDByR9hv10a9go8UsfZ9V_9N38-fSPipo4V720VWCB71g3CDaYZlRBn-kl9wr5Un_9hiG5YGmAIZkwaryILCBC7VkVJBiVJ6SgsJf_rBX_yST_TmRfVSCnRdmTUNinVWoiYA2_dTEWXJViw7LJSoxDavTCVvM6xGN1Rf2s5oAgCS7xn0iJlB2B4tmpKv2nYC8MLg4H8N7gQZbT8xCEmoGJjsn_YS,300389,2024-4-15 14:47:25,
-Ari,BQCC5kiilFi72ZdfDH6HV2sAv9MDNpTUGSPJSuWRdmUkEL-qUZi9ZSUDEtf4sx79DxqV0dlG0GJi5pc2uQ1WaE5nJR1m4mGjb4dE7buF2Q1CMoAZdfNWCAvUyfTDzK_zxvSdRDsRPUFaIz3rmz0QH0Ju7VhRnahNGkco5WOTQ7V8t8lXUtXM96L7WThv_bzu7NhoW9CBnEdg4jUPWxPfdRSP0jl_2X5EiJ_LaL9grLoTJ7zZGHT6CVmB,322975,2024-4-15 14:47:54,
-Ari,BQBhPJqs8q65jmRm3sWQVfKx4hFMtH-bT4-gIvAer3g8VIzPIjcSCjpc-Ic33XrYYnMw97jgPhunQVVrRu_bgcwtwqjjf_hyP957-LXKCc_PCDJDsCmDHup2jzefro-crBzGnsx-qRpIYge-UWI0Gx9YAHl9vE4yYiQSzug2CdVoPmSTklxbIytYHbx9hl2UbLC_VKn4JcbUI2xXqoIpH1m64g-OkLakKEZbDY4-F7TDYXqi4OWMVXG9,235388,2024-4-15 14:49:2,
-Ari,BQBHzxbGmc0wHua739cG2Zv_lC1fepZMJJyejmvj-EXHsXsivQJSWV3nONwbXoXylpjTYI1VTunEVe4gWXlvVQ5Zb_s60lzFYjA2dmtTaoRALOjakaCJcC3a7OU6KaavSg_uW-1M3Fh7edAccZUAM5XtxOYNuSeqmrPj0k-kXxYbpEp98RH-DLYTXOPM16sesI68aSTEeGgpEQaRB0Sh-rW9YBI3HG2uaAR70ANul8QgK0FuzXTH3SB8,473057,2024-4-15 14:53:37,
-Ari,BQBFcW3jp-1bZ1RBCAr6TdNgbo8hpWk1pQ7JqmICm_7Pjz1FmZhkQwubN3E8C9JpQat6JuzzxvrZXe5WsFNPqfpAVdjli-GiiqYT3yLKSWggQDvo7R5GSv8ew5s-jTOUC5fOA9eAsPxZsXuDrGkz58YlL4IIz4_yPs8aiEYxGnahfgxepX8ITJlmtqIGGvkOzBDa_xVg4OOn0tRGWGGbMO8HgrrBP9D0koKL4H8GG1J4bs9J788ZkIIN,874240,2024-4-15 14:56:20,
-Ari,BQBZWoC_MjVJb-Wf79eRG4K0y5isbAis_iXgqCB-a4yB1Kn_Sfclp_rUGal5trve4IYfjm2kGKgvhXyr7hxCpVG9BgJtwwqxi_LXMWIjMKvrQRhaJTgGQ6274GGWA1ZW-sW_rvDUpHW4tzXjhXfLHnGVbIyRfkYkR3ZZh5NiYXr87C5tCVAuK483BMA7bHmAjl15PrA5KSd3p6Rc4cQbL-s91oVS364AAffsO12JSbRHZx3iWJ08inHM,528748,2024-4-15 14:57:11,