Hugging Face's logo

Spaces:
tokyotechlab
/
fe
Running

App Files Community
Lucii1 commited on
Commit
2e5f746
·
1 Parent(s): 56669f3

update question

Browse files
Files changed (2) hide show
  1. feedback.js +25 -5
  2. index.html +72 -377
feedback.js CHANGED
@@ -9,7 +9,7 @@ const blockNotification = document.getElementById(
9
  );
10
  const blockQuestion = document.getElementById('block-question-1765336324468');
11
  const footerFeedback = document.getElementById('footer-feedback-1765336324468');
12
- const REQUIRED_QUESTION_IDS = ['q0', 'q1'];
13
  const isSuccess = {};
14
  const isLoading = {};
15
  const isFailed = {};
@@ -206,15 +206,35 @@ async function handleFeedbackSubmit(event) {
206
 
207
  if (!areRequiredQuestionsAnswered()) {
208
  syncFeedbackButtonState();
 
 
209
  return;
210
  }
211
  isLoading.value = true;
212
  // Simulate async feedback submission
213
  const feedbackData = collectFeedbackData();
214
- const _output = `${output.readme_content.case_summary.title}${output.readme_content.case_summary.content}${output.readme_content.content_classification.title}${output.readme_content.content_classification.content}${output.readme_content.verified_evidence.title}
215
- ${output.readme_content.verified_evidence.source_details.title}${output.readme_content.verified_evidence.source_details.content}${output.readme_content.verified_evidence.where.title}${output.readme_content.verified_evidence.where.content}${output.readme_content.verified_evidence.when.title}${output.readme_content.verified_evidence.when.content}${output.readme_content.verified_evidence.who.title}${output.readme_content.verified_evidence.who.content}${output.readme_content.verified_evidence.why.title}${output.readme_content.verified_evidence.why.content}${output.readme_content.forensic_analysis.title}${output.readme_content.forensic_analysis.content}${output.readme_content.other_evidence.title}${output.readme_content.other_evidence.content}
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
216
  `;
217
- feedbackData['q17'] = _output.trim().length > 0 ? _output.trim() : '-';
218
 
219
  axios
220
  .post('/v1/survey', feedbackData, {
@@ -240,7 +260,7 @@ initializeStarRatings();
240
  syncFeedbackButtonState();
241
 
242
  const requiredRadios = document.querySelectorAll(
243
- '#q0 input[type="radio"], #q1 input[type="radio"]'
244
  );
245
  requiredRadios.forEach((radio) => {
246
  radio.addEventListener('change', () => {
 
9
  );
10
  const blockQuestion = document.getElementById('block-question-1765336324468');
11
  const footerFeedback = document.getElementById('footer-feedback-1765336324468');
12
+ const REQUIRED_QUESTION_IDS = ['q1', 'q2'];
13
  const isSuccess = {};
14
  const isLoading = {};
15
  const isFailed = {};
 
206
 
207
  if (!areRequiredQuestionsAnswered()) {
208
  syncFeedbackButtonState();
209
+ console.log('t');
210
+
211
  return;
212
  }
213
  isLoading.value = true;
214
  // Simulate async feedback submission
215
  const feedbackData = collectFeedbackData();
216
+ const _output = `${output?.readme_content?.case_summary?.title || ''}${
217
+ output?.readme_content?.case_summary?.content || ''
218
+ }${output?.readme_content?.content_classification?.title || ''}${
219
+ output?.readme_content?.content_classification?.content || ''
220
+ }${output?.readme_content?.verified_evidence?.title || ''}
221
+ ${output?.readme_content?.verified_evidence?.source_details?.title || ''}${
222
+ output?.readme_content?.verified_evidence?.source_details?.content || ''
223
+ }${output?.readme_content?.verified_evidence?.where?.title || ''}${
224
+ output?.readme_content?.verified_evidence?.where?.content || ''
225
+ }${output?.readme_content?.verified_evidence?.when?.title || ''}${
226
+ output?.readme_content?.verified_evidence?.when?.content || ''
227
+ }${output?.readme_content?.verified_evidence?.who?.title || ''}${
228
+ output?.readme_content?.verified_evidence?.who?.content || ''
229
+ }${output?.readme_content?.verified_evidence?.why?.title || ''}${
230
+ output?.readme_content?.verified_evidence?.why?.content || ''
231
+ }${output?.readme_content?.forensic_analysis?.title || ''}${
232
+ output?.readme_content?.forensic_analysis?.content || ''
233
+ }${output?.readme_content?.other_evidence?.title || ''}${
234
+ output?.readme_content?.other_evidence?.content || ''
235
+ }
236
  `;
237
+ feedbackData['q11'] = _output.trim().length > 0 ? _output.trim() : '-';
238
 
239
  axios
240
  .post('/v1/survey', feedbackData, {
 
260
  syncFeedbackButtonState();
261
 
262
  const requiredRadios = document.querySelectorAll(
263
+ '#q1 input[type="radio"], #q2 input[type="radio"]'
264
  );
265
  requiredRadios.forEach((radio) => {
266
  radio.addEventListener('change', () => {
index.html CHANGED
@@ -222,108 +222,99 @@
222
  <!-- 2.1 -->
223
  <div class="flex flex-col gap-2">
224
  <div>
225
- <h3 class="section-title">1. The "Accuracy Check"</h3>
226
  </div>
227
  <div class="flex flex-col gap-3 pl-4">
228
  <div class="question" id="q0">
229
- <div class="q-title">
230
- 1.1 How accurate was the conclusion?<span class="required"
231
- >*</span
232
- >
233
- </div>
234
  <div class="options">
235
  <div class="option">
236
  <label class="opt">
237
  <input type="radio" name="q0" />
238
  <div class="radio"></div>
239
- <div class="option-text">Completely wrong</div>
240
- </label>
241
- </div>
242
- <div class="option">
243
- <label class="opt">
244
- <input type="radio" name="q0" />
245
- <div class="radio"></div>
246
- <div class="option-text">Missed key context</div>
247
  </label>
248
  </div>
249
  <div class="option">
250
  <label class="opt">
251
  <input type="radio" name="q0" />
252
  <div class="radio"></div>
253
- <div class="option-text">Mixed results</div>
254
  </label>
255
  </div>
256
  <div class="option">
257
  <label class="opt">
258
  <input type="radio" name="q0" />
259
  <div class="radio"></div>
260
- <div class="option-text">Mostly correct</div>
261
  </label>
262
  </div>
263
  <div class="option">
264
  <label class="opt">
265
  <input type="radio" name="q0" />
266
  <div class="radio"></div>
267
- <div class="option-text">Spot on</div>
268
  </label>
269
  </div>
270
  </div>
271
  </div>
272
  <div class="question" id="q1">
273
  <div class="q-title">
274
- 1.2 Did the algorithm correctly classify this
275
- content?<span class="required">*</span>
 
276
  </div>
277
  <div class="options">
278
  <div class="option">
279
  <label class="opt">
280
  <input type="radio" name="q1" />
281
  <div class="radio"></div>
282
- <div class="option-text">Yes</div>
283
  </label>
284
  </div>
285
  <div class="option">
286
  <label class="opt">
287
  <input type="radio" name="q1" />
288
  <div class="radio"></div>
289
- <div class="option-text">
290
- No - It was actually Real
291
- </div>
292
  </label>
293
  </div>
294
  <div class="option">
295
  <label class="opt">
296
  <input type="radio" name="q1" />
297
  <div class="radio"></div>
298
- <div class="option-text">
299
- No - It was actually AI-Generated
300
- </div>
 
 
 
 
 
 
 
 
 
 
 
 
301
  </label>
302
  </div>
303
  </div>
304
  </div>
305
- </div>
306
- </div>
307
- <!-- 2.2 -->
308
- <div class="flex flex-col gap-2">
309
- <div>
310
- <h3 class="section-title">
311
- 2. Tab-Specific Feedback (Granular)
312
- </h3>
313
- </div>
314
- <div class="flex flex-col gap-3 pl-4">
315
  <div class="question" id="q2">
316
  <div class="q-title">
317
- 2.1 Were the provided links relevant?
 
318
  </div>
319
  <div class="options links-list">
320
  <div class="option">
321
  <label class="opt">
322
  <input type="radio" name="q2" />
323
  <div class="radio"></div>
324
- <div class="option-text">
325
- All links worked and were relevant
326
- </div>
327
  </label>
328
  </div>
329
  <div class="option">
@@ -331,7 +322,7 @@
331
  <input type="radio" name="q2" />
332
  <div class="radio"></div>
333
  <div class="option-text">
334
- Some links were broken/dead
335
  </div>
336
  </label>
337
  </div>
@@ -340,7 +331,7 @@
340
  <input class="radio" type="radio" name="q2" />
341
  <div class="radio"></div>
342
  <div class="option-text">
343
- Links were unrelated to the topic
344
  </div>
345
  </label>
346
  </div>
@@ -348,14 +339,16 @@
348
  </div>
349
  <div class="question" id="q3">
350
  <div class="q-title">
351
- 2.2 Was the technical analysis understandable?
352
  </div>
353
  <div class="options links-list">
354
  <div class="option">
355
  <label class="opt">
356
  <input type="radio" name="q3" />
357
  <div class="radio"></div>
358
- <div class="option-text">Yes, clear</div></label
 
 
359
  >
360
  </div>
361
  <div class="option">
@@ -363,7 +356,7 @@
363
  <input type="radio" name="q3" />
364
  <div class="radio"></div>
365
  <div class="option-text">
366
- Too technical / Hard to understand
367
  </div>
368
  </label>
369
  </div>
@@ -371,25 +364,16 @@
371
  <label class="opt">
372
  <input class="radio" type="radio" name="q3" />
373
  <div class="radio"></div>
374
- <div class="option-text">Not enough detail</div>
 
 
375
  </label>
376
  </div>
377
  </div>
378
  </div>
379
- </div>
380
- </div>
381
-
382
- <!-- 2.3 -->
383
- <div class="flex flex-col gap-2">
384
- <div>
385
- <h3 class="section-title">
386
- 3. The "Hallucination" Check (Critical for AI)
387
- </h3>
388
- </div>
389
- <div class="flex flex-col gap-3 pl-4">
390
  <div class="question" id="q4">
391
  <div class="q-title">
392
- 3.1 Did the report contain any hallucinations (made-up
393
  facts)?
394
  </div>
395
  <div class="options links-list">
@@ -427,17 +411,14 @@
427
  </div>
428
  </div>
429
  </div>
430
- <!-- 2.4 -->
431
  <div class="flex flex-col gap-2">
432
  <div>
433
- <h3 class="section-title">
434
- 4. Who (Source and Subject Credibility)
435
- </h3>
436
  </div>
437
  <div class="flex flex-col gap-3 pl-4">
438
  <div class="question" id="q5">
439
  <div class="q-title">
440
- 4.1 Did the app clearly identify the main people,
441
  organizations, or sources involved in the news item?
442
  </div>
443
  <div class="options">
@@ -480,446 +461,160 @@
480
  </div>
481
  <div class="question" id="q6">
482
  <div class="q-title">
483
- 4.2 How accurate did the app's assessment of the
484
- credibility of the "Who" (e.g., source, expert, witness)
485
- seem to you?
486
  </div>
487
  <div class="options">
488
  <div class="option">
489
  <label class="opt">
490
  <input type="radio" name="q6" />
491
  <div class="radio"></div>
492
- <div class="option-text">Highly Inaccurate</div>
493
- </label>
494
- </div>
495
- <div class="option">
496
- <label class="opt">
497
- <input type="radio" name="q6" />
498
- <div class="radio"></div>
499
- <div class="option-text">Inaccurate</div>
500
- </label>
501
- </div>
502
- <div class="option">
503
- <label class="opt">
504
- <input type="radio" name="q6" />
505
- <div class="radio"></div>
506
- <div class="option-text">Moderately Accurate</div>
507
- </label>
508
- </div>
509
- <div class="option">
510
- <label class="opt">
511
- <input type="radio" name="q6" />
512
- <div class="radio"></div>
513
- <div class="option-text">Accurate</div>
514
  </label>
515
  </div>
516
  <div class="option">
517
  <label class="opt">
518
  <input type="radio" name="q6" />
519
  <div class="radio"></div>
520
- <div class="option-text">Highly Accurate</div>
521
- </label>
522
- </div>
523
- </div>
524
- </div>
525
- </div>
526
- </div>
527
-
528
- <!-- 2.5 -->
529
- <div class="flex flex-col gap-2">
530
- <div>
531
- <h3 class="section-title">5. What (The Core Claim/Action)</h3>
532
- </div>
533
- <div class="flex flex-col gap-3 pl-4">
534
- <div class="question" id="q7">
535
- <div class="q-title">
536
- 5.1 Did the app correctly identify the central claim or
537
- action of the news story?
538
- </div>
539
- <div class="options links-list">
540
- <div class="option">
541
- <label class="opt">
542
- <input type="radio" name="q7" />
543
- <div class="radio"></div>
544
- <div class="option-text">Yes</div></label
545
- >
546
- </div>
547
- <div class="option">
548
- <label class="opt">
549
- <input type="radio" name="q7" />
550
- <div class="radio"></div>
551
  <div class="option-text">No</div>
552
  </label>
553
  </div>
554
  <div class="option">
555
  <label class="opt">
556
- <input class="radio" type="radio" name="q7" />
557
  <div class="radio"></div>
558
  <div class="option-text">Partially</div>
559
  </label>
560
  </div>
561
  </div>
562
  </div>
563
- <div class="question" id="q8">
564
- <div class="q-title">
565
- 5.2 How well did the app's verification evidence address
566
- the specific details of the "What"?
567
- </div>
568
- <div class="options">
569
- <div class="option">
570
- <label class="opt">
571
- <input type="radio" name="q8" />
572
- <div class="radio"></div>
573
- <div class="option-text">Not Relevant</div>
574
- </label>
575
- </div>
576
- <div class="option">
577
- <label class="opt">
578
- <input type="radio" name="q8" />
579
- <div class="radio"></div>
580
- <div class="option-text">Slightly Relevant</div>
581
- </label>
582
- </div>
583
- <div class="option">
584
- <label class="opt">
585
- <input type="radio" name="q8" />
586
- <div class="radio"></div>
587
- <div class="option-text">Moderately Relevant</div>
588
- </label>
589
- </div>
590
- <div class="option">
591
- <label class="opt">
592
- <input type="radio" name="q8" />
593
- <div class="radio"></div>
594
- <div class="option-text">Relevant</div>
595
- </label>
596
- </div>
597
- <div class="option">
598
- <label class="opt">
599
- <input type="radio" name="q8" />
600
- <div class="radio"></div>
601
- <div class="option-text">Highly Relevant</div>
602
- </label>
603
- </div>
604
- </div>
605
- </div>
606
- </div>
607
- </div>
608
-
609
- <!-- 2.6 -->
610
- <div class="flex flex-col gap-2">
611
- <div>
612
- <h3 class="section-title">
613
- 6. When (Timeliness and Context)
614
- </h3>
615
- </div>
616
- <div class="flex flex-col gap-3 pl-4">
617
- <div class="question" id="q9">
618
  <div class="q-title">
619
- 6.1 Did the app clearly show when the original
620
  event/information was first published or occurred?
621
  </div>
622
  <div class="options">
623
  <div class="option">
624
  <label class="opt">
625
- <input type="radio" name="q9" />
626
  <div class="radio"></div>
627
  <div class="option-text">Not Clear</div>
628
  </label>
629
  </div>
630
  <div class="option">
631
  <label class="opt">
632
- <input type="radio" name="q9" />
633
  <div class="radio"></div>
634
  <div class="option-text">Slightly Clear</div>
635
  </label>
636
  </div>
637
  <div class="option">
638
  <label class="opt">
639
- <input type="radio" name="q9" />
640
  <div class="radio"></div>
641
  <div class="option-text">Moderately Clear</div>
642
  </label>
643
  </div>
644
  <div class="option">
645
  <label class="opt">
646
- <input type="radio" name="q9" />
647
  <div class="radio"></div>
648
  <div class="option-text">Clear</div>
649
  </label>
650
  </div>
651
  <div class="option">
652
  <label class="opt">
653
- <input type="radio" name="q9" />
654
  <div class="radio"></div>
655
  <div class="option-text">Very Clear</div>
656
  </label>
657
  </div>
658
  </div>
659
  </div>
660
- <div class="question" id="q10">
661
- <div class="q-title">
662
- 6.2 How useful was the time context (e.g., date, timeline
663
- of events) in helping you determine the news'
664
- authenticity?
665
- </div>
666
- <div class="options">
667
- <div class="option">
668
- <label class="opt">
669
- <input type="radio" name="q10" />
670
- <div class="radio"></div>
671
- <div class="option-text">Not Useful</div>
672
- </label>
673
- </div>
674
- <div class="option">
675
- <label class="opt">
676
- <input type="radio" name="q10" />
677
- <div class="radio"></div>
678
- <div class="option-text">Slightly Useful</div>
679
- </label>
680
- </div>
681
- <div class="option">
682
- <label class="opt">
683
- <input type="radio" name="q10" />
684
- <div class="radio"></div>
685
- <div class="option-text">Moderately Useful</div>
686
- </label>
687
- </div>
688
- <div class="option">
689
- <label class="opt">
690
- <input type="radio" name="q10" />
691
- <div class="radio"></div>
692
- <div class="option-text">Useful</div>
693
- </label>
694
- </div>
695
- <div class="option">
696
- <label class="opt">
697
- <input type="radio" name="q10" />
698
- <div class="radio"></div>
699
- <div class="option-text">Very Useful</div>
700
- </label>
701
- </div>
702
- </div>
703
- </div>
704
- </div>
705
- </div>
706
-
707
- <!-- 2.7 -->
708
- <div class="flex flex-col gap-2">
709
- <div>
710
- <h3 class="section-title">7. Where (Location and Setting)</h3>
711
- </div>
712
- <div class="flex flex-col gap-3 pl-4">
713
- <div class="question" id="q11">
714
  <div class="q-title">
715
- 7.1 Was the location of the event ("Where") specified and
716
  verified by the app's output?
717
  </div>
718
  <div class="options links-list">
719
  <div class="option">
720
  <label class="opt">
721
- <input type="radio" name="q11" />
722
  <div class="radio"></div>
723
  <div class="option-text">Yes</div></label
724
  >
725
  </div>
726
  <div class="option">
727
  <label class="opt">
728
- <input type="radio" name="q11" />
729
  <div class="radio"></div>
730
  <div class="option-text">No</div>
731
  </label>
732
  </div>
733
  <div class="option">
734
  <label class="opt">
735
- <input class="radio" type="radio" name="q11" />
736
  <div class="radio"></div>
737
  <div class="option-text">Not Applicable</div>
738
  </label>
739
  </div>
740
  </div>
741
  </div>
742
- <div class="question" id="q12">
743
- <div class="q-title">
744
- 7.2 Did the app provide sufficient evidence (e.g., images,
745
- maps, source addresses) to confirm the "Where" of the
746
- event?
747
- </div>
748
- <div class="options">
749
- <div class="option">
750
- <label class="opt">
751
- <input type="radio" name="q12" />
752
- <div class="radio"></div>
753
- <div class="option-text">Insufficient</div>
754
- </label>
755
- </div>
756
- <div class="option">
757
- <label class="opt">
758
- <input type="radio" name="q12" />
759
- <div class="radio"></div>
760
- <div class="option-text">Slightly Sufficient</div>
761
- </label>
762
- </div>
763
- <div class="option">
764
- <label class="opt">
765
- <input type="radio" name="q12" />
766
- <div class="radio"></div>
767
- <div class="option-text">Moderately Sufficient</div>
768
- </label>
769
- </div>
770
- <div class="option">
771
- <label class="opt">
772
- <input type="radio" name="q12" />
773
- <div class="radio"></div>
774
- <div class="option-text">Sufficient</div>
775
- </label>
776
- </div>
777
- <div class="option">
778
- <label class="opt">
779
- <input type="radio" name="q12" />
780
- <div class="radio"></div>
781
- <div class="option-text">More than Sufficient</div>
782
- </label>
783
- </div>
784
- </div>
785
- </div>
786
- </div>
787
- </div>
788
-
789
- <!-- 2.8 -->
790
- <div class="flex flex-col gap-2">
791
- <div>
792
- <h3 class="section-title">8. Why (Motive and Context)</h3>
793
- </div>
794
- <div class="flex flex-col gap-3 pl-4">
795
- <div class="question" id="q13">
796
  <div class="q-title">
797
- 8.1 How well did the app explain the motive or purpose
798
  behind the original claim (e.g., persuasion, profit,
799
  error)?
800
  </div>
801
  <div class="options">
802
  <div class="option">
803
  <label class="opt">
804
- <input type="radio" name="q13" />
805
  <div class="radio"></div>
806
  <div class="option-text">Not Explained</div>
807
  </label>
808
  </div>
809
  <div class="option">
810
  <label class="opt">
811
- <input type="radio" name="q13" />
812
  <div class="radio"></div>
813
  <div class="option-text">Poorly Explained</div>
814
  </label>
815
  </div>
816
  <div class="option">
817
  <label class="opt">
818
- <input type="radio" name="q13" />
819
  <div class="radio"></div>
820
  <div class="option-text">Moderately Explained</div>
821
  </label>
822
  </div>
823
  <div class="option">
824
  <label class="opt">
825
- <input type="radio" name="q13" />
826
  <div class="radio"></div>
827
  <div class="option-text">Well Explained</div>
828
  </label>
829
  </div>
830
  <div class="option">
831
  <label class="opt">
832
- <input type="radio" name="q13" />
833
  <div class="radio"></div>
834
  <div class="option-text">Clearly Explained</div>
835
  </label>
836
  </div>
837
  </div>
838
  </div>
839
- <div class="question" id="q14">
840
- <div class="q-title">
841
- 8.2 Did the "Why" section help you understand if the news
842
- was designed to be misleading or biased?
843
- </div>
844
- <div class="options links-list">
845
- <div class="option">
846
- <label class="opt">
847
- <input type="radio" name="q14" />
848
- <div class="radio"></div>
849
- <div class="option-text">Yes</div></label
850
- >
851
- </div>
852
- <div class="option">
853
- <label class="opt">
854
- <input type="radio" name="q14" />
855
- <div class="radio"></div>
856
- <div class="option-text">No</div>
857
- </label>
858
- </div>
859
- <div class="option">
860
- <label class="opt">
861
- <input class="radio" type="radio" name="q14" />
862
- <div class="radio"></div>
863
- <div class="option-text">Already Clear</div>
864
- </label>
865
- </div>
866
- </div>
867
- </div>
868
- </div>
869
- </div>
870
-
871
- <!-- 2.9 -->
872
- <div class="flex flex-col gap-2">
873
- <div>
874
- <h3 class="section-title">9. About You</h3>
875
- </div>
876
- <div class="flex flex-col gap-3 pl-4">
877
- <div class="question" id="q15">
878
- <div class="q-title">9.1 What is your profession?</div>
879
- <div class="options links-list">
880
- <div class="option">
881
- <label class="opt">
882
- <input type="radio" name="q15" />
883
- <div class="radio"></div>
884
- <div class="option-text">
885
- Journalist / Fact Checker
886
- </div></label
887
- >
888
- </div>
889
- <div class="option">
890
- <label class="opt">
891
- <input type="radio" name="q15" />
892
- <div class="radio"></div>
893
- <div class="option-text">Researcher / Student</div>
894
- </label>
895
- </div>
896
- <div class="option">
897
- <label class="opt">
898
- <input class="radio" type="radio" name="q15" />
899
- <div class="radio"></div>
900
- <div class="option-text">Law Enforcement / OSINT</div>
901
- </label>
902
- </div>
903
- <div class="option">
904
- <label class="opt">
905
- <input class="radio" type="radio" name="q15" />
906
- <div class="radio"></div>
907
- <div class="option-text">General User</div>
908
- </label>
909
- </div>
910
- </div>
911
- </div>
912
- <div class="question" id="q16">
913
- <label class="textarea" for="feedback-q16-comments">
914
  <span class="textarea-label">
915
- 9.2 Help us improve. If the verification failed, what
916
  did we miss?
917
  </span>
918
  </label>
919
  <textarea
920
- id="feedback-q16-comments"
921
  class="feedback-textarea"
922
- name="q16_comments"
923
  rows="4"
924
  placeholder="Text value"
925
  ></textarea>
 
222
  <!-- 2.1 -->
223
  <div class="flex flex-col gap-2">
224
  <div>
225
+ <h3 class="section-title">1. General Questions</h3>
226
  </div>
227
  <div class="flex flex-col gap-3 pl-4">
228
  <div class="question" id="q0">
229
+ <div class="q-title">1.1 What is your profession?</div>
 
 
 
 
230
  <div class="options">
231
  <div class="option">
232
  <label class="opt">
233
  <input type="radio" name="q0" />
234
  <div class="radio"></div>
235
+ <div class="option-text">
236
+ Journalist / Fact Checker
237
+ </div>
 
 
 
 
 
238
  </label>
239
  </div>
240
  <div class="option">
241
  <label class="opt">
242
  <input type="radio" name="q0" />
243
  <div class="radio"></div>
244
+ <div class="option-text">Researcher / Student</div>
245
  </label>
246
  </div>
247
  <div class="option">
248
  <label class="opt">
249
  <input type="radio" name="q0" />
250
  <div class="radio"></div>
251
+ <div class="option-text">Law Enforcement / OSINT</div>
252
  </label>
253
  </div>
254
  <div class="option">
255
  <label class="opt">
256
  <input type="radio" name="q0" />
257
  <div class="radio"></div>
258
+ <div class="option-text">General User</div>
259
  </label>
260
  </div>
261
  </div>
262
  </div>
263
  <div class="question" id="q1">
264
  <div class="q-title">
265
+ 1.2 How accurate was the conclusion?<span class="required"
266
+ >*</span
267
+ >
268
  </div>
269
  <div class="options">
270
  <div class="option">
271
  <label class="opt">
272
  <input type="radio" name="q1" />
273
  <div class="radio"></div>
274
+ <div class="option-text">Completely wrong</div>
275
  </label>
276
  </div>
277
  <div class="option">
278
  <label class="opt">
279
  <input type="radio" name="q1" />
280
  <div class="radio"></div>
281
+ <div class="option-text">Missed key context</div>
 
 
282
  </label>
283
  </div>
284
  <div class="option">
285
  <label class="opt">
286
  <input type="radio" name="q1" />
287
  <div class="radio"></div>
288
+ <div class="option-text">Mixed results</div>
289
+ </label>
290
+ </div>
291
+ <div class="option">
292
+ <label class="opt">
293
+ <input type="radio" name="q1" />
294
+ <div class="radio"></div>
295
+ <div class="option-text">Mostly correct</div>
296
+ </label>
297
+ </div>
298
+ <div class="option">
299
+ <label class="opt">
300
+ <input type="radio" name="q1" />
301
+ <div class="radio"></div>
302
+ <div class="option-text">Spot on</div>
303
  </label>
304
  </div>
305
  </div>
306
  </div>
 
 
 
 
 
 
 
 
 
 
307
  <div class="question" id="q2">
308
  <div class="q-title">
309
+ 1.3 Did the algorithm correctly classify this
310
+ content?<span class="required">*</span>
311
  </div>
312
  <div class="options links-list">
313
  <div class="option">
314
  <label class="opt">
315
  <input type="radio" name="q2" />
316
  <div class="radio"></div>
317
+ <div class="option-text">Yes</div>
 
 
318
  </label>
319
  </div>
320
  <div class="option">
 
322
  <input type="radio" name="q2" />
323
  <div class="radio"></div>
324
  <div class="option-text">
325
+ No - It was actually Real
326
  </div>
327
  </label>
328
  </div>
 
331
  <input class="radio" type="radio" name="q2" />
332
  <div class="radio"></div>
333
  <div class="option-text">
334
+ No - It was actually AI-Generated
335
  </div>
336
  </label>
337
  </div>
 
339
  </div>
340
  <div class="question" id="q3">
341
  <div class="q-title">
342
+ 1.4 Were the provided links relevant?
343
  </div>
344
  <div class="options links-list">
345
  <div class="option">
346
  <label class="opt">
347
  <input type="radio" name="q3" />
348
  <div class="radio"></div>
349
+ <div class="option-text">
350
+ All links worked and were relevant
351
+ </div></label
352
  >
353
  </div>
354
  <div class="option">
 
356
  <input type="radio" name="q3" />
357
  <div class="radio"></div>
358
  <div class="option-text">
359
+ Some links were broken/dead
360
  </div>
361
  </label>
362
  </div>
 
364
  <label class="opt">
365
  <input class="radio" type="radio" name="q3" />
366
  <div class="radio"></div>
367
+ <div class="option-text">
368
+ Links were unrelated to the topic
369
+ </div>
370
  </label>
371
  </div>
372
  </div>
373
  </div>
 
 
 
 
 
 
 
 
 
 
 
374
  <div class="question" id="q4">
375
  <div class="q-title">
376
+ 1.5 Did the report contain any hallucinations (made-up
377
  facts)?
378
  </div>
379
  <div class="options links-list">
 
411
  </div>
412
  </div>
413
  </div>
 
414
  <div class="flex flex-col gap-2">
415
  <div>
416
+ <h3 class="section-title">2. Detailed Questions</h3>
 
 
417
  </div>
418
  <div class="flex flex-col gap-3 pl-4">
419
  <div class="question" id="q5">
420
  <div class="q-title">
421
+ 2.1 Did the app clearly identify the main people,
422
  organizations, or sources involved in the news item?
423
  </div>
424
  <div class="options">
 
461
  </div>
462
  <div class="question" id="q6">
463
  <div class="q-title">
464
+ 2.2 Did the app correctly identify the central claim or
465
+ action of the news story?
 
466
  </div>
467
  <div class="options">
468
  <div class="option">
469
  <label class="opt">
470
  <input type="radio" name="q6" />
471
  <div class="radio"></div>
472
+ <div class="option-text">Yes</div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
473
  </label>
474
  </div>
475
  <div class="option">
476
  <label class="opt">
477
  <input type="radio" name="q6" />
478
  <div class="radio"></div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
479
  <div class="option-text">No</div>
480
  </label>
481
  </div>
482
  <div class="option">
483
  <label class="opt">
484
+ <input type="radio" name="q6" />
485
  <div class="radio"></div>
486
  <div class="option-text">Partially</div>
487
  </label>
488
  </div>
489
  </div>
490
  </div>
491
+ <div class="question" id="q7">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
492
  <div class="q-title">
493
+ 2.3 Did the app clearly show when the original
494
  event/information was first published or occurred?
495
  </div>
496
  <div class="options">
497
  <div class="option">
498
  <label class="opt">
499
+ <input type="radio" name="q7" />
500
  <div class="radio"></div>
501
  <div class="option-text">Not Clear</div>
502
  </label>
503
  </div>
504
  <div class="option">
505
  <label class="opt">
506
+ <input type="radio" name="q7" />
507
  <div class="radio"></div>
508
  <div class="option-text">Slightly Clear</div>
509
  </label>
510
  </div>
511
  <div class="option">
512
  <label class="opt">
513
+ <input type="radio" name="q7" />
514
  <div class="radio"></div>
515
  <div class="option-text">Moderately Clear</div>
516
  </label>
517
  </div>
518
  <div class="option">
519
  <label class="opt">
520
+ <input type="radio" name="q7" />
521
  <div class="radio"></div>
522
  <div class="option-text">Clear</div>
523
  </label>
524
  </div>
525
  <div class="option">
526
  <label class="opt">
527
+ <input type="radio" name="q7" />
528
  <div class="radio"></div>
529
  <div class="option-text">Very Clear</div>
530
  </label>
531
  </div>
532
  </div>
533
  </div>
534
+ <div class="question" id="q8">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
535
  <div class="q-title">
536
+ 2.4 Was the location of the event ("Where") specified and
537
  verified by the app's output?
538
  </div>
539
  <div class="options links-list">
540
  <div class="option">
541
  <label class="opt">
542
+ <input type="radio" name="q8" />
543
  <div class="radio"></div>
544
  <div class="option-text">Yes</div></label
545
  >
546
  </div>
547
  <div class="option">
548
  <label class="opt">
549
+ <input type="radio" name="q8" />
550
  <div class="radio"></div>
551
  <div class="option-text">No</div>
552
  </label>
553
  </div>
554
  <div class="option">
555
  <label class="opt">
556
+ <input class="radio" type="radio" name="q8" />
557
  <div class="radio"></div>
558
  <div class="option-text">Not Applicable</div>
559
  </label>
560
  </div>
561
  </div>
562
  </div>
563
+ <div class="question" id="q9">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
564
  <div class="q-title">
565
+ 2.5 How well did the app explain the motive or purpose
566
  behind the original claim (e.g., persuasion, profit,
567
  error)?
568
  </div>
569
  <div class="options">
570
  <div class="option">
571
  <label class="opt">
572
+ <input type="radio" name="q9" />
573
  <div class="radio"></div>
574
  <div class="option-text">Not Explained</div>
575
  </label>
576
  </div>
577
  <div class="option">
578
  <label class="opt">
579
+ <input type="radio" name="q9" />
580
  <div class="radio"></div>
581
  <div class="option-text">Poorly Explained</div>
582
  </label>
583
  </div>
584
  <div class="option">
585
  <label class="opt">
586
+ <input type="radio" name="q9" />
587
  <div class="radio"></div>
588
  <div class="option-text">Moderately Explained</div>
589
  </label>
590
  </div>
591
  <div class="option">
592
  <label class="opt">
593
+ <input type="radio" name="q9" />
594
  <div class="radio"></div>
595
  <div class="option-text">Well Explained</div>
596
  </label>
597
  </div>
598
  <div class="option">
599
  <label class="opt">
600
+ <input type="radio" name="q9" />
601
  <div class="radio"></div>
602
  <div class="option-text">Clearly Explained</div>
603
  </label>
604
  </div>
605
  </div>
606
  </div>
607
+ <div class="question" id="q10">
608
+ <label class="textarea" for="feedback-q10-comments">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
609
  <span class="textarea-label">
610
+ 2.6 Help us improve. If the verification failed, what
611
  did we miss?
612
  </span>
613
  </label>
614
  <textarea
615
+ id="feedback-q10-comments"
616
  class="feedback-textarea"
617
+ name="q10_comments"
618
  rows="4"
619
  placeholder="Text value"
620
  ></textarea>