Add automatic schedule generator

README.md

@@ -220,10 +220,10 @@ on Ohio State alone.
 Only the newest search is allowed to draw, so a slow first search can never
 paint over a fast second one.
 
-That diagram is only the part a search waits on. Opening the page is 30 requests
+That diagram is only the part a search waits on. Opening the page is 32 requests
 across two hosts, counted in Chrome against a local copy with the cache
-cleared: 29 files from this repo and the term list from `content.osu.edu`. The
-29 are the HTML, two stylesheets, three font files, nineteen modules, the
+cleared: 31 files from this repo and the term list from `content.osu.edu`. The
+31 are the HTML, two stylesheets, three font files, 21 modules, the
 ratings snapshot, two seat files and the favicon. The live page adds one more,
 the page-view ping to the analytics worker, which local runs skip.
 
@@ -283,6 +283,8 @@ js/
   render.js           list view, grouped by instructor
   calendar.js         week grid
   schedule.js         saved sections, sharing and conflict detection
+  generator.js        linked packages, conflict search and schedule scoring
+  generator-render.js automatic builder controls and ranked choices
   detail.js           right pane
   filters.js          client-side filtering
   sort.js             ordering by rating, difficulty, seats or start time

css/finder.css

@@ -1037,6 +1037,175 @@ body {
   .plan-open span:nth-child(n + 3) { grid-column: 1 / -1; }
 }
 
+/* Automatic schedule generator ------------------------------------------ */
+
+.generator { max-width: 58rem; }
+
+.gen-head,
+.gen-result-head {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 1rem;
+}
+
+.gen-title,
+.gen-result-title,
+.gen-subtitle {
+  margin: 0;
+  font-family: var(--display);
+  letter-spacing: -0.02em;
+}
+
+.gen-title { font-size: 1.45rem; }
+.gen-result-title { font-size: 1.15rem; }
+.gen-subtitle { font-size: 1rem; margin-bottom: 0.7rem; }
+.gen-intro { max-width: 46rem; margin: 0.6rem 0 1.25rem; color: var(--mute); line-height: 1.5; }
+
+.gen-add {
+  display: grid;
+  grid-template-columns: minmax(10rem, 20rem) auto;
+  align-items: end;
+  gap: 0.45rem;
+  margin-bottom: 0.65rem;
+}
+
+.gen-add .f-label { grid-column: 1 / -1; margin: 0; }
+
+.gen-add-button,
+.gen-generate,
+.gen-use {
+  min-height: 2.35rem;
+  padding: 0.45rem 0.8rem;
+  border: 1px solid var(--scarlet);
+  border-radius: var(--radius);
+  background: var(--scarlet);
+  color: var(--paper);
+  font: inherit;
+  font-size: 0.82rem;
+  font-weight: 600;
+  cursor: pointer;
+}
+
+.gen-generate:disabled { opacity: 0.5; cursor: default; }
+
+.gen-courses {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.4rem;
+  min-height: 2rem;
+  margin: 0 0 1.2rem;
+  padding: 0;
+  list-style: none;
+}
+
+.gen-course-chip {
+  padding: 0.35rem 0.55rem;
+  border: 1px solid var(--field);
+  border-radius: 999px;
+  background: var(--paper);
+  color: var(--ink);
+  font-family: var(--data);
+  font-size: 0.75rem;
+  cursor: pointer;
+}
+
+.gen-course-chip:hover { border-color: var(--scarlet); color: var(--scarlet); }
+
+.gen-preferences {
+  margin-bottom: 1.2rem;
+  padding: 1rem;
+  border: 1px solid var(--rule);
+  border-radius: var(--radius);
+  background: var(--paper);
+}
+
+.gen-bounds {
+  display: grid;
+  grid-template-columns: minmax(9rem, 12rem) minmax(9rem, 12rem) minmax(14rem, 1fr);
+  align-items: end;
+  gap: 0.7rem;
+}
+
+.gen-bounds .f-label { margin: 0; }
+.gen-bounds .f-ctl { display: block; margin-top: 0.3rem; }
+
+.gen-check {
+  display: flex;
+  align-items: center;
+  gap: 0.45rem;
+  min-height: 2.35rem;
+  font-size: 0.8rem;
+}
+
+.gen-weights {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(12rem, 1fr));
+  gap: 0.5rem 1rem;
+  margin: 1rem 0;
+}
+
+.gen-weight {
+  display: grid;
+  grid-template-columns: minmax(8rem, 1fr) minmax(6rem, 1fr);
+  align-items: center;
+  gap: 0.6rem;
+  color: var(--mute);
+  font-size: 0.78rem;
+}
+
+.gen-weight input { width: 100%; accent-color: var(--scarlet); }
+.gen-note { margin: 0 0 1rem; color: var(--mute); font-size: 0.85rem; }
+.gen-note.is-error { color: var(--scarlet); }
+.gen-results { margin-top: 1.4rem; }
+
+.gen-result {
+  margin-bottom: 1rem;
+  padding: 1rem;
+  border: 1px solid var(--rule);
+  border-radius: var(--radius);
+  background: var(--paper);
+}
+
+.gen-result:first-of-type { border-color: var(--open); }
+.gen-use { background: transparent; color: var(--scarlet); }
+.gen-use:hover { background: var(--scarlet); color: var(--paper); }
+
+.gen-metrics {
+  display: grid;
+  grid-template-columns: repeat(6, minmax(5.5rem, 1fr));
+  gap: 0.6rem;
+  margin: 0.9rem 0;
+}
+
+.gen-metric { min-width: 0; }
+.gen-metric strong { display: block; font-family: var(--data); font-size: 0.9rem; overflow-wrap: anywhere; }
+.gen-metric span { display: block; color: var(--mute); font-size: 0.68rem; }
+
+.gen-sections { margin: 0; padding: 0; border-top: 1px solid var(--rule); list-style: none; }
+.gen-sections li { display: grid; grid-template-columns: 8rem 1fr 1fr; gap: 0.7rem; padding: 0.55rem 0; border-bottom: 1px solid var(--rule); }
+.gen-sections span { color: var(--mute); font-size: 0.78rem; }
+
+@media (max-width: 46rem) {
+  .gen-head { display: block; }
+  .gen-head .plan-action { margin-top: 0.7rem; }
+  .gen-bounds { grid-template-columns: 1fr 1fr; }
+  .gen-check { grid-column: 1 / -1; }
+  .gen-weights { grid-template-columns: 1fr; }
+  .gen-metrics { grid-template-columns: repeat(3, 1fr); }
+  .gen-sections li { grid-template-columns: 1fr; gap: 0.15rem; }
+}
+
+@media (max-width: 28rem) {
+  .gen-add { grid-template-columns: 1fr; }
+  .gen-add-button { grid-column: 1; }
+  .gen-bounds { grid-template-columns: 1fr; }
+  .gen-check { grid-column: 1; }
+  .gen-result-head { display: block; }
+  .gen-use { margin-top: 0.7rem; }
+  .gen-metrics { grid-template-columns: repeat(2, 1fr); }
+}
+
 .cal-scroll { overflow-x: auto; }
 .cal-scroll:focus-visible { outline: 2px solid var(--scarlet); outline-offset: 2px; }