liquid_feedback_frontend
view app/main/survey/participate.lua @ 1805:dadba1e28226
Avoid counter overlapping with question text
| author | bsw |
|---|---|
| date | Thu Nov 18 14:33:00 2021 +0100 (2021-11-18) |
| parents | 6d69bc46440e |
| children |
line source
1 local survey = Survey:get_open()
2 if not survey then
3 return execute.view { module = "index", view = "404" }
4 end
6 local survey_member = SurveyMember:by_pk(survey.id, app.session.member_id)
7 if not survey_member then
8 return execute.view { module = "index", view = "404" }
9 end
11 local question
12 local question_number = #survey.questions
14 if survey_member then
15 local answer_set = survey_member.answer_set
16 if answer_set then
17 local answers_by_question_id = {}
18 for i, answer in ipairs(answer_set.answers) do
19 answers_by_question_id[answer.survey_question_id] = answer
20 end
21 for i, q in ipairs(survey.questions) do
22 if not question and not answers_by_question_id[q.id] then
23 question = q
24 question_number = i - 1
25 end
26 end
27 end
28 end
30 ui.title(survey.title)
31 ui.grid{ content = function()
32 ui.cell_main{ content = function()
34 ui.container{ attr = { class = "mdl-card mdl-card__fullwidth mdl-shadow--2dp survey" }, content = function()
35 ui.container{ attr = { class = "mdl-card__title" }, content = function()
36 ui.heading { attr = { class = "mdl-card__title-text" }, level = 2, content = function()
37 if survey_member.finished then
38 slot.put(survey.finished_title)
39 else
40 ui.tag{ attr = { class = "survey_counter" }, content = (question_number + 1) .. " / " .. #survey.questions }
41 ui.tag{ tag = "span", content = question.question }
42 end
43 end }
44 end }
45 slot.put('<div id = "progressbar1" style="width: 100%;" class = "mdl-progress mdl-js-progress"></div>')
47 ui.script{ script = [[
48 document.querySelector('#progressbar1').addEventListener('mdl-componentupgraded',
49 function() {
50 this.MaterialProgress.setProgress(]] .. question_number / #survey.questions * 100 .. [[);
51 });
53 ]] }
54 ui.container{ attr = { class = "mdl-card__content mdl-card--border" }, content = function()
55 if survey_member.finished then
56 ui.container{ content = function()
57 slot.put(survey.finished_text)
58 end }
59 slot.put("<br>")
60 ui.link{
61 attr = { class = "mdl-button mdl-js-button mdl-button--raised mdl-button--colored" },
62 module = "index", view = "index", content = _"Go to start page"
63 }
64 return
65 else
66 if question.description then
67 ui.container{ content = question.description }
68 slot.put("<br>")
69 end
70 ui.form{
71 module = "survey", action = "answer",
72 routing = {
73 ok = { mode = "redirect", module = "survey", view = "participate" },
74 error = { mode = "forward", module = "survey", view = "participate" },
75 },
76 content = function()
78 ui.field.hidden{ name = "question_id", value = question.id }
80 if question.answer_type == "radio" then
81 for i, answer_option in ipairs(question.answer_options) do
82 ui.container{ content = function()
83 ui.tag{ tag = "label", attr = {
84 class = "mdl-radio mdl-js-radio mdl-js-ripple-effect",
85 ["for"] = "answer_" .. i
86 },
87 content = function()
88 ui.tag{
89 tag = "input",
90 attr = {
91 id = "answer_" .. i,
92 class = "mdl-radio__button",
93 type = "radio",
94 name = "answer",
95 value = answer_option,
96 checked = param.get("answer") == answer_option and "checked" or nil,
97 }
98 }
99 ui.tag{
100 attr = { class = "mdl-radio__label", ['for'] = "answer_" .. i },
101 content = answer_option
102 }
103 end
104 }
105 end }
106 end
108 elseif question.answer_type == "checkbox" then
109 for i, answer_option in ipairs(question.answer_options) do
110 ui.container{ content = function()
111 ui.tag{ tag = "label", attr = {
112 class = "mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect",
113 ["for"] = "answer_" .. i
114 },
115 content = function()
116 ui.tag{
117 tag = "input",
118 attr = {
119 id = "answer_" .. i,
120 class = "mdl-checkbox__input",
121 type = "checkbox",
122 name = "answer_" .. answer_option,
123 value = "1",
124 checked = param.get("answer_" .. answer_option) and "checked" or nil,
125 }
126 }
127 ui.tag{
128 attr = { class = "mdl-checkbox__label", ['for'] = "answer_" .. i },
129 content = answer_option
130 }
131 end
132 }
133 end }
134 end
135 end
137 slot.put("<br>")
138 ui.tag{
139 tag = "input",
140 attr = {
141 type = "submit",
142 class = "mdl-button mdl-js-button mdl-button--raised mdl-button--colored",
143 value = _"Next step"
144 },
145 content = ""
146 }
147 end
148 }
149 end
150 end }
151 end }
152 end }
153 end }