adityarajmalviyaa

1. index.html: Gutted hardcoded departments; it now pulls live data from the Firestore branches collection.

2. Modified checkTimeWindow to allow 24/7 access for the “Reviewer” role.

3. Updated README.md with a notice on marking attendance real functioning (API thing) and instructions for creating creds using register page.

4. ‘https://github.com/adibuddies/attendance/commit/5e29c08e751a12afe4c1b88154cdc2c8db6bbeca’

1.B. ‘https://github.com/adibuddies/attendance/commit/fcccd6dc4f1f9c8fdc7ffad36a751c9cd4b1e1d1’

1. ‘https://github.com/adibuddies/attendance/commit/24b3b1f97516f301bfcd05c8ec486f2bd218fff4’

1. Added register.html to facilitate new registrations. It was required by Flavortown (got rejected twice for it)

2. Added- ‘Register here!’ in index.html

3. Updated firestore rules to allow read as well to attendance_log (though not needed for now).

Changelogs-

1. ‘https://github.com/adibuddies/attendance/commit/e034db4a2607c4e56d8e3793887311eadcbfe9ed’
2. ‘https://github.com/adibuddies/attendance/commit/3152e98f7052ae32721e4c4c54c4657d7647ddf9’
3. ‘https://github.com/adibuddies/attendance/commit/9f7a4f7dadbb6878cd35b82faeae89034730077c’

The Miracle Attendance PWA is officially finished. This was the final sprint and the longest I have done ever (but yeah it was broken in two major chunk of time). While the original goal was to integrate a full Computer Vision (CV) model for real-time face verification, I’ve had to make the difficult executive decision to shelf that specific feature for this version. Between the heavy academic load of Pure Mathematics exams and some recent health constraints, I didn’t have enough time to arrange for the CV.
Today also marks the final day for Flavortown.

1. PII & Anti-Scraping
   Canvas Rendering: I moved away from standard tags for personnel photos. By rendering the photo directly onto a element via photoBase64, there is no direct URL for a shoulder-surfer to find in the DevTools and “Save As”
   The Total Blackout: The blurred CSS class was updated to be much more aggressive. Instead of a simple blur, I implemented filter: brightness(0) and opacity: 0. The moment the window loses focus (standard for Snipping Tools or Screen Recording software), the entire screen turns into a solid black void.
   PII Shielding: All Personally Identifiable Information (Name, ID, Branch) was wrapped in the .secure-data class, making it non-selectable and protected by the blackout trigger.

2. Ghost Sessions
   A major “scary” discovery was how the browser’s Back/Forward arrows allowed users to peek at previous sessions. I implemented a pageshow listener combined with event.persisted checks. Now, if the browser tries to pull the page from its internal cache (bfcache) during a back-navigation or a refresh, the script immediately fires sessionStorage.clear() and uses window.location.replace to kick the user back to the login page.

A. I ran into a frustrating ReferenceError where the dashboard wouldn’t load.
A.1. I was “shadowing” my global empData variable with a local one inside the loadPersonnelData function.
A2. Refactored the logic to use a separate fetched variable and updated the global state using Object.assign
B. Live Firebase Storage triggered CORS blocks. I had to manually set the CORS configuration via gsutil to allow my local and hosted origins to talk to the bucket.

Plus— Personnel Dashboard to mark attendance is now live with a calendar! (don’t have integration for Firebase Cloud Functions so attendance won’t be marked but core functioning is implemented)

Goodbye, Flavortown.

Changelogs referenced:
“https://github.com/adibuddies/attendance/commit/9c8eed8c52d82a01c0a628c399d830cda47633b1”: Updated firestore rules
“https://github.com/adibuddies/attendance/commit/004a470ed2263b6553e77781b7be7dbaf73d4ee4”: Added full attendance.html
“https://github.com/adibuddies/attendance/commit/af383fed5bfcd91f6a087d96bfc8a70146a5365a”: Refractor index.html (renamed from login.html)
“https://github.com/adibuddies/attendance/commit/c48beef787a3fe3d97578add58a9906b96a91924”: branch.html changes

This is what I am trying to achieve. Pretty hard. Seems like I underestimated it.

Following up on that first sprint! The basic formula a_n = a + (n-1)d only gets you so far. I finally had to sit down and tackle the actual “tough” questions from RS Aggarwal and RD Sharma—the ones designed to twist your brain in exams.
My goal for this session was to make the calculator capable of solving the hardest categories I mapped out previously.

1. Upgraded the UI so the student can select the exact “Archetype” of the problem they are looking at.
2. System of two equations: I built backend logic to isolate d mathematically using (v1 - v2) / (n1 - n2).
3. Symmetric Selection: I hardcoded a symmetric assumption: (x-d), x, (x+d). It instantly finds the middle term and solves the rest. The math is not worth the time, it just get messy anyhow in the end with a, a+d and a+2d.
4. Divisibility Problems: automatically calculates the first and last valid numbers within the range so you don’t have to figure it out manually.

But I do think that there is a lot more we can do.

Also, when testing a massive range (like 1 to 10,000), Chart.js tried to draw thousands of points and almost fried my browser tab. I added a server-side cap to only plot the first 50 terms visually, while keeping the background numerical calculations 100% accurate.

Changelogs concerned—

1. Implement mode selector and update styles ‘https://github.com/adibuddies/apsolver/commit/ef77438af4c844e66cc80fe46f208eeffd3f5220’
2. Refactor solve_ap function to support new modes ‘https://github.com/adibuddies/apsolver/commit/e8983095edfa49ae6b78e87a583e5b36ccc6d549’
3. Implement input fields for two terms ‘https://github.com/adibuddies/apsolver/commit/78a2b152b35c505060eca68e47a7ea6c5def3e8e’
4. Refactor mode selector and update UI elements ‘https://github.com/adibuddies/apsolver/commit/47cc6fb6829adb487ac6429e8b9a2d688d520b49’
5. Refactor solve_ap function for 4 types of arithmetic progressions questions ‘https://github.com/adibuddies/apsolver/commit/9136834a730de64ff449ecde23cc88ee3bf6c99f’

(PS - Just like the last devlog, you’ll see these commits were pushed in rapid succession today. Still doing that retroactive upload from my local serial files to get everything synced up for Flavortown before I collapse into bed! I have been working non-stop from 5 to 10:30 now in the morning. And I slept just 4 hours before that.)

Project complete. It can basically solve the entire AP chapter now

Also, please don’t mind the first photo, it’s a google download, I don’t know how to delete it.

My goal is to make an interactive and attractive place where students can solve all those difficult problems of Arithmetic Progression (and though not part of this project but a sequel goal- geometric progressions). AP questions have not certainly been tough but as like any other topic in mathematics, there are a few that are made to twist you…
So here’s my help.

I read through my old RS (and my friend’s RD) as well as a few question papers and categorised the types of questions based on-

1. What information is given,
2. What are we expected to find out from that.

I have to generalise each category to a specific one works all formula.

For now a basic html (but yeah impressively beautiful, and I must appreciate myself, I have made a lot of good css across all the projects here at Flavortown), is ready with a app.py that does with a basic formula-
a_n = a + (n-1)d
and s_n = (n/2){2a + (n-1)*d}

It is able to plot basic graphs.

Changelogs concerned—

1. README.md ‘https://github.com/adibuddies/apsolver/commit/227c35dfdf83656da5059805e54be5cd251a29fe’
2. App.py (basic calculations using formulae) ‘https://github.com/adibuddies/apsolver/commit/11f1ebaa62f66e36f25481a7607bfb23388348a0’
3. Index.html added with Chart.js for plotting graph ‘https://github.com/adibuddies/apsolver/commit/9f80907fcb7e5332ed3c17190093f6ec1a8430ae’

PS. You may find that the github commits are very close to each other, that is because I made this project 15-20 days ago as well as the Devlog with a very simple small message I had posted- “This is my first devlog, it’s quite early in the morning and I’m feeling like I drop any second. Will update it later…”
I didn’t have time to do GitHub and live site and all that day, I think I woke up till 5 AM for when I was already not getting enough sleep from academic load. So I just kept on making new serial order files for every change and now I have uploaded it in that order for Flavortown. Please don’t mind!

The primary goal for this session was to move the Miracle Attendance Portal from a local file:/// development environment to a live, production-ready state on Firebase Hosting. This required a complete alignment of our data pipeline to ensure the “Live Brain” (Firestore) was perfectly synced with the “Live Body” (PWA).
😵

• Transitioning to Firebase Hosting was the first step. I had to configure firebase.json and .firebaserc to map the root directory correctly. While the deployment was successful, it immediately revealed the “rigidity” of cloud environments compared to local testing—if the logic isn’t 100% perfect, the live site fails instantly.
  🦠
  The Debugging Journey

• After migrating the data from Excel to Firestore via node upload.js, I hit a critical mismatch.

• The Bug: My index.html was looking for a field named bid, but the database was still storing it as corpID because the upload.js pusher hadn’t been refactored yet.

• The Fix: Synchronized the Python translator and the Node.js pusher to use the new regional-ready schema (officeName, BID, BIN).

• One of the most frustrating errors of the session was a ReferenceError: enteredBID is not defined.

• Diagnosis: JavaScript is a case-sensitive stickler. I had defined enteredbid (lowercase) but called enteredBID (uppercase) in the logic check.

• Solution: Standardized all variable naming to enteredBID across the authentication listener.
  👻

• Fighting the Ghost Cache**
  Even after fixing the code and redeploying, the live site appeared broken.

• Lesson Learned: Firebase Hosting caches files heavily. I learned to utilize Hard Reloads (Ctrl+Shift+R) and Incognito Mode to bypass the “Ghost” versions of the code and ensure I was testing the latest deployment.

📌Current Status—

1. Deployment: Successfully live on pingin-presently.web.app.
2. Data Pipeline: Excel → Python → Firestore is now 100% synchronized with the bid and bin keys.
3. Auth Flow: “Head Office” / “HEAD” / “0001” now successfully clears authentication and redirects to the branch dashboard.

This was the final sprint to lock down the end. Android’s WebView engine is completely different game from desktop browsers, can’t seem to figure out what it renders and what it doesn’t. But anyways: https://github.com/adibuddies/letterhead.editor/commit/aa8a12022572545eab154070f2714d40372aa69d

1. I had completely removed all internet permissions so the HTML wasn’t able to communicate with qrcode.min.js on the url given. I fixed it by downloading the javascript file into the assets folder.
2. The micro-text features in android webview were just so not possible. Partially because I can’t expect a high-density display of a smartphone to render me a 0.5pt line (1/144th of an inch).
3. I fixed it by leaving no trace for the micro-text in the android app while it worked as usual with PC version.

Finally, an APK is available to download and test in the repo. Please do check out!

1. Eliminated the unwanted black margins.
   Injected an initial @media print block to force a white background and reset the .preview-area. I also set the .letterhead to a fixed 210mm width to override the mobile 100% view.
   The placement was still off, and the letter was still going into a second page on the PDF.
   Then comes the attempt to correct—
2. .letter-content increased the top margin to 2.5in
3. Reduced height to 296mm
4. overflow: hidden in the print CSS to guarantee a 1-page output

Success! 😎

Changelog: https://github.com/adibuddies/letterhead.editor/commit/eb4f501dfac449b1dc4044589081329ff3d98804

I can now scroll to the extreme bottom and am able to access the letter. Solved one of the problems. Now heading to defeat those unwanted black margins in the printed PDF! 😏😈

Diff view link: https://github.com/adibuddies/letterhead.editor/commit/b4d89278ce281316d5a8cf15f8f1789d360052e9

I implemented @media (max-width: 600px) logic to completely overhaul the layout as the index.html was a desktop-first design.
I swapped the main body from flex-direction: row to column, now instead of horizontal space the control features now sit on top of the letterhead vertically.
I had to use !important on almost every font size and padding value because the original desktop styles were acting higher and refused to be overridden by media queries.
I also scaled the name down to 18pt.

Now here’s the problem—
I fixed the “squashed” look, but I’ve run into a serious usability wall.
Because the sidebar is so long with all the new identity fields, it’s taking up the entire viewport. I can’t scroll past the “Print PDF” button to actually reach the letter body. If I can’t scroll, I can’t type, which basically makes it a very pretty, very useless screen right now.

I’m stopping here for the day before I smash my head against the keyboard.🥲

Once these issues are resolved I am going to make the Gen. QR button work and look if the code needs any more refining.

Changelogs: https://github.com/adibuddies/letterhead.editor/commits/LetterheadEditorbyMiracle/

Had to compress due to exceeding char limit

Phase 1 — Initialization (Android Studio, Java, API 24)

1. Incorrect asset root caused crash; fixed by relocating to src/main/assets and updating WebView to file:///android_asset/index.html.
2. A4 layout rendered incorrectly due to desktop-oriented CSS in WebView.

Phase 2 — Security & Isolation

1. Removed INTERNET permission; enforced no-cache via:
   myWebView.clearCache(true);
   s.setCacheMode(WebSettings.LOAD_NO_CACHE);
2. Bundled fonts (Playfair Display, EB Garamond, Inter) and localized Phosphor icons.
3. Fixed CSS font paths (../fonts/Phosphor.woff2).
4. Disabled content access and cross-file interaction.

Phase 3 — Functionality (WebView ↔ Android bridge)

1. Implemented WebChromeClient for image upload without broad storage permissions.
2. Added JavascriptInterface to route window.print to Android Print Spooler.
3. Tested on Android 12 (unsigned APK); all implemented features working as intended.

😎
This update was about breaking the previous hardcoded version into a flexible local app: professional letter tool.
Yk the previous version had a lot of info which was immutable using the UI/UX.

Changelog: https://github.com/adibuddies/letterhead.editor/commit/1588299078f86fcff3d937cfb9c0ba0756fdf11f

1. I replaced the hardcoded src paths for the logo (/watermark) and Signature with a FileReader logic. You can now upload your own logo and digital signature directly through the sidebar options.
2. I added several new metadata fields to the identity container, including Memberships, Phone Number, and a combined Socials line (LinkedIn/GitHub/Web).
3. Instead of a static string of text in the footer, I built a JavaScript repeat-logic function. (I was idiotic for hardcoding it multiple times). You can now type a single security phrase in the sidebar, and the system uses .repeat() to automatically generate those repeating anti-copy lines for the footer (30x) and the wet-signature area (15x).
4. I removed the strict gatekeeper in the initiatePrint function. Afixing a QR is optional now.
5. Kept the previous formatting options as it is.
6. Expanded the sidebar to 380px.
7. Used the section-tags to keep the sidebar still clean after adding hell lot more options.

P.S: forgot to add variable feature to the .crest-img ’s 0.15 opacity 🥲

changelog: https://github.com/adibuddies/letterhead.editor/commit/9be2fb6864183cee992234a359adef834e5d6018

1. the sidebar now uses a translucent glass effect (rgba overlays) and a thin gold border.
2. I implemented a micro-text separator (0.5pt) that repeats “IUM-LETTER-AUTHENTIC-DONOTCOPY” (had it hardcoded, didn’t think of limited extension)
3. I built a Print Modal. Now, when you hit print, it asks if the use case is Digital (it affixes a high-res digital signature) or Physical (it hides the signature and adds a specialized physical-sign line)
4. The physical sign line is also a micro-text (.5pt again) “IUM-PHYSICAL-SIGNATURE-AUTHENTIC-DONOTCOPY” (again hardcoded).
5. qrcode.js : You can now generate a dynamic verification QR code that sits in the bottom right. (the only problem is it need QR before printing, so first upload a metadata to a webpage and add that URL to your QR. Problematic for those who don’t need it)
6. Phosphor Icon library for the toolbar

Good that this works!

P.S.: this is still not final since it can’t be used by all yet. There are a lot of elements still hardcoded, thus will replace it with a lot of editable variables in next session. Thankyou

My goal was to build a professional tool for my sister. Choosing HTML was the best way forward I think, for the most part, the use is local and doesn’t need hosting.
So this particular tool was for a letterhead editor. But there is still a lot to work on the css. The looks are not quite aligned and are unsettling.

1. I tried to make the editor responsive, but the A4 sheet kept shrinking so used min-height and fixed-width rather than width=device-width.
2. I’ve imported Playfair Display for the names and EB Garamond for the body and assure you it’s not just another MSWord.
3. Used basic contenteditable attribute for content in A4.
4. I can type directly onto the paper space.
5. I have also added formatting using Italic and Bold. But don’t know how that will mess up and complicate my code when I try to bring order to the editor’s css later.
6. I can also print the letter once written using Ctrl + P and unchecking Header/Footer option. Refinement on it’s way!

There are some issues however:

1. The footer doesn’t have good styling, it touches the footer line (separator).
2. Also the UI is too dark.
3. I’ll also need to format the logo ‘Miracle’ on top better.

1. First thing I did was rework the overall color system. Earlier palette (cream/yellowish) was making the UI look dull. Shifted to a more neutral grey + white base and updated root variables accordingly.
2. Fixed global inconsistencies by adding a proper reset (* margin/padding + font). Earlier spacing was all over the place due to mixed defaults.
3. Reworked the clock logic properly this time. Instead of basic toLocaleTimeString, implemented full IST-based formatting using Intl.DateTimeFormat + formatToParts. Also added milliseconds (setInterval at 1ms). Now it matches what I had in branch.html.
4. Adjusted layout proportions again:
   i. login-side padding updated (60px → 60px 70px)
   ii. flex balance corrected slightly
   iii. background grid spacing also adjusted (28 → 32)
5. Brand-side finally fixed. Earlier I had broken structure (logo-stack sitting outside). Moved everything properly inside brand-side and corrected positioning.
6. Also increased logo size and cleaned up typography (EB Garamond for estd, spacing fixes, footer pushed lower but inside the box).
7. Credential animation tweaked again. Switched back to a small setTimeout delay instead of requestAnimationFrame.
8. Updated input behavior:
   i. text color correction (was using wrong variable earlier)
   ii. label changed to “BIN / PIN” to reflect logic better (because I had created a Branch page, so considered having personnel page separate but with same login).
9. Refined button hover (shadow + letter-spacing transition).
10. Also cleaned up minor things in suggestions logic and redirects.

At this point it matches what I had in mind visually and structurally. Thankfully so it does.
I think I’ll work on going live with it in Firebase next! Thankyou 🙏

1. Worked on improving the overall feel of the login page. It was looking very flat and unfinished earlier.

2. Added a subtle background pattern (grid type).
   [background-image: radial-gradient(circle at 1px 1px, #e6e6e6 1px, transparent 0);]

3. Finally worked on the clock. Shifted it to ist-clock format and made it live update every second. Functional clock on the login page now.

4. Updated the header text styling to “Authentication Required” with better spacing.

5. Tried fixing the branding section alignment. Centering is done but the share of cred-container box is disproportionate.

6. Tried to keep PIN field numeric only but seems like need to read about it a little {inputmode=“numeric” didn’t work}

7. Minor hover refinement on suggestions list.

Thanks. Going to work non-stop today!

1. Started aligning the login page structure towards the final UI I think I want for a product-like look.
2. Shifted the container styling from dashed border to a 1px solid border + tried putting shadow.
3. Renamed login-form to login-side (idk, just trying to separate login fields from logo) to match the structure I’m targeting ahead.
4. Shifted from already listed fields to a basic reveal animation for credential fields after department selection. It works, but there is a jerk after selection. Doesn’t feel premium UX wise.
5. Updated button styling (#1a1a1a + gold hover +1px letter spacing). I think it’s good.
6. Did a small restructure on the branding side using a logo-stack so I can later separate footer positioning cleanly but didn’t go as planned. Seems messed up.
7. Also added maxlength to PIN field to control input length (basic but needed).
8. Hardcoded a few more workplaces into const departments.

But the visuals are disturbing, still feels so rough.

P.S.: Forgot to work on the clock 😭

basically cleaned up the script logic and ensured the department selection flows better into the next state.

1. branch.html: It’s the dashboard for the Branches. Tried to keep it simple. But the problem is it’s static and I can’t hardcode information for 1500 employees over 100+ branches so will need to work on Firebase next!

2. Built a responsive grid for the employee-card layout. Each card shows the name, role, and pay grade (like Level A-1 or Level B-2)

3. Implemented a modal-overlay with a 6-digit PIN input. Now, clicking an employee card triggers a “Verify Identity” prompt.

4. branch.html: Updated the ist-clock to show time down to milliseconds (idk why but I wanted it). And yes, it’s working for the first time! I am yet to update login.html with a working clock.

Mostly debugging the modal’s CSS and making sure the info-side branding stayed put while the directory could be scrolled with ease. Also, setting up the mock data for employees took a lot of time.

P.s.:
Yet to figure out what to do for the next devlog but yeah… the clock gives a high-tech server feel for me.

Removed dead variable (I’d updated the code to earlier to remove the partner logo function but forgot to remove these) in ln232- const partnerArea
A few formatting changes.

That’s all. Visuals remain same— unchanged.

P.S.: Old ss uploaded

My first version of the login page had some bugs leading to a disappointing final visual. The login box was top left aligned instead of being centered.
Following fixes followed:

1. A typo in line 17 –clock-strip writen as –clock-stip.
2. Syntax error: space in ln18: cubic bezier (0.4, 0, 0.2, 1);
3. Wrong used variable doesn’t exists: color: var(–text-main);
4. Centered the login box using:
   justify-content: center;
   align-items: center;
5. Clock position changed to top-right corner of webpage from login-box awkward placing using- position: absolute; top: 20px; right: 20x;
6. Validation error in ln204
7. Removed ln285, if (dept.has logo): I earlier had UPSWC logo for use but now want to keep it solely my branding on the page.

Thankyou 😎

Worked on some basic visuals and HTML tags leaving open-end for easy integration if I wish to take this site live with a domain.
the first page was login page, which will be what anyone visits at the first. I wish to keep it simple as my target user base may not be computer-literate. Thus skipped adding unnecessary buttons or steps and went directly with a login page which could be downloaded onto the desktop as a PWA.

My primary color pallete under :root was primarily influenced by https://www.figma.com/resource-library/color-combinations/ and my other projects like the Stock Exchange game I am working on.

Though the visuals tell it didn’t go as planned. I am going to work on it in the next devlog.

Stay tuned!

P.S. I am back to coding after nearly 3 year, close to 3 hours for this sloppy work may seem a lot. Please don’t mind me 🙏😭