diff options
Diffstat (limited to 'gn2')
| -rw-r--r-- | gn2/wqflask/templates/gnqa_answer.html | 27 |
1 files changed, 17 insertions, 10 deletions
diff --git a/gn2/wqflask/templates/gnqa_answer.html b/gn2/wqflask/templates/gnqa_answer.html index 62ce70d9..41c1b338 100644 --- a/gn2/wqflask/templates/gnqa_answer.html +++ b/gn2/wqflask/templates/gnqa_answer.html @@ -6,7 +6,7 @@ {{ answer|safe }} </p> <div class="rating row" data-doc-id="{{query}}"> - <button class="btn" id="upvote" data-toggle="tooltip" data-placement="top" title="Vote Up"><i class="fa fa-thumbs-up fa-sm fa-1x" aria-hidden="true"></i></button> + <button class="btn" id="upvote" data-toggle="tooltip" data-placement="top" title="Vote Up"><i class="fa fa-thumbs-up fa-sm fa-1x" aria-hidden="true"></i></button> <button class="btn" id="downvote" data-toggle="tooltip" data-placement="top" title="Vote Down"><i class="fa fa-thumbs-down fa-sm fa-1x" aria-hidden="true"></i></button> <sub id="rate" class="text-info"> </sub> @@ -93,20 +93,27 @@ {% block js %} <script> + function updateRatingHandler(target, responseObj, args){ + let {status, response} = responseObj.xhr + if (status==200 && args == "upvote"){ + htmx.toggleClass(htmx.find('#upvote'), 'btn-success'); + htmx.removeClass(htmx.find("#downvote"), "btn-danger"); + } + else if(status == 200 && args == "downvote") { + htmx.toggleClass(htmx.find('#downvote'), 'btn-danger'); + htmx.removeClass(htmx.find("#upvote"), "btn-success"); + } + else { + alert(`Error occurred with status ${status} and Error ${response}` ) +}} var query = {{ query|tojson }}; var answer = {{ answer|tojson }} var {task_id} = {{ task_id|tojson }} - htmx.on("#upvote", "click", function(evt){ +htmx.on("#upvote", "click", function(evt){ vote_count = htmx.find(".btn-success") ? 0 : 1 - htmx.ajax("POST", `/gnqna/rating/${task_id}/${vote_count}`, {target: "#rate", swap:"innerHTML",values: {'query': query, 'answer': answer}}).then(()=>{ - htmx.toggleClass(htmx.find('#upvote'), 'btn-success'); - htmx.removeClass(htmx.find("#downvote"), "btn-danger"); -})}); + htmx.ajax("POST", `/gnqna/rating/${task_id}/${vote_count}`, {target: "#rate", handler: (target,obj)=> updateRatingHandler(target,obj,"upvote"), swap:"innerHTML",values: {'query': query, 'answer': answer}})}); htmx.on("#downvote", "click", function(evt){ vote_count = htmx.find(".btn-danger") ? 0 : -1 - htmx.ajax("POST", `/gnqna/rating/${task_id}/${vote_count}`, {target: "#rate", swap:"innerHTML",values: {'query': query, 'answer': answer}}).then(()=>{ - htmx.toggleClass(htmx.find('#downvote'), 'btn-danger'); - htmx.removeClass(htmx.find("#upvote"), "btn-success") - })}); + htmx.ajax("POST", `/gnqna/rating/${task_id}/${vote_count}`, {target: "#rate",handler: (target,obj)=> updateRatingHandler(target,obj,"downvote") , swap:"innerHTML",values: {'query': query, 'answer': answer}})}); </script> {% endblock %} |