1import "./editor.css";
2export { theme } from "../tags/question-layout.marko";
3
4export const meta = { title: "question editor" };
5
6export interface Input {
7 question: Question;
8 pendingInfo: PendingQuestion.JSON | null;
9}
10
11export interface ScriptPayload {
12 id: string;
13 qmid: string;
14 text: string;
15 type: Question.Type;
16 date: string;
17}
18
19<const/{ question }=input>
20
21<const/payload={
22 id: question.id,
23 qmid: question.qmid,
24 text: question.text,
25 type: question.type,
26 date: question.date.toISOString(),
27} satisfies ScriptPayload>
28
29<div#edit-grid.qa>
30 <div#topleft>
31 <button onclick="location.href='/admin/q+a'" style={ color: "magenta" }>
32 all
33 </button>
34 <button
35 onclick="location.href='/admin/q+a/inbox'"
36 style={ color: "dodgerblue" }
37 >
38 inbox
39 </button>
40 </div>
41 <div#topright>
42 <button onclick="onCommitQuestion()" style="color:lime">update</button>
43 <button onclick="onDelete()" style={ color: "red" }>reject</button>
44 <select id="type" onchange="onTypeChange()" value=question.type>
45 <option value=QuestionType.normal>normal</option>
46 <option value=QuestionType.annotation>annotation</option>
47 <option value=QuestionType.reject>reject</option>
48 </select>
49 </div>
50 <textarea#editor/>
51 <main#preview>
52 <question editor ...{ question }/>
53 </main>
54</div>
55<html-script>
56 self.payload = ${
57 JSON.stringify(payload).replaceAll("</script>", "<\\/script>")
58 };
59</html-script>
60<html-script src="/js/q+a/scripts/editor.js" type="module"/>
61
62import { type PendingQuestion } from "#src/q+a/models/PendingQuestion.ts";
63import { Question, QuestionType } from "#src/q+a/models/Question.ts";