☰

Greasy Fork is available in English.

Koalitionenrechner - wahlrecht.de

8/22/2021, 6:38:16 PM

Verze ze dne 22. 08. 2021. Zobrazit nejnovější verzi.

  1. // ==UserScript==
  2. // @name        Koalitionenrechner - wahlrecht.de
  3. // @namespace   Violentmonkey Scripts
  4. // @match       https://www.wahlrecht.de/umfragen/
  5. // @grant       none
  6. // @version     1.0
  7. // @author      Sidem
  8. // @description 8/22/2021, 6:38:16 PM
  9. // ==/UserScript==
  10. /* jshint esversion: 6 */
  11.  
  12.  
  13. window.addEventListener('load', function () {
  14.   
  15.   function generatePowerSet(array) {
  16.     var result = [];
  17.     result.push([]);
  18.  
  19.     for (var i = 1; i < (1 << array.length); i++) {
  20.       var subset = [];
  21.       for (var j = 0; j < array.length; j++)
  22.         if (i & (1 << j))
  23.           subset.push(array[j]);
  24.  
  25.       result.push(subset);
  26.     }
  27.  
  28.     return result;
  29.   }
  30.   
  31. let data = [
  32.             {name:'CDU/CSU', votes:12000},
  33.             {name:'SPD', votes:15000},
  34.             {name:'GRÜNE', votes:5500},
  35.             {name:'FDP', votes:12800},
  36.             {name:'LINKE', votes:16000},
  37.             {name:'AfD', votes:8800},
  38.             {name:'Sonstige', votes:1800}
  39.         ];
  40. let names = ['CDU/CSU','SPD','GRÜNE','FDP','LINKE','AfD','Sonstige'];
  41. let partyIcons = ['⚫️','🔴','🟢','🟡','🟣','🔵'];
  42. let allPossibleCoalitions = generatePowerSet(partyIcons);
  43. allPossibleCoalitions = allPossibleCoalitions.filter((el) => { return (el.length > 1 && el.length < 4)}); // filter to only 2-4 party coalitions
  44. let coalitions = allPossibleCoalitions.filter((el) => { // filter exclusions, eg far right wont have a coalition with far left
  45.   if (el.includes('🔵') && el.includes('🟢')) return false;
  46.   if (el.includes('🔵') && el.includes('🔴')) return false;
  47.   if (el.includes('🔵') && el.includes('🟣')) return false;
  48.   if (el.includes('🟣') && el.includes('🟡')) return false;
  49.   if (el.includes('🟣') && el.includes('⚫️')) return false;
  50.   return true;
  51. });
  52.  
  53. const getPartyColor = (name) => {
  54.     switch(name) {
  55.       case 'CDU/CSU':
  56.         return '#000000';
  57.       case 'SPD':
  58.         return '#FF0000';
  59.       case 'GRÜNE':
  60.         return '#00FF00';
  61.       case 'FDP':
  62.         return '#FFFF00';
  63.       case 'LINKE':
  64.         return '#FF0088';
  65.       case 'AfD':
  66.         return '#1199FF';
  67.       case 'Sonstige':
  68.         return '#888888';
  69.       default:
  70.         return '#888888';
  71.     }
  72. };
  73.   
  74.   const getColorIcon = (name) => {
  75.     switch(name) {
  76.       case 'CDU/CSU':
  77.         return '⚫️';
  78.       case 'SPD':
  79.         return '🔴';
  80.       case 'GRÜNE':
  81.         return '🟢';
  82.       case 'FDP':
  83.         return '🟡';
  84.       case 'LINKE':
  85.         return '🟣';
  86.       case 'AfD':
  87.         return '🔵';
  88.       case 'Sonstige':
  89.         return '⚪️';
  90.       default:
  91.         return '⚪️';
  92.     }
  93. };
  94.   
  95.   function setChart() {
  96.     let canvas = document.getElementById('c');
  97.     let ctx = canvas.getContext('2d');
  98.     canvas.width = 500;
  99.     canvas.height = 400;
  100.     let total = data.reduce( (ttl, party) => {
  101.         return ttl + party.votes
  102.     }, 0);
  103.     let startAngle = 0; 
  104.     let radius = 100;
  105.     let cx = canvas.width/2;
  106.     let cy = canvas.height/2;
  107.  
  108.     data.forEach( party => {
  109.         //set the styles before beginPath
  110.         ctx.fillStyle = getPartyColor(party.name);
  111.         ctx.lineWidth = 1;
  112.         ctx.strokeStyle = '#333';
  113.         ctx.beginPath();
  114.         //console.log(total, party.votes, party.votes/total);
  115.         // draw the pie wedges
  116.         let endAngle = ((party.votes / total) * Math.PI * 2) + startAngle;
  117.         ctx.moveTo(cx, cy);
  118.         ctx.arc(cx, cy, radius, startAngle, endAngle, false);
  119.         ctx.lineTo(cx, cy);
  120.         ctx.fill();
  121.         ctx.stroke();
  122.         ctx.closePath();
  123.  
  124.         // add the labels
  125.         ctx.beginPath();
  126.         ctx.font = '20px Helvetica, Calibri';
  127.         ctx.textAlign = 'center';
  128.         ctx.fillStyle = 'rebeccapurple';
  129.         // midpoint between the two angles
  130.         // 1.5 * radius is the length of the Hypotenuse
  131.         let theta = (startAngle + endAngle) / 2;
  132.         let deltaY = Math.sin(theta) * 1.5 * radius;
  133.         let deltaX = Math.cos(theta) * 1.5 * radius;
  134.         /***
  135.         SOH  - sin(angle) = opposite / hypotenuse
  136.                           = opposite / 1px
  137.         CAH  - cos(angle) = adjacent / hypotenuse
  138.                           = adjacent / 1px
  139.         TOA
  140.  
  141.         ***/
  142.         ctx.fillText(party.name, deltaX+cx, deltaY+cy);
  143.         ctx.closePath();
  144.  
  145.         startAngle = endAngle;
  146.     });
  147.   }
  148.   
  149.   function getCoalitions() {
  150.     let str = "";
  151.     let currentCoalitionVotes = 0;
  152.     let results = [];
  153.     for (let coalition of coalitions) {
  154.       let currentCoalitionVotes = 0;
  155.       for (let p of coalition) {
  156.         currentCoalitionVotes += getPartyVotes(p);
  157.       }
  158.       results.push({coalition:coalition.join(""), votes: currentCoalitionVotes});
  159.     }
  160.     results.sort((a,b) => {return b.votes - a.votes;});
  161.     for (let c of results) str += c.coalition + ": \t\t" + c.votes.toFixed(1) + "%\n";
  162.     coalitionBox.innerText = str;
  163.   }
  164.   
  165.   function clean(str) {
  166.     return parseFloat(str.replace(',', '.').replace(' %', ''));
  167.   }
  168.   
  169.   function getPartyVotes(identifier) {
  170.     for (let p of data) {
  171.       if (p.name == identifier || p.color == identifier) {
  172.         return p.votes;
  173.       }
  174.     }
  175.     return 0;
  176.   }
  177.   
  178.   let getChart = (e) => {
  179.     let colDataElements = document.getElementsByClassName(e.target.classList[e.target.classList.length-1]);
  180.     data = [];
  181.     let i = 0;
  182.     for (let el of colDataElements) {
  183.       data.push({name:names[i], votes:clean(el.innerText), color: getColorIcon(names[i])})
  184.       i++;
  185.     }
  186.     data.sort((a,b) => {return b.votes - a.votes;});
  187.     setChart();
  188.     getCoalitions();
  189.   };
  190.   
  191.   let partyIds = ["cdu","spd","gru","fdp","lin","afd","son"];
  192.   let rows = document.getElementsByTagName('tr');
  193.   for (let row of rows) {
  194.     if (partyIds.includes(row.id)) {
  195.       let numbers = row.getElementsByTagName('td');
  196.       let n = 0;
  197.       for (let number of numbers) {
  198.         if (n != 0 && n != 9) {
  199.           number.classList.add('col-'+n);
  200.           number.onclick = getChart;
  201.           number.style.cursor = 'pointer';
  202.           number.addEventListener("mouseenter", function( e ) {
  203.             let columnClass = e.target.classList[e.target.classList.length-1];
  204.             let column = document.getElementsByClassName(columnClass);
  205.             for (let item of column) {
  206.               item.style.backgroundColor = 'aqua';
  207.             }
  208.           });
  209.           number.addEventListener("mouseleave", function( e ) {
  210.             let columnClass = e.target.classList[e.target.classList.length-1];
  211.             let column = document.getElementsByClassName(columnClass);
  212.             for (let item of column) {
  213.               item.style.backgroundColor = 'white';
  214.             }
  215.           });
  216.         }
  217.         n++;
  218.       }
  219.     }
  220.   }
  221.   
  222.   
  223.   let canvas = document.createElement('canvas');
  224.   canvas.setAttribute('id','c');
  225.   let info = document.getElementById('info');
  226.   info.parentNode.insertBefore(canvas, info);
  227.   let coalitionBox = document.createElement('div');
  228.   coalitionBox.setAttribute('id','coalitionBox');
  229.   coalitionBox.style.marginRight = '270px';
  230.   coalitionBox.style.marginTop = '40px';
  231.   coalitionBox.style.float = 'right';
  232.   info.parentNode.insertBefore(coalitionBox, info);
  233.   
  234. }, false);