Novara - Learning Website
- 20 Devlogs
- 52 Total hours
Education one lesson at a time :D BUILT BY HUMANS: https://github.com/Cassetu/Novara (check the commits)
Education one lesson at a time :D BUILT BY HUMANS: https://github.com/Cassetu/Novara (check the commits)
*Continuing the data refactoring, I fixed some of the references in openSyllabus. I also completly removed the faulty references to isBundle(), i accidentaly messed up the case of loadIndex to LoadIndex but luckily a simple glance at the console pinpointed it for me :D (Thank god for descriptive error messages)
Thanks for your support! :D
Currently the site is unusable since the course.js isn’t fully complete to understand the new data structure. :P
began working on a curriculum tool so educators can easily build em without having to work through the complicated json structure. its a bit hard since i want to export a zip, and im not entirely sure how that would work, and also i need to double check how my course.js processes the json so i can get exactly all the information to put into it.
ai detector thing. examines github repositories and find all comments and flags exessive amounts, or exessive explanations in them (classic ai fingerprints) as well as flagging verbose function names and shows the time it would take to make the project at 70 wpm and detects inconsistencies in commit times (eg 1000 new code typed after 2 minutes of another commit that would be flagged) then gives a % of confidence. 0-30% is prob human, 30-50% is mixed unsure, 50-100% is definetly full ai. Before you accuse someone, make sure to do througouh like questioning and interviews and such because this tool is imperfect. This way i can easily identify projects that have disgenuine work and report them to stardance to take care of. (https://cassetu.github.io/Novara/html/aisubTool.html) I got gemini to help reformat the code since it was a bit of a mess, dw i had a full disclaimer. (ai vibe coders take notes.) It was a big challenge getting the github token to work, but it functions now and doesn’t steal your information!! :D
also i ran my own project through it once, it was clear, and then i ran it again after commiting it, and now it thinks my project is ai, because the code scans for these specific traces, that are present in the code itself, meaning that if it scans itself, it will find everything its looking for. T - T (false positive in the first image)
leave a comment to help! thx!
EVEN MORE PSYCHOLOGY
Covered more things for my next course: “Attachment, Love & Social Dynamics”
Read the notes!:
https://github.com/Cassetu/Novara/blob/master/journal/relationship/notesTheScienceOfRelationships.md#attachment-love--social-dynamics
Timelapse:
https://lapse.hackclub.com/timelapse/PppFJPZGUgEp
https://lapse.hackclub.com/timelapse/YqlfYCCx08j7
Covered more things for my next course: “Stage Models & Communication”
Read the notes!:
https://github.com/Cassetu/Novara/blob/master/journal/relationship/notesTheScienceOfRelationships.md#stage-models--communication
Timelapse:
https://lapse.hackclub.com/timelapse/1LwshB7x8AEr
https://lapse.hackclub.com/timelapse/ir_E9ROtKHUr
I can actually use nice formatting without getting ai accusations cuz i got timelapses lol
I researched on the Halo Effect, Mere Exposure Effect, Propinquity Effect, and Social Exchange Theory. These are for the first course in the curriculum: Human Attraction & Opportunity.
Read the notes: https://github.com/Cassetu/Novara/blob/master/journal/relationship/notesTheScienceOfRelationships.md
And Timelapse:
https://lapse.hackclub.com/timelapse/cPdZpEF6u5YJ
Moved the return button, description link, and progress bar into the syllabus sidebar instead of a separate meta block up top. Added a course description modal you can open from the sidebar. Reworked the syllabus layout to fill the viewport height properly, cleaned up border and shadow inconsistencies, and shrunk the details modal width.
Big CSS pass across course.css, landing.css, and style.css. Reworked the syllabus sidebar to include a course title, progress bar, and a dedicated test button styled with the accent color.
Removed the old Godot scene renderer, its CSS, and the leftover import in course.js. Not used anymore. (It was made with ai help)
Added a line to the landing page footer noting no generative AI was used in building the site. (just need to remove the last ai curriculum.)
Cleaned up mainpage CSS spacing and rewrote the landing copy. Turned the trust badge area into a short blurb on why Novara exists, moved the Hackatime badge inline with the time spent text, and added a dedicated trust button linking to the privacy page.
Thanks for reading this! Have a good day yall!
Rebuilt the public course catalog page and gave the about page its own CSS file instead of riding on landing styles, plus a new brand lockup (logo + NOVARA wordmark) in the nav headers across pages. Added a goals section to the about page. Added a “don’t trust us, go check yourself” section and a profit disclaimer to the privacy policy. Swapped “we” language for “I” across the README and privacy policy since it’s a solo project and someone got confused. Small homepage copy tweak too, swapped the trust blurb for a direction to the privacy policy and added a “Time Spent” label above the hackatime badge.
Kept moving inline styles into real CSS classes across course.js (loading states, lesson complete screens, onboarding highlight, dialogue boxes, 404 page). Pulled the privacy policy’s inline style block out into its own privacy.css file. Rebuilt the homepage hero into a two column layout with trust info on one side and quick action buttons on the other, replacing the old split image hero. Changed the footer message, revised the README copy, swapped a few README screenshots, and bumped the hackatime badge color. Now that the inline is gone, it will be easier to adjust the ui.
Kept clearing inline CSS out of course.js, this round hitting the explorer cards, syllabus sidebar, section buttons, and the course details modal. Added a null check so progress calculation doesn’t break when a course file is missing. Fixed a syntax typo (stray brace) in the syllabus section click handler. Removed the old Godot core AI generated course from the catalog. Added a small watermark comment to files generated by the theme tool, and created a dialog-btn-container class to clean up some remaining inline button styling.
I also figured out how to sign my commits using a SHA encryption service so every commit will say “Verified”
I’ve been testing out some different ui’s, since yall keep saying mine is AI, which I’ll have you know, is not, its called modern. (i have screenshot of testing out an like windows 98 kinda retro ish ui idk what its called.)
I do want to know this though, What does a NOT AI ui look like?
If my project looks like AI, people will not be keen to trusting my courses, much less learning about them.
If you have any ideas, PLEASE WRITE A COMMENT!! :D
(Also on progress with Novara:
v1.04.29, fix for course.js
v1.04.30, adjust length for the standard practice since if you only do one lesson, and then try to do the practice, you’ll answer 30 questions about that one lesson, mostly repeating the same questions.
v1.04.31, new mastery icon cuz i forgot to do it earlier
v1.04.32, better cover progress with padlock
v1.04.33, remove bonus questions, since they kinda fit weirdly and dont really help even if the science is behind it
v1.04.33, give Mayor Bob more character cuz he sounds like a robot.
v1.04.34, move style.css into css/style.css
v1.04.35, new layout for lessons and sections view.)
Merged the practice hub into one combined view across all enrolled curriculums instead of a separate card per course, so standard and survival practice now pull questions from everything you’re enrolled in at once. Added a countdown banner showing when paced mode lessons renew, and cleaned up the settings label wording twice. (cuz i didn’t like how it sounded)
Paced mode is now fully wired in. Lessons lock until you reach the current day’s target, missing a day triggers a review quiz scaled to how long you were gone, and every 7 completed lessons triggers a module exam gate (80% to pass, locks further progress until you clear it). Also fixed the dialogue box to support multiline text properly and fixed the onboarding highlight so it targets dropdown menus correctly instead of the wrong element. (check image to see how it failed lol)
Added the paced mode toggle itself (1 lesson a day). Onboarding got swapped from static tooltip cards over to the new dialogue box system, then the dialogue box was made to type itself out letter by letter instead of dumping all the text at once. Along the way: fixed onboarding skipping missing elements, handled rapid clicking through steps, fixed a broken const reference, and fixed reset behavior when onboarding reopens.
Deleted a pile of AI-generated lesson bundles that were just cluttering the catalog (architecture, conlang-mythology, html-mastery), keeping only a couple test lessons around. Added question pooling so a lesson can define a questionCount and pull a random shuffled slice instead of showing every question every time.
Rebuilt the about page into proper sectioned content instead of one big hero block, swapped in a new header image, fixed a dumb black border bug on the landing page from a leftover CSS class, and moved the difficulty badge over next to the details button.
If you read all this, consider reposting so I can get more attention, thanks!! :D
New course card layout with a proper title/kicker header block and reworked filter buttons, ditching the old boxed style for underline tabs cuz its more dense. Added an orange accent color filled progress bar for anything not enrolled yet. Added a dev time badge to the hero using Hackatime in the main thing. Ripped out the entire theme system, one look only now cuz its better.
Full hero section overhaul. New copy, new photo instead of the old doorway SVG, new grid layout instead of flexbox, added a soft noise texture to the landing background. (tryina copy like concrete) Fixed a wrong journal link pointing at the wrong repo path.
Pulled a markdown course entry out of the catalog for good, both the JSON data and the catalog listing. (its not good) Small dropdown structure fix in the topbar CSS.
Added a course details overlay with author, published/updated dates, and sources. Fixed a typo where the close button ID didn’t match, so the overlay wouldn’t close. (SLOPPY CODDEE FREE MEE FROM ITT AAAAAA)
Added URL routing for logged out users. Course catalog and sign in views now update the URL with pushState and respond correctly on refresh, instead of only working for logged in users. Same stuf.
Reorganized assets into an img subfolder and added minibit sprites. Built a reusable dialogue box component with a typewriter-style next button flow, wired it into the landing page as a mayor NPC introduction, then cleaned up its sizing and added a completion message. Updated INFO.txt to match the actual lesson type naming convention and added entries for architectureSim and cookingSim.
Looking for coding profesionalls to help build a curriculum, email me or create an issue on my github!
Notice, the sim is very sloppy and is most definetly gonna be subject to more additions later.
Reworked drawDimension so tick marks always offset perpendicular to the wall, instead of one shared calc for both axes. Room labels now use two separate font scales instead of one. (definetly subject to change) Started tracking a global bounding box so each room draws its own outer footprint dimensions, not just per wall.
Added a Rectangle tool (R key) next to the draw tool, so you can drag out four walls at once. Split drawMeasuredLine into drawWall (just the line) and drawDimension (offset line, ticks, label). Added a live HUD showing length and angle in draw mode, or width and height in rect mode, while dragging.
Built a real toolbar with pen and eraser buttons with my new assets. Eraser uses point to line distance to find and remove walls. Added a confirm modal before doing the full clearing canvas, and replaced the old gradient fade label background with a plain rect.
Rewrote room detection as extractRooms using a proper planar graph traversal: build an adjacency list, sort each node’s neighbors by angle, then walk faces with the right hand rule to pull out every enclosed room as its own polygon. This finally supports multiple separate rooms on one canvas. Also fixed a null vs empty array bug, scaled room labels by area, reorganized brand assets, and added eraser, house, and trash icons. (from: https://game-icons.net)
First pass at room detection using an adjacency graph, assuming a single closed loop. Fixed several bugs in the adjacency keys and neighbor tracking, added shoelace formula area calculation, and split wall segments at T-intersections so room boundaries follow them correctly. (everything boils down to math and calculations)
Pulled measurement drawing into its own function so every wall, not just the active drag, shows its length. (very crucial) Bumped the grid scale for easier snapping and more detail when i later add features such as chairs and tables that you can drag in. Added a gradient fade behind dimension labels, then small tick marks at each wall end. (visual aids)
Wired the sim into the real course system. added a lesson entry so i can properly test it now, imported the renderer into course.js, and fixed leftover syntax typos. (my work has been a bit sloppy recently) Built the actual studio layout with a brief panel and drafting canvas, then added the mouse listeners for drawing walls, with Shift locking to cardinal directions for more percise drawing.
Scaffolded the drafting canvas: pixels to feet scale, snap to grid, and the first working render loop with simple grid and stuf. Fixed a small topbar CSS bug where button heights jumped on hover.
If you read all this, thanks :D
Refactored how navigation flows when a user enters an active lesson block. Previously, I had the topbar fade down to opacity: 0.5 via a body class state, and a separate, clunky #lesson-back-btn floating fixed at the top-left of the viewport. It wasn’t great, and I thought i could do way better.
So instead i cleaned it up, removed the fade, and pretty much “hijacked” the main elements. The standard topbar elements were set to display:none; with the user profile button getting set to half opacity and non-clickable. changed existing #nav-explorer slot by transforming its text to ← Return and changing its weight.
also changed the if (!confirm()) basic alert for my better error alert box. duplicated the old alert box and made another for this one, fit with a cancel button and all.
The main obstacle was handling the application’s default click-routing initialization handlers. Simply changing the .onclick property didn’t work because hidden layout listeners attached via .addEventListener() were catching the event bubbles and dumping the user back to the main curriculum selector immediately anyway. (because remember were hijacking the explore btn)
Fixed it by utilizing Event Capturing:
topNavBtn.addEventListener("click", window.activeTopbarGate, true);
by passing true, the browser catches the user’s click at the absolute top of the DOM tree before the default routers can see it. Inside the wrapper, i ran e.stopPropagation() to stalls the execution chain while the custom gate logic processes.
standard browser alerts freeze javascript synchronously, but custom DOM boxes are asynchronous so a normal return gate wouldn’t cut it. i solved it by wrapping all my navigation cleanup loops inside a functional callback and passing it straight into the dialog box. hit OK, the callback fires and drops you out of the lesson; hit cancel, it just clears the overlay div out of the DOM tree so you can keep working.
also wut u guys feel about the better formatting lemme know, i don’t want it to sound like i just copy pasted chatgpt but i want to explain it better so im a bit conflicted
Refactored URL routing logic so it sits in one function routeFromURL making it easier to reuse. Before I just had the code duplicated in two places as a quick implementation, and also the back/forward buttons didn’t do anything because there wasn’t a popstate listener yet. Now i have window.addEventListener("popstate", routeFromURL) to fix that issue.
Added a Privacy Policy page matching the Journal Layout, now users can trust Novara (little more than before at least) to keep their information safe when they sign in.
Started a test cooking curriculum, using the cookingSim and HeatControl additions.
Also added an Abstract0, Abstract1, Abstract2 assets to be used later. Abstract2 already implemented into an 404 page and the practice panel when the user isn’t enrolled in any curriculums. fetchCourseData now wraps its fetch in a try/catch and calls show404() on failure.
I added a new lesson type, “cookingSim”, it currently only has one simulation “heatControl”. Its a simple minigame for monitoring heat. Later I will have several cooking simulations, and use them in a cooking curriculum.
The reason for creating special simulations, is because cooking is a visual and hands on thing, you can’t learn to cook by simply reading and answering questions about it.
I’m also working on wiring together a way for the url to reflect the current view, that way you can bookmark specific courses or share specific curriculums.
The main focus of it is: history.pushState() and window.addEventListener("popstate").
Another important part is this:
const params = new URLSearchParams(window.location.search);
const view = params.get(“view”);
const id = params.get(“id”);
so on page load, you can get the right viewport, eg: ?view=syllabus&id=js-course, would show "syllabus" and "js-course".
Since its on page load the code is primarly residing in window.firebaseAuth.onAuthStateChanged since that part automatically signs in the user and skips over the authentication and homepage process if the user has signed in before.
Added a custom theme tool, automatically generates the code so users can easily build a unique & polished ui.
Easy access in topbar for signed in users and non-signed in users.
Test it out here: https://cassetu.github.io/Novara/html/themeTool.html
(STOP CONSOLTING AI FOR THEMES:
fixed some bugs as the focus for today (v1.03.37)
error overlays were stacking in the DOM, so i made a showError() function instead of copy pasting the same code everywhere
also fixed activeCourseRef being stale after practice sessions, was sending users to the wrong place
Onboarding, 4 cards, teaches user to enroll in curriculums, and navigate the topbar
Added README.md
(And related images)
Novara is actually a project of mine that I’ve been working on for a while. (Since May 6th)
I just got back into it and added an inline alert box, since the native alert box is shown to be less intuitive and more hostile to users.
Most Devlogs here will be some form of iteration of my onsite Journal, but more in depth, and more focused.