vendor/bait/poll-bundle/Resources/views/Poll/poll_results.html.twig line 1

Open in your IDE?
  1. {% include 'BaitPollBundle:Poll:poll.html.twig' %}
  2. {% if poll.displayType == 'onclick' and answerSaved is not defined %}
  3. <section style="display:none" class="poll-showhide" data-pollid="{{poll.id}}">
  4. {% endif %}
  5. {% if ongoingResultAnswers is defined %}
  6.     {% for question in poll.questions %}
  7.         {% if ongoingResultQuestions[question.id] is defined %}
  8.             <canvas id="{{ question.id }}" style="margin-top: 30px"></canvas>
  9.             <component is="script">
  10.                 var ctx = document.getElementById('{{ question.id }}').getContext('2d');
  11.                 var bodyStyle = getComputedStyle(document.body);
  12.                 var topBarStyle = getComputedStyle(document.querySelector('#top-bar'));
  13.                 var fontFamily = bodyStyle.getPropertyValue('font-family');
  14.                 var fontSize = bodyStyle.getPropertyValue('font-size');
  15.                 var color = bodyStyle.getPropertyValue('color');
  16.                 var webColor = window.location.href.includes('funradio') ? 'rgb(229, 0, 105)' : 'rgb(124, 194, 66)'; // background color for Funradio or Birdie
  17.                 var backgroundColor = topBarStyle.getPropertyValue('background-color') === 'rgba(0, 0, 0, 0)' ? webColor : topBarStyle.getPropertyValue('background-color');
  18.                 var labels = '{% for answer in question.answers %}{{answer.answer}};{% endfor %}'.slice(0, -1);
  19.                 var data = '{% for answer in question.answers %}{{ ongoingResultAnswers[answer.id]|default(0) }};{% endfor %}'.slice(0, -1);
  20.                 {# per-site colors #}
  21.                 var defaultColors = [
  22.                     backgroundColor,
  23.                     backgroundColor.replace(")", ", 0.8)"),
  24.                     backgroundColor.replace(")", ", 0.6)"),
  25.                     backgroundColor.replace(")", ", 0.4)"),
  26.                     backgroundColor.replace(")", ", 0.2)")
  27.                 ];
  28.                 {# init with DB values #}
  29.                 var chartColors = [
  30.                     {%- for answer in question.answers -%}
  31.                         {%- if answer.answerColor is not empty -%}
  32.                             '{{ answer.answerColor }}'
  33.                         {%- else -%}
  34.                             null
  35.                         {%- endif -%}
  36.                         {%- if not loop.last -%},{%- endif -%}
  37.                     {%- endfor -%}
  38.                 ];
  39.                 {# merge custom colors with per-site fallbacks #}
  40.                 for (let i = 0; i < chartColors.length; i++) {
  41.                     chartColors[i] = (chartColors[i] !== null) ? chartColors[i] : defaultColors.shift();
  42.                 }
  43.                 Chart.defaults.global.defaultFontFamily = fontFamily;
  44.                 Chart.defaults.global.defaultFontSize = Number(fontSize.slice(0, 2));
  45.                 Chart.defaults.global.defaultFontColor = color;
  46.                 var chart = new Chart(ctx, {
  47.                     type: 'pie',
  48.                     data: {
  49.                         labels: labels.split(';'),
  50.                         datasets: [{
  51.                             label: '{{ question.title }}',
  52.                             backgroundColor: chartColors,
  53.                             data: data.split(';')
  54.                         }]
  55.                     },
  56.                     options: {
  57.                         title: {
  58.                             display: true,
  59.                             text: '{{question.title}}'.replace(/&quot;/g, '"')
  60.                         },
  61.                         tooltips: {
  62.                             callbacks: {
  63.                                 label: function(tooltipItem, data) {
  64.                                     var totalAnswers = {{ongoingResultQuestions[question.id]}};
  65.                                     var itemValue = Number(data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index]);
  66.                                     var percentValue = (Math.round((itemValue/totalAnswers*100)*10)/10).toFixed(1) + '%';
  67.                                     var label = data.labels[tooltipItem.index] + ': ' + percentValue;
  68.                                     return label;
  69.                                 }
  70.                             }
  71.                     }
  72.                     }
  73.                 });
  74.             </component>
  75.         {% endif %}
  76.     {% endfor %}
  77. {% endif %}
  78. {% if poll.displayType == 'onclick' and answerSaved is not defined %}
  79. </section>
  80. {% endif %}
  81. {% if poll.multiEntry and poll.multiEntryInterval == 'without_limit' %}
  82.     <component is="script">
  83.         function onloadCallbackId{{poll.id}}() {
  84.             grecaptcha.render("recaptcha-{{poll.id}}", {
  85.                 'sitekey': "{{recaptchaSiteKey}}",
  86.                 'callback': function() { recaptchaSuccessId{{poll.id}}({{poll.id}}) },
  87.                 'expired-callback': function() { recaptchaExpiresId{{poll.id}}({{poll.id}}) }
  88.             });
  89.         }
  90.         function recaptchaSuccessId{{poll.id}}(id) {
  91.             document.getElementById(id).removeAttribute('disabled');
  92.         }
  93.         function recaptchaExpiresId{{poll.id}}(id) {
  94.             document.getElementById(id).setAttribute('disabled', true);
  95.         }
  96.     </component>
  97.     <component is="script" src="https://www.google.com/recaptcha/api.js?onload=onloadCallbackId{{poll.id}}&render=explicit&hl=sk" async defer></component>
  98. {% endif %}