···
@state() private uploadComplete = false;
@state() private uploadedTranscriptionId: string | null = null;
@state() private submitting = false;
33
+
@state() private selectedDate: string = "";
static override styles = css`
···
233
-
flex-direction: column;
···
this.uploadComplete = false;
this.uploadedTranscriptionId = null;
295
+
this.selectedDate = "";
if (this.selectedFile && this.classId) {
298
+
// Set initial date from file
299
+
const fileDate = new Date(this.selectedFile.lastModified);
300
+
this.selectedDate = fileDate.toISOString().split("T")[0] || "";
// Start both detection and upload in parallel
this.detectMeetingTime();
this.startBackgroundUpload();
···
private async detectMeetingTime() {
363
-
if (!this.selectedFile || !this.classId) return;
367
+
if (!this.classId) return;
this.detectingMeetingTime = true;
const formData = new FormData();
369
-
formData.append("audio", this.selectedFile);
formData.append("class_id", this.classId);
372
-
// Send the file's original lastModified timestamp (preserved by browser)
373
-
// This is more accurate than server-side file timestamps
374
-
if (this.selectedFile.lastModified) {
377
-
this.selectedFile.lastModified.toString(),
375
+
// Use selected date or file's lastModified timestamp
376
+
let timestamp: number;
377
+
if (this.selectedDate) {
378
+
// Convert YYYY-MM-DD to timestamp (noon local time to avoid timezone issues)
379
+
const date = new Date(`${this.selectedDate}T12:00:00`);
380
+
timestamp = date.getTime();
381
+
} else if (this.selectedFile?.lastModified) {
382
+
timestamp = this.selectedFile.lastModified;
387
+
formData.append("file_timestamp", timestamp.toString());
const response = await fetch("/api/transcriptions/detect-meeting-time", {
···
private handleMeetingTimeSelect(meetingTimeId: string) {
this.selectedMeetingTimeId = meetingTimeId;
416
+
private handleDateChange(e: Event) {
417
+
const input = e.target as HTMLInputElement;
418
+
this.selectedDate = input.value;
419
+
// Re-detect meeting time when date changes
420
+
if (this.selectedDate && this.classId) {
421
+
this.detectMeetingTime();
private handleSectionChange(e: Event) {
···
this.uploadedTranscriptionId = null;
478
+
this.selectedDate = "";
this.dispatchEvent(new CustomEvent("close"));
···
527
+
<label for="date">Recording Date</label>
531
+
.value=${this.selectedDate}
532
+
@change=${this.handleDateChange}
533
+
?disabled=${this.uploading}
534
+
style="padding: 0.75rem; border: 1px solid var(--secondary); border-radius: 4px; font-size: 0.875rem; color: var(--text); background: var(--background);"
536
+
<div class="help-text">
537
+
Change the date to detect the correct meeting time
541
+
<div class="form-group">
<label>Meeting Time</label>
this.detectingMeetingTime
···
543
-
this.sections.length > 1 && this.selectedFile
576
+
this.sections.length > 0 && this.selectedFile
546
-
<label for="section">Section (optional)</label>
579
+
<label for="section">Section</label>
@change=${this.handleSectionChange}
?disabled=${this.uploading}
584
+
.value=${this.selectedSectionId || this.userSection || ""}
<option value="">Use my section ${this.userSection ? `(${this.sections.find((s) => s.id === this.userSection)?.section_number})` : ""}</option>
553
-
${this.sections.map(
588
+
.filter((section) => section.id !== this.userSection)
<option value=${section.id}>${section.section_number}</option>
560
-
Override which section this recording is for
596
+
Select which section this recording is for (defaults to your section)
···
<button class="btn-cancel" @click=${this.handleClose} ?disabled=${this.uploading || this.submitting}>
600
-
${this.uploadComplete && this.selectedMeetingTimeId ? html`
637
+
this.uploadComplete && this.selectedMeetingTimeId
<button class="btn-upload" @click=${this.handleSubmit} ?disabled=${this.submitting}>
${this.submitting ? "Submitting..." : "Confirm & Submit"}