liquid_feedback_frontend
view app/main/initiative/_suggestions.lua @ 1651:3abdb22f9da8
Updated material icon font
| author | bsw | 
|---|---|
| date | Fri Feb 12 17:32:01 2021 +0100 (2021-02-12) | 
| parents | 4188405c2425 | 
| children | c08690678b2d | 
 line source
     1 local initiative = param.get("initiative", "table")
     2 local direct_supporter
     3 if app.session.member_id then
     4   direct_supporter = initiative.issue.member_info.own_participation and initiative.member_info.supported
     5 end
     8 if direct_supporter then
     9   ui.tag{ tag = "dialog", attr = { id = "rating_dialog" }, content = function ()
    11     local opinion = {}
    12     ui.form { 
    13       attr = { onsubmit = "updateOpinion(); return false;" },
    14       module = "opinion", action = "update",
    15       routing = { default = {
    16         mode = "redirect", 
    17         module = "initiative", view = "show", id = initiative.id
    18       } },
    19       content = function ()
    20         ui.field.hidden{ attr = { id = "rating_suggestion_id" }, name = "suggestion_id" }        
    21         ui.container{ attr = { class = "opinon-question" }, content = _"Should the initiator implement this suggestion?" }
    22         ui.container { content = function ()
    24           local options = {
    25             { degree =  2, label = _"must" },
    26             { degree =  1, label = _"should" },
    27             { degree =  0, label = _"neutral" },
    28             { degree = -1, label = _"should not" },
    29             { degree = -2, label = _"must not" },
    30           }
    32           for i, option in ipairs(options) do
    33             ui.tag{
    34               tag = "label", 
    35               attr = { 
    36                 id = "rating_degree" .. option.degree,
    37                 class = "mdl-radio mdl-js-radio mdl-js-ripple-effect"
    38               }, 
    39               ["for"] = "rating_degree" .. option.degree, 
    40               content = function()
    41                 ui.tag{
    42                   tag = "input",
    43                   attr = {
    44                     class = "mdl-radio__button",
    45                     type = "radio",
    46                     name = "degree",
    47                     value = option.degree
    48                   }
    49                 }
    50                 ui.tag{
    51                   attr = { class = "mdl-radio__label" },
    52                   content = option.label
    53                 }
    54               end
    55             }
    56             slot.put("     ")
    57           end
    58         end }
    60         slot.put("<br />")
    62         ui.container{ attr = { class = "opinon-question" }, content = _"Did the initiator implement this suggestion?" }
    63         ui.container { content = function ()
    65           local options = {
    66             { degree = "false", id = "notfulfilled", label = _"No (not yet)" },
    67             { degree = "true", id = "fulfilled", label = _"Yes, it's implemented" },
    68           }
    70           for i, option in ipairs(options) do
    71             ui.tag{
    72               tag = "label", 
    73               attr = {
    74                 id = "rating_" .. option.id,
    75                 class = "mdl-radio mdl-js-radio mdl-js-ripple-effect"
    76               }, 
    77               ["for"] = "rating_" .. option.id, 
    78               content = function()
    79                 ui.tag{
    80                   tag = "input",
    81                   attr = {
    82                     class = "mdl-radio__button",
    83                     type = "radio",
    84                     name = "fulfilled",
    85                     value = option.degree,
    86                   }
    87                 }
    88                 ui.tag{
    89                   attr = { class = "mdl-radio__label" },
    90                   content = option.label
    91                 }
    92               end
    93             }
    94             slot.put("     ")
    95           end
    96         end }
    98         slot.put("<br />")
   100         ui.tag{
   101           tag = "input",
   102           attr = {
   103             type = "submit",
   104             class = "mdl-button mdl-js-button mdl-button--raised mdl-button--colored",
   105             value = _"publish my rating"
   106           },
   107           content = ""
   108         }
   110         slot.put("   ")
   112         ui.tag{
   113           tag = "input",
   114           attr = {
   115             onclick = "document.getElementById('rating_dialog').close(); return false;",
   116             type = "submit",
   117             class = "mdl-button mdl-js-button",
   118             value = _"cancel"
   119           },
   120           content = ""
   121         }
   123       end 
   124     }
   126   end }
   127 end
   130 ui.link { attr = { name = "suggestions" }, text = "" }
   132 ui.container {
   133   attr = { class = "section suggestions" },
   134   content = function ()
   136     if # ( initiative.suggestions ) > 0 then
   138       ui.heading { 
   139         level = 1, 
   140         content = _("Suggestions for improvement (#{count})", { count = # ( initiative.suggestions ) } ) 
   141       }
   142       ui.container { content = _"written and rated by the supportes of this initiative to improve the proposal and its reasons" }
   143       slot.put("<br />")
   145       for i, suggestion in ipairs(initiative.suggestions) do
   147         local opinion = Opinion:by_pk(app.session.member_id, suggestion.id)
   149         local class = "mdl-card mdl-card__fullwidth mdl-shadow--2dp not-folded"
   150         if suggestion.id == param.get("suggestion_id", atom.number) then
   151           class = class .. " highlighted"
   152         end
   153         if member and not initiative.issue.fully_frozen and not initiative.issue.closed and initiative.member_info.supported then
   154           class = class .. " rateable"
   155         end
   157         ui.link { attr = { name = "s" .. suggestion.id }, text = "" }
   158         ui.tag { tag = "div", attr = { class = class, id = "s" .. suggestion.id }, content = function ()
   159           ui.tag{ attr = { class = "mdl-card__title mdl-card--border" }, content = function()
   160             ui.heading { level = 2, 
   161               attr = { class = "mdl-card__title-text" },
   162               content = function()
   163                 ui.tag{ content = format.string(suggestion.name, {
   164                   truncate_at = 160, truncate_suffix = true })
   165                 }
   166               end
   167             }
   168           end }
   172           ui.container{ attr = { class = "suggestion-content" }, content = function()
   174             ui.container { 
   175               attr = { class = "mdl-card__content mdl-card--border suggestionInfo" },
   176               content = function ()
   178                 if app.session:has_access("authors_pseudonymous") then
   179                   util.micro_avatar ( suggestion.author )
   180                 end
   182                 execute.view{
   183                   module = "suggestion", view = "_collective_rating", params = {
   184                     suggestion = suggestion
   185                   }
   186                 }
   188               end 
   189             }
   191             ui.container {
   192               attr = { class = "mdl-card__content suggestion-text draft" },
   193               content = function ()
   194                 slot.put ( suggestion:get_content( "html" ) )
   196                 ui.container { attr = { class = "floatx-right" }, content = function()
   198                   ui.link { 
   199                     attr = { 
   200                       class = "mdl-button mdl-js-button mdl-button--icon suggestion-more",
   201                       onclick = "document.querySelector('#s" .. suggestion.id .. "').classList.remove('folded');document.querySelector('#s" .. suggestion.id .. "').classList.add('unfolded'); return false;"
   202                     },
   203                     content = function()
   204                       ui.tag{ tag = "i", attr = { class = "material-icons" }, content = "expand_more" }
   205                     end
   206                   }
   208                   ui.link { 
   209                     attr = { 
   210                       class = "mdl-button mdl-js-button mdl-button--icon suggestion-less",
   211                       onclick = "document.querySelector('#s" .. suggestion.id .. "').classList.add('folded');document.querySelector('#s" .. suggestion.id .. "').classList.remove('unfolded'); return false;"
   212                     },
   213                     content = function()
   214                       ui.tag{ tag = "i", attr = { class = "material-icons" }, content = "expand_less" }
   215                     end
   216                   }
   217                   --[[
   218                   ui.link{
   219                     attr = { class = "mdl-button" },
   220                     content = _"Details",
   221                     module = "suggestion", view = "show", id = suggestion.id
   222                   }
   223                   --]]
   224                 end }
   226               end
   227             }
   229           end }
   231           ui.container { attr = { class = "mdl-card__actions mdl-card--border" }, content = function()
   233             ui.container{ attr = { class = "float-right" }, content = function()
   234               ui.tag{ attr = { id = "s" .. suggestion.id .. "_rating_text" }, content = function()
   235                 local text = ""
   236                 if opinion then
   237                   if opinion.degree == 2 then
   238                     text = _"must"
   239                   elseif opinion.degree == 1 then
   240                     text = _"should"
   241                   elseif opinion.degree == 0 then
   242                     text = _"neutral"
   243                   elseif opinion.degree == -1 then
   244                     text = _"should not"
   245                   elseif opinion.degree == -2 then
   246                     text = _"must not"
   247                   end
   248                   ui.tag { content = text }
   249                   slot.put ( " " )
   250                   if 
   251                     (opinion.degree > 0 and not opinion.fulfilled)
   252                     or (opinion.degree < 0 and opinion.fulfilled)
   253                   then
   254                     ui.tag{ content = _"but" }
   255                   else
   256                     ui.tag{ content = _"and" }
   257                   end
   258                   slot.put ( " " )
   259                   local text = ""
   260                   if opinion.fulfilled then
   261                     text = _"is implemented"
   262                   else
   263                     text = _"is not implemented"
   264                   end
   265                   ui.tag { content = text }
   266                 end
   267               end }
   268               local id = "s" .. suggestion.id .. "_rating_icon"
   269               if opinion and (
   270                   (opinion.degree > 0 and not opinion.fulfilled)
   271                   or (opinion.degree < 0 and opinion.fulfilled)
   272                 )
   273               then
   274                 slot.put(" ")
   275                 if math.abs(opinion.degree) > 1 then
   276                   ui.icon("warning", "red", id)
   277                 else
   278                   ui.icon("warning", nil, id)
   279                 end
   280               elseif opinion then
   281                 slot.put(" ")
   282                 ui.icon("done", nil, id)
   283               else
   284                 slot.put(" ")
   285                 ui.icon("blank", nil, id)
   286               end
   287             end }
   289             ui.link{
   290               attr = {
   291                 id = "s" .. suggestion.id .. "_rate_button",
   292                 class = "mdl-button",
   293                 onclick = "rateSuggestion(" .. suggestion.id .. ", " .. (opinion and opinion.degree or 0) .. ", " .. (opinion and (opinion.fulfilled and "true" or "false") or "null") .. ");return false;"
   294               },
   295               content = function()
   296                 if opinion then
   297                   ui.tag { content = _"update rating" }
   298                 else
   299                   ui.tag { content = _"rate suggestion" }
   300                 end
   301               end
   302             }
   304             ui.link{
   305               attr = { class = "mdl-button" },
   306               content = _"Details",
   307               module = "suggestion", view = "show", id = suggestion.id
   308             }
   310           end }
   311           ui.script{ script = [[
   312             var rateSuggestionRateText = "]] .. _"rate suggestion" .. [[";
   313             var rateSuggestionUpdateRatingText = "]] .. _"update rating" .. [[";
   314             var rateSuggestionDegreeTexts = {
   315               "-2": "]] .. _"must not" .. [[",
   316               "-1": "]] .. _"should not" .. [[",
   317               "1": "]] .. _"should" .. [[",
   318               "2": "]] .. _"must" .. [["
   319             }
   320             var rateSuggestionAndText = "]] .. _"and" .. [[";
   321             var rateSuggestionButText = "]] .. _"but" .. [[";
   322             var rateSuggestionFulfilledText = "]] .. _"is implemented" .. [[";
   323             var rateSuggestionNotFulfilledText = "]] .. _"is not implemented" .. [[";
   324             window.addEventListener("load", function() {
   325               var textEl = document.querySelector('#s]] .. suggestion.id .. [[ .suggestion-content');
   326               var height = textEl.clientHeight;
   327               if (height > 250) {
   328                 document.querySelector('#s]] .. suggestion.id .. [[').classList.add('folded');
   329               }
   330             });
   331           ]] }
   333         end } 
   335       end -- for i, suggestion
   337     end -- if #initiative.suggestions > 0
   338   end
   339 }
