From f51f5b70c4febcffca1f8230e46946f5c8eb0086 Mon Sep 17 00:00:00 2001 From: lrusch Date: Sun, 1 Aug 2021 14:07:57 +0200 Subject: [PATCH 1/2] =?UTF-8?q?output.js=20fnJumpToQuestionNumber=20-=20fn?= =?UTF-8?q?GetJumpToQuestionColorForPosition=20in=20Schleife=201=20benutzt?= =?UTF-8?q?=20und=202.=20Schleife=20gel=C3=B6scht.=20-=20Fettmarkierung=20?= =?UTF-8?q?wird=20dort=20auch=20hinzugef=C3=BCgt?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit general.js fnGetJumpToQuestionColorForPosition - Funtion erstellt - fnTransformPositionToColor entfernt navigation.css - Klassen aus fnGetJumpToQuestionColorForPosition hinterlegt und an Array-Farben angepasst - Border-Farbe auf blau geändert definition.js - navigation.css aufgenommen --- data/definition.js | 2 +- styles/navigation.css | 27 ++ system/general.js | 633 ++++++++++++++++++++---------------------- system/output.js | 27 +- 4 files changed, 327 insertions(+), 362 deletions(-) create mode 100644 styles/navigation.css diff --git a/data/definition.js b/data/definition.js index ff1cea6..cad3411 100755 --- a/data/definition.js +++ b/data/definition.js @@ -305,7 +305,7 @@ var separator = ";"; Please find some examples above. */ -var design = ["default.css","buttons-colors-on.css", "progressbar.css"]; +var design = ["default.css","buttons-colors-on.css", "progressbar.css", "navigation.css"]; /* diff --git a/styles/navigation.css b/styles/navigation.css new file mode 100644 index 0000000..dc686cb --- /dev/null +++ b/styles/navigation.css @@ -0,0 +1,27 @@ +/* JumpToQuestion-table custom classes, which can override default bg-classes */ + +.td-jump-to-question-decline { + background-color: #d9534f !important; +} + +.td-jump-to-question-neutral { + background-color: #f0ad4e !important; +} + +.td-jump-to-question-approve { + background-color: #5cb85c !important; +} + +.td-jump-to-question-skip { + color: #c0c0c0; + background-color: #c0c0c0; +} + +.td-jump-to-question-voting-double { + font-weight: bold; +} + +.td-jump-to-question-current { + border-color: #0050A0 !important; + background-color: #c0c0c0; +} \ No newline at end of file diff --git a/system/general.js b/system/general.js index 5bb06d3..263bebc 100755 --- a/system/general.js +++ b/system/general.js @@ -21,437 +21,394 @@ var arPartyDescription = new Array(); // Beschreibung der Datei var arPartyInternet = new Array(); // Internetseiten der Parteien var arPartyLogosImg = new Array(); // Logos der Parteien -var arSortParties=new Array(); // Nummern der Listen, nach Punkten sortiert +var arSortParties = new Array(); // Nummern der Listen, nach Punkten sortiert -var activeQuestion=0; //aktuell angezeigte Frage (output.js) +var activeQuestion = 0; //aktuell angezeigte Frage (output.js) // Einlesen der CSV-Datei und Weitergabe an Rückgabefunktion "fnCallback" -function fnReadCsv(csvFile,fnCallback) -{ +function fnReadCsv(csvFile, fnCallback) { // http://michaelsoriano.com/working-with-jquerys-ajax-promises-and-deferred-objects/ - $.ajax({ - type: "GET", - url: csvFile, - dataType: "text", - contentType: "application/x-www-form-urlencoded", - error: function(objXML, textStatus, errorThrown) { - console.log("Mat-O-Wahl ERROR - Reading CSV-file \n Code - objXML-Status: "+objXML.status+" \n Code - textStatus: "+textStatus+" \n Code - errorThrown: "+errorThrown+" \n Name and folder of CSV-file should be: "+csvFile+" \n\nPossible solutions: Check for capital letters? OR check the extension of the file (csv / xls / xlsx)? OR is the file in the wrong folder? OR are you working on a local machine :( instead of a server? See documentation on www.mat-o-wahl.de"); - // document.getElementById("descriptionAddonTop").innerHTML("nanu. Da ist etwas schief gegangen.") - $("#descriptionExplanation").css("color","red").css("font-size", "150%") - text = "

Nanu? Da ist etwas schief gegangen. Einige Dateien konnten nicht geladen werden.
Sind Sie ein Besucher der Seite? Dann geben Sie bitte dem Administrator der Webseite Bescheid.
Sind Sie der Administrator? Dann schauen Sie bitte in die Browser-Konsole.

" - text += "

Oh? Something went wrong. Some files couldn't be loaded.
Are you a visitor of this site? Please inform the admin of the site.
Are you the admin? Please check the browser-console.

" - $("#descriptionExplanation").html(text) - } - }) - .done(function(data) { - // console.log('success', data) - console.log("Mat-o-Wahl load: "+csvFile); - fnCallback(data); - }) - .fail(function(xhr) { - console.log('Mat-O-Wahl file error - ', xhr); - }); + $.ajax({ + type: "GET", + url: csvFile, + dataType: "text", + contentType: "application/x-www-form-urlencoded", + error: function (objXML, textStatus, errorThrown) { + console.log("Mat-O-Wahl ERROR - Reading CSV-file \n Code - objXML-Status: " + objXML.status + " \n Code - textStatus: " + textStatus + " \n Code - errorThrown: " + errorThrown + " \n Name and folder of CSV-file should be: " + csvFile + " \n\nPossible solutions: Check for capital letters? OR check the extension of the file (csv / xls / xlsx)? OR is the file in the wrong folder? OR are you working on a local machine :( instead of a server? See documentation on www.mat-o-wahl.de"); + // document.getElementById("descriptionAddonTop").innerHTML("nanu. Da ist etwas schief gegangen.") + $("#descriptionExplanation").css("color", "red").css("font-size", "150%") + text = "

Nanu? Da ist etwas schief gegangen. Einige Dateien konnten nicht geladen werden.
Sind Sie ein Besucher der Seite? Dann geben Sie bitte dem Administrator der Webseite Bescheid.
Sind Sie der Administrator? Dann schauen Sie bitte in die Browser-Konsole.

" + text += "

Oh? Something went wrong. Some files couldn't be loaded.
Are you a visitor of this site? Please inform the admin of the site.
Are you the admin? Please check the browser-console.

" + $("#descriptionExplanation").html(text) + } + }) + .done(function (data) { + // console.log('success', data) + console.log("Mat-o-Wahl load: " + csvFile); + fnCallback(data); + }) + .fail(function (xhr) { + console.log('Mat-O-Wahl file error - ', xhr); + }); } // Anzeige der Fragen (aus fnStart()) -function fnShowQuestions(csvData) -{ - // Einlesen der Fragen ... - // fnSplitLines(csvData,1); - fnTransformCsvToArray(csvData,1) - - // ... und Anzeigen - var questionNumber = -1; - - // v.0.6 - deaktiviert, da nun am Anfang ein Willkommensbildschirm erscheint. - // neu: fnHideWelcomeMessage() - // fnShowQuestionNumber(questionNumber); -} +function fnShowQuestions(csvData) { + // Einlesen der Fragen ... + // fnSplitLines(csvData,1); + fnTransformCsvToArray(csvData, 1) + // ... und Anzeigen + var questionNumber = -1; + + // v.0.6 - deaktiviert, da nun am Anfang ein Willkommensbildschirm erscheint. + // neu: fnHideWelcomeMessage() + // fnShowQuestionNumber(questionNumber); +} // Einlesen der Parteipositionen und Partei-Informationen (aus fnStart()) -function fnReadPositions(csvData) -{ - // Einlesen der Parteipositionen und Vergleichen - // fnSplitLines(csvData,0); - fnTransformCsvToArray(csvData,0) +function fnReadPositions(csvData) { + // Einlesen der Parteipositionen und Vergleichen + // fnSplitLines(csvData,0); + fnTransformCsvToArray(csvData, 0) } // Auswertung (Berechnung) // Gibt ein Array "arResults" zurück für fnEvaluationShort(), fnEvaluationByThesis(), fnEvaluationByParty() und fnReEvaluate(); // Aufruf am Ende aller Fragen in fnShowQuestionNumber() und beim Prüfen auf die "doppelte Wertung" in fnReEvaluate() -function fnEvaluation() -{ - - // Abstimmungsknöpfe u.a. entfernen - $("#sectionDescription").empty().hide(); - $("#sectionShowQuestions").empty().hide(); - $("#sectionVotingButtons").empty().hide(); - $("#sectionNavigation").empty().hide(); - - $("#keepStats").hide(); - - // Anzahl der Fragen bestimmen, da Positions-Array ein Vielfaches aus Fragen * Parteien enthält. +function fnEvaluation() { + + // Abstimmungsknöpfe u.a. entfernen + $("#sectionDescription").empty().hide(); + $("#sectionShowQuestions").empty().hide(); + $("#sectionVotingButtons").empty().hide(); + $("#sectionNavigation").empty().hide(); + + $("#keepStats").hide(); + + // Anzahl der Fragen bestimmen, da Positions-Array ein Vielfaches aus Fragen * Parteien enthält. // var numberOfQuestions = arQuestionsLong.length; // 3 Fragen // var numberOfPositions = arPartyPositions.length; // 12 = 3 Fragen * 4 Parteien - var numberOfQuestions = intQuestions; // 3 Fragen - var numberOfPositions = intQuestions * intParties; // 12 = 3 Fragen * 4 Parteien + var numberOfQuestions = intQuestions; // 3 Fragen + var numberOfPositions = intQuestions * intParties; // 12 = 3 Fragen * 4 Parteien - var indexPartyInArray = -1; // Berechnung der Position des Index der aktuellen Partei - var positionsMatch = 0; // Zaehler fuer gemeinsame Positionen + var indexPartyInArray = -1; // Berechnung der Position des Index der aktuellen Partei + var positionsMatch = 0; // Zaehler fuer gemeinsame Positionen - // var arResults = new Array(); - var arResults = [] + // var arResults = new Array(); + var arResults = [] // for (i = 0; i <= (arPartyFiles.length-1); i++) - for (i = 0; i <= (intParties-1); i++) - { - arResults.push(0); // Array mit leeren Werten füllen - } - - // Vergleichen der Positionen (= Fragen x Parteien) - for (i = 0; i <= (numberOfPositions-1); i++) - { - var modulo = i % numberOfQuestions; // 0=0,3,6,9 ; 1=1,4,7,10 ; 2=2,5,8,11 - if (modulo == 0) - { - indexPartyInArray++; // neue Partei in der Array-Liste - positionsMatch = 0; - } - - // Frage wurde nicht uebersprungen per SKIP (99) oder GEHE ZUR NAECHSTEN FRAGE (-) - if ( (arPersonalPositions[modulo] < 99) ) - { - var faktor=1; // Faktor ist 1 normal und 2, wenn Frage doppelt gewertet werden soll - if(arVotingDouble[modulo]) - {faktor=2;} - - // Bei Uebereinstimmung der persönlichen Meinung (1,0,-1) mit Partei-Antwort (1,0-1), den Zaehler (Anzahl Übereinstimmungen) um eins erhoehen - if (arPartyPositions[i] == arPersonalPositions[modulo]) - { - positionsMatch+=faktor; - arResults[indexPartyInArray] = positionsMatch; - - } - // Eigene Meinung ist neutral ODER Partei ist neutral -> 0,5 Punkte vergeben - else if ( (arPersonalPositions[modulo] == 0) || (arPartyPositions[i] == 0) ) - { - positionsMatch+=0.5*faktor; - arResults[indexPartyInArray] = positionsMatch; - - } // end: if arPartyPosition-i = arPersonalPosition - } // end: Frage nicht uebersprungen - } // end: for numberOfQuestions - - -/* - // Wenn Nutzer eingewilligt hat ... - if ( $("#keepStatsCheckbox").prop("checked")==1) - { - // Sende Auswertung an Server - fnSendResults(arResults, arPersonalPositions); - } - else - { - } -*/ + for (i = 0; i <= (intParties - 1); i++) { + arResults.push(0); // Array mit leeren Werten füllen + } + + // Vergleichen der Positionen (= Fragen x Parteien) + for (i = 0; i <= (numberOfPositions - 1); i++) { + var modulo = i % numberOfQuestions; // 0=0,3,6,9 ; 1=1,4,7,10 ; 2=2,5,8,11 + if (modulo == 0) { + indexPartyInArray++; // neue Partei in der Array-Liste + positionsMatch = 0; + } + + // Frage wurde nicht uebersprungen per SKIP (99) oder GEHE ZUR NAECHSTEN FRAGE (-) + if ((arPersonalPositions[modulo] < 99)) { + var faktor = 1; // Faktor ist 1 normal und 2, wenn Frage doppelt gewertet werden soll + if (arVotingDouble[modulo]) { + faktor = 2; + } + + // Bei Uebereinstimmung der persönlichen Meinung (1,0,-1) mit Partei-Antwort (1,0-1), den Zaehler (Anzahl Übereinstimmungen) um eins erhoehen + if (arPartyPositions[i] == arPersonalPositions[modulo]) { + positionsMatch += faktor; + arResults[indexPartyInArray] = positionsMatch; + + } + // Eigene Meinung ist neutral ODER Partei ist neutral -> 0,5 Punkte vergeben + else if ((arPersonalPositions[modulo] == 0) || (arPartyPositions[i] == 0)) { + positionsMatch += 0.5 * faktor; + arResults[indexPartyInArray] = positionsMatch; + + } // end: if arPartyPosition-i = arPersonalPosition + } // end: Frage nicht uebersprungen + } // end: for numberOfQuestions + + + /* + // Wenn Nutzer eingewilligt hat ... + if ( $("#keepStatsCheckbox").prop("checked")==1) + { + // Sende Auswertung an Server + fnSendResults(arResults, arPersonalPositions); + } + else + { + } + */ // $("#keepStats").hide().empty(); // console.log(arResults) - return arResults; + return arResults; } // Senden der persoenlichen Ergebnisse an den Server (nach Einwilligung) // Aufruf aus fnEvaluation() -function fnSendResults(arResults, arPersonalPositions) -{ - // Korrektur der Parteiposition (-1,0,1) mit den Informationen aus der doppelten Wertung (-2,-1,0,1,2) - // Marius Nisslmueller, Bad Honnef, Juni 2020 - arPersonalPositionsForStats = arPersonalPositions.slice(); // Damit arPersonalPositions nicht verändert wird - for(let i=0; i 4) && (modulo <= (intQuestions+4) ) ) - { - // Positionen und Erklärungen - arPartyPositions.push(valueOne); // -1,0,1 - arPartyOpinions.push(valueTwo); // Erklärung zur Zahl - } - else - { - // nothing to do. Just empty lines in the CSV-file - } - } // end: if-else modus == 1 - } // end: for + } else if ((modulo == 3) && (valueTwo != "undefined")) { + // Webseite der Partei + arPartyInternet.push(valueTwo) + } else if ((modulo == 4) && (valueTwo != "undefined")) { + // Logo der Partei + arPartyLogosImg.push(valueTwo) + } else if ((modulo > 4) && (modulo <= (intQuestions + 4))) { + // Positionen und Erklärungen + arPartyPositions.push(valueOne); // -1,0,1 + arPartyOpinions.push(valueTwo); // Erklärung zur Zahl + } else { + // nothing to do. Just empty lines in the CSV-file + } + } // end: if-else modus == 1 + } // end: for } // end: function // v.0.3 NEU // ersetzt die Position (-1, 0, 1) mit dem passenden Button -function fnTransformPositionToButton(position) -{ - var arButtons = new Array("btn-danger","btn-warning","btn-success") - var positionButton = "btn-default"; - for (z = -1; z <= 1; z++) - { - if (z == position) - { - positionButton = arButtons[(z+1)]; - } - } - return positionButton; +function fnTransformPositionToButton(position) { + var arButtons = new Array("btn-danger", "btn-warning", "btn-success") + var positionButton = "btn-default"; + for (z = -1; z <= 1; z++) { + if (z == position) { + positionButton = arButtons[(z + 1)]; + } + } + return positionButton; } // v.0.3 NEU // ersetzt die Position (-1, 0, 1) mit dem passenden Icon -function fnTransformPositionToIcon(position) -{ - var arIcons = new Array("✖","◯","✔") - var positionIcon = "↷"; - for (z = -1; z <= 1; z++) - { - if (z == position) - { - positionIcon = arIcons[(z+1)]; - } - } - return positionIcon; +function fnTransformPositionToIcon(position) { + var arIcons = new Array("✖", "◯", "✔") + var positionIcon = "↷"; + for (z = -1; z <= 1; z++) { + if (z == position) { + positionIcon = arIcons[(z + 1)]; + } + } + return positionIcon; } -// ersetzt die Partei-Position (-1, 0, 1) mit der passenden Farbe -function fnTransformPositionToColor(position) -{ - // red, yellow, green - "#ff0000","#ffff00","#00ff00" - // Bootstrap-colors: https://github.com/twbs/bootstrap/blob/master/dist/css/bootstrap.css - var arColors = new Array("#d9534f","#f0ad4e","#5cb85c") - var positionColor = "#c0c0c0"; - for (z = -1; z <= 1; z++) - { - if (z == position) - { - positionColor = arColors[(z+1)]; - } - } - return positionColor; - +// Gibt die entsprechenden css-Klassen für Partei-Position (-1, 0, 1) und default zurück. +function fnGetJumpToQuestionColorForPosition(position) { + console.log("position", position); + switch (position) { + case -1: + return "bg-danger td-jump-to-question-decline"; + case 0: + return "bg-warning td-jump-to-question-neutral"; + case 1: + return "bg-success td-jump-to-question-approve"; + default: + return "td-jump-to-question-skip"; + } } // ersetzt die Partei-Position (-1, 0, 1) mit dem passenden Text -function fnTransformPositionToText(position) -{ - var arText = new Array("[-]","[o]","[+]") - var positionText = "[/]"; - for (z = -1; z <= 1; z++) - { - if (z == position) - { - positionText = arText[(z+1)]; - } - } - return positionText; - +function fnTransformPositionToText(position) { + var arText = new Array("[-]", "[o]", "[+]") + var positionText = "[/]"; + for (z = -1; z <= 1; z++) { + if (z == position) { + positionText = arText[(z + 1)]; + } + } + return positionText; + } // Gibt ein Bild/CSS-Klasse für den Balken in der Auswertung entsprechend der Prozentzahl Uebereinstimmung zurück -function fnBarImage(percent) -{ - // bis v.0.3 mit PNG-Bildern, danach mit farblicher Bootstrap-Progressbar - - if (percent <= 33) { - // var barImage = "contra_px.png"; - var barImage = "bg-danger"; - } - else if (percent <= 66) { - // var barImage = "neutral_px.png"; - var barImage = "bg-warning"; - } - else { - // var barImage = "pro_px.png"; - var barImage = "bg-success"; - } - - return barImage; +function fnBarImage(percent) { + // bis v.0.3 mit PNG-Bildern, danach mit farblicher Bootstrap-Progressbar + + if (percent <= 33) { + // var barImage = "contra_px.png"; + var barImage = "bg-danger"; + } else if (percent <= 66) { + // var barImage = "neutral_px.png"; + var barImage = "bg-warning"; + } else { + // var barImage = "pro_px.png"; + var barImage = "bg-success"; + } + + return barImage; } // 02/2015 BenKob (doppelte Wertung) -function fnToggleSelfPosition(i) -{ - arPersonalPositions[i]--; - if (arPersonalPositions[i]==-2) - {arPersonalPositions[i]=99} - if (arPersonalPositions[i]==98) - {arPersonalPositions[i]=1} +function fnToggleSelfPosition(i) { + arPersonalPositions[i]--; + if (arPersonalPositions[i] == -2) { + arPersonalPositions[i] = 99 + } + if (arPersonalPositions[i] == 98) { + arPersonalPositions[i] = 1 + } // var positionImage = fnTransformPositionToImage(arPersonalPositions[i]); - var positionButton = fnTransformPositionToButton(arPersonalPositions[i]); - var positionIcon = fnTransformPositionToIcon(arPersonalPositions[i]); - // var positionColor = fnTransformPositionToColor(arPersonalPositions[i]); - var positionText = fnTransformPositionToText(arPersonalPositions[i]); - - // $("#selfPosition"+i).attr("src", "img/"+positionImage); - $(".selfPosition"+i).removeClass("btn-danger btn-warning btn-success btn-default").addClass(positionButton); - $(".selfPosition"+i).html(positionIcon); - $(".selfPosition"+i).attr("alt", positionText); - $(".selfPosition"+i).attr("title", positionText); - // $(".positionRow"+i).css("border","1px solid "+positionColor); + var positionButton = fnTransformPositionToButton(arPersonalPositions[i]); + var positionIcon = fnTransformPositionToIcon(arPersonalPositions[i]); + var positionText = fnTransformPositionToText(arPersonalPositions[i]); + + // $("#selfPosition"+i).attr("src", "img/"+positionImage); + $(".selfPosition" + i).removeClass("btn-danger btn-warning btn-success btn-default").addClass(positionButton); + $(".selfPosition" + i).html(positionIcon); + $(".selfPosition" + i).attr("alt", positionText); + $(".selfPosition" + i).attr("title", positionText); + // $(".positionRow"+i).css("border","1px solid "+positionColor); // console.log("toggle funktion i: "+i) - fnReEvaluate(); + fnReEvaluate(); } // 02/2015 BenKob (doppelte Wertung) -function fnToggleDouble(i) -{ - arVotingDouble[i]=!arVotingDouble[i]; - if(arVotingDouble[i]) - { - // $("#doubleIcon"+i).attr("src","img/double-yes_icon.png"); - $("#doubleIcon"+i).removeClass("btn-outline-dark").addClass("btn-dark"); - $("#doubleIcon"+i).attr("title",TEXT_ANSWER_DOUBLE); - } - else - { - // $("#doubleIcon"+i).attr("src","img/double-no_icon.png"); - $("#doubleIcon"+i).removeClass("btn-dark").addClass("btn-outline-dark"); - $("#doubleIcon"+i).attr("title",TEXT_ANSWER_NORMAL); - } - fnReEvaluate(); +function fnToggleDouble(i) { + arVotingDouble[i] = !arVotingDouble[i]; + if (arVotingDouble[i]) { + // $("#doubleIcon"+i).attr("src","img/double-yes_icon.png"); + $("#doubleIcon" + i).removeClass("btn-outline-dark").addClass("btn-dark"); + $("#doubleIcon" + i).attr("title", TEXT_ANSWER_DOUBLE); + } else { + // $("#doubleIcon"+i).attr("src","img/double-no_icon.png"); + $("#doubleIcon" + i).removeClass("btn-dark").addClass("btn-outline-dark"); + $("#doubleIcon" + i).attr("title", TEXT_ANSWER_NORMAL); + } + fnReEvaluate(); } - // vanilla JavaScript FadeIn / FadeOut // Modus = display: "none / block" ändern (0 = nein, 1 = ja) function fnFadeIn(el, time, modus) { - // Default FadeIn / FadeOut-Time - if (!time) {time = 500;} + // Default FadeIn / FadeOut-Time + if (!time) { + time = 500; + } - // Loading CSS - el.style.animation = "myFadeIn "+time+"ms 1" - el.style.opacity = 1; + // Loading CSS + el.style.animation = "myFadeIn " + time + "ms 1" + el.style.opacity = 1; - if (modus == 1) { - el.style.display = "" - el.style.visibility = "" - } + if (modus == 1) { + el.style.display = "" + el.style.visibility = "" + } } // vanilla JavaScript FadeIn / FadeOut // Modus = visibility show / hidden ändern (0 = nein, 1 = ja) function fnFadeOut(el, time, modus) { - // Default FadeIn / FadeOut-Time - if (!time) {time = 500;} - - // Loading CSS - el.style.animation = "myFadeOut "+time+"ms 1" - el.style.opacity = 0; - - // hide element from DOM AFTER opacity is set to 0 (setTimeout) - if (modus == 1) { - window.setTimeout(function() { - el.style.display = "none" - el.style.visibility = "hidden" - }, (time-50)); - } + // Default FadeIn / FadeOut-Time + if (!time) { + time = 500; + } + + // Loading CSS + el.style.animation = "myFadeOut " + time + "ms 1" + el.style.opacity = 0; + + // hide element from DOM AFTER opacity is set to 0 (setTimeout) + if (modus == 1) { + window.setTimeout(function () { + el.style.display = "none" + el.style.visibility = "hidden" + }, (time - 50)); + } } diff --git a/system/output.js b/system/output.js index 8a36286..03a832f 100755 --- a/system/output.js +++ b/system/output.js @@ -296,38 +296,19 @@ function fnJumpToQuestionNumber(questionNumber) var tableContent = ""; for (i = 1; i <= arQuestionsLong.length; i++) { + let jumpToQuestionClass = i-1 === questionNumber ? "td-jump-to-question-current" : fnGetJumpToQuestionColorForPosition(arPersonalPositions[(i-1)]); + const votingDoubleClass = arVotingDouble[(i-1)] ? " td-jump-to-question-voting-double" : ""; + jumpToQuestionClass = jumpToQuestionClass + votingDoubleClass; var modulo = i % questionsPerLine; // neue Zeile if (modulo == 1) { tableContent += ""; } - tableContent += ""; if (modulo == 0) { tableContent += ""; } } tableContent += "
"; + tableContent += ""; tableContent += ""+i+" "; tableContent += "
"; $("#navigationJumpToQuestion").append(tableContent).fadeIn(500); - - // alte Meinungen farblich hervorheben und aktuelle Frage markieren - for (i = 1; i <= arQuestionsLong.length; i++) - { - // beantwortete Fragen farblich markieren - var positionColor = fnTransformPositionToColor(arPersonalPositions[(i-1)]); - $("#jumpToQuestionNr"+i+"").css("border-color", positionColor); - - // aktuelle Frage markieren - if ((i-1) <= questionNumber) - { -// $("#jumpToQuestionNr"+i+"").css("background-color", middleColor); // alt: graue "Mittelfarbe" als Hintergrund - $("#jumpToQuestionNr"+i+"").css("background-color", positionColor); // neu (0.2.3.2) Farbe der Auswahl (rot/gruen/...) - } - - if (arVotingDouble[(i-1)]) - { - $("#jumpToQuestionNr"+i+"").css("font-weight","bold"); - } - - } - } // Anzeige der Ergebnisse - zusammengefasst (Prozentwerte) - nur Parteien From 8da10713ef361a8a8862bdeb7a8ccc35fa87e834 Mon Sep 17 00:00:00 2001 From: lrusch Date: Sun, 1 Aug 2021 14:19:48 +0200 Subject: [PATCH 2/2] =?UTF-8?q?output.js=20fnJumpToQuestionNumber=20-=20fn?= =?UTF-8?q?GetJumpToQuestionColorForPosition=20in=20Schleife=201=20benutzt?= =?UTF-8?q?=20und=202.=20Schleife=20gel=C3=B6scht.=20-=20Fettmarkierung=20?= =?UTF-8?q?wird=20dort=20auch=20hinzugef=C3=BCgt?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit general.js fnGetJumpToQuestionColorForPosition - Funtion erstellt - fnTransformPositionToColor entfernt navigation.css - Klassen aus fnGetJumpToQuestionColorForPosition hinterlegt und an Array-Farben angepasst - Border-Farbe auf blau geändert definition.js - navigation.css aufgenommen --- system/general.js | 582 +++++++++++++++++++++++++--------------------- 1 file changed, 311 insertions(+), 271 deletions(-) diff --git a/system/general.js b/system/general.js index 263bebc..21686cc 100755 --- a/system/general.js +++ b/system/general.js @@ -21,265 +21,298 @@ var arPartyDescription = new Array(); // Beschreibung der Datei var arPartyInternet = new Array(); // Internetseiten der Parteien var arPartyLogosImg = new Array(); // Logos der Parteien -var arSortParties = new Array(); // Nummern der Listen, nach Punkten sortiert +var arSortParties=new Array(); // Nummern der Listen, nach Punkten sortiert -var activeQuestion = 0; //aktuell angezeigte Frage (output.js) +var activeQuestion=0; //aktuell angezeigte Frage (output.js) // Einlesen der CSV-Datei und Weitergabe an Rückgabefunktion "fnCallback" -function fnReadCsv(csvFile, fnCallback) { +function fnReadCsv(csvFile,fnCallback) +{ // http://michaelsoriano.com/working-with-jquerys-ajax-promises-and-deferred-objects/ - $.ajax({ - type: "GET", - url: csvFile, - dataType: "text", - contentType: "application/x-www-form-urlencoded", - error: function (objXML, textStatus, errorThrown) { - console.log("Mat-O-Wahl ERROR - Reading CSV-file \n Code - objXML-Status: " + objXML.status + " \n Code - textStatus: " + textStatus + " \n Code - errorThrown: " + errorThrown + " \n Name and folder of CSV-file should be: " + csvFile + " \n\nPossible solutions: Check for capital letters? OR check the extension of the file (csv / xls / xlsx)? OR is the file in the wrong folder? OR are you working on a local machine :( instead of a server? See documentation on www.mat-o-wahl.de"); - // document.getElementById("descriptionAddonTop").innerHTML("nanu. Da ist etwas schief gegangen.") - $("#descriptionExplanation").css("color", "red").css("font-size", "150%") - text = "

Nanu? Da ist etwas schief gegangen. Einige Dateien konnten nicht geladen werden.
Sind Sie ein Besucher der Seite? Dann geben Sie bitte dem Administrator der Webseite Bescheid.
Sind Sie der Administrator? Dann schauen Sie bitte in die Browser-Konsole.

" - text += "

Oh? Something went wrong. Some files couldn't be loaded.
Are you a visitor of this site? Please inform the admin of the site.
Are you the admin? Please check the browser-console.

" - $("#descriptionExplanation").html(text) - } - }) - .done(function (data) { - // console.log('success', data) - console.log("Mat-o-Wahl load: " + csvFile); - fnCallback(data); - }) - .fail(function (xhr) { - console.log('Mat-O-Wahl file error - ', xhr); - }); + $.ajax({ + type: "GET", + url: csvFile, + dataType: "text", + contentType: "application/x-www-form-urlencoded", + error: function(objXML, textStatus, errorThrown) { + console.log("Mat-O-Wahl ERROR - Reading CSV-file \n Code - objXML-Status: "+objXML.status+" \n Code - textStatus: "+textStatus+" \n Code - errorThrown: "+errorThrown+" \n Name and folder of CSV-file should be: "+csvFile+" \n\nPossible solutions: Check for capital letters? OR check the extension of the file (csv / xls / xlsx)? OR is the file in the wrong folder? OR are you working on a local machine :( instead of a server? See documentation on www.mat-o-wahl.de"); + // document.getElementById("descriptionAddonTop").innerHTML("nanu. Da ist etwas schief gegangen.") + $("#descriptionExplanation").css("color","red").css("font-size", "150%") + text = "

Nanu? Da ist etwas schief gegangen. Einige Dateien konnten nicht geladen werden.
Sind Sie ein Besucher der Seite? Dann geben Sie bitte dem Administrator der Webseite Bescheid.
Sind Sie der Administrator? Dann schauen Sie bitte in die Browser-Konsole.

" + text += "

Oh? Something went wrong. Some files couldn't be loaded.
Are you a visitor of this site? Please inform the admin of the site.
Are you the admin? Please check the browser-console.

" + $("#descriptionExplanation").html(text) + } + }) + .done(function(data) { + // console.log('success', data) + console.log("Mat-o-Wahl load: "+csvFile); + fnCallback(data); + }) + .fail(function(xhr) { + console.log('Mat-O-Wahl file error - ', xhr); + }); } // Anzeige der Fragen (aus fnStart()) -function fnShowQuestions(csvData) { - // Einlesen der Fragen ... - // fnSplitLines(csvData,1); - fnTransformCsvToArray(csvData, 1) - - // ... und Anzeigen - var questionNumber = -1; - - // v.0.6 - deaktiviert, da nun am Anfang ein Willkommensbildschirm erscheint. - // neu: fnHideWelcomeMessage() - // fnShowQuestionNumber(questionNumber); +function fnShowQuestions(csvData) +{ + // Einlesen der Fragen ... + // fnSplitLines(csvData,1); + fnTransformCsvToArray(csvData,1) + + // ... und Anzeigen + var questionNumber = -1; + + // v.0.6 - deaktiviert, da nun am Anfang ein Willkommensbildschirm erscheint. + // neu: fnHideWelcomeMessage() + // fnShowQuestionNumber(questionNumber); } + // Einlesen der Parteipositionen und Partei-Informationen (aus fnStart()) -function fnReadPositions(csvData) { - // Einlesen der Parteipositionen und Vergleichen - // fnSplitLines(csvData,0); - fnTransformCsvToArray(csvData, 0) +function fnReadPositions(csvData) +{ + // Einlesen der Parteipositionen und Vergleichen + // fnSplitLines(csvData,0); + fnTransformCsvToArray(csvData,0) } // Auswertung (Berechnung) // Gibt ein Array "arResults" zurück für fnEvaluationShort(), fnEvaluationByThesis(), fnEvaluationByParty() und fnReEvaluate(); // Aufruf am Ende aller Fragen in fnShowQuestionNumber() und beim Prüfen auf die "doppelte Wertung" in fnReEvaluate() -function fnEvaluation() { +function fnEvaluation() +{ - // Abstimmungsknöpfe u.a. entfernen - $("#sectionDescription").empty().hide(); - $("#sectionShowQuestions").empty().hide(); - $("#sectionVotingButtons").empty().hide(); - $("#sectionNavigation").empty().hide(); + // Abstimmungsknöpfe u.a. entfernen + $("#sectionDescription").empty().hide(); + $("#sectionShowQuestions").empty().hide(); + $("#sectionVotingButtons").empty().hide(); + $("#sectionNavigation").empty().hide(); - $("#keepStats").hide(); + $("#keepStats").hide(); - // Anzahl der Fragen bestimmen, da Positions-Array ein Vielfaches aus Fragen * Parteien enthält. + // Anzahl der Fragen bestimmen, da Positions-Array ein Vielfaches aus Fragen * Parteien enthält. // var numberOfQuestions = arQuestionsLong.length; // 3 Fragen // var numberOfPositions = arPartyPositions.length; // 12 = 3 Fragen * 4 Parteien - var numberOfQuestions = intQuestions; // 3 Fragen - var numberOfPositions = intQuestions * intParties; // 12 = 3 Fragen * 4 Parteien + var numberOfQuestions = intQuestions; // 3 Fragen + var numberOfPositions = intQuestions * intParties; // 12 = 3 Fragen * 4 Parteien - var indexPartyInArray = -1; // Berechnung der Position des Index der aktuellen Partei - var positionsMatch = 0; // Zaehler fuer gemeinsame Positionen + var indexPartyInArray = -1; // Berechnung der Position des Index der aktuellen Partei + var positionsMatch = 0; // Zaehler fuer gemeinsame Positionen - // var arResults = new Array(); - var arResults = [] + // var arResults = new Array(); + var arResults = [] // for (i = 0; i <= (arPartyFiles.length-1); i++) - for (i = 0; i <= (intParties - 1); i++) { - arResults.push(0); // Array mit leeren Werten füllen - } - - // Vergleichen der Positionen (= Fragen x Parteien) - for (i = 0; i <= (numberOfPositions - 1); i++) { - var modulo = i % numberOfQuestions; // 0=0,3,6,9 ; 1=1,4,7,10 ; 2=2,5,8,11 - if (modulo == 0) { - indexPartyInArray++; // neue Partei in der Array-Liste - positionsMatch = 0; - } - - // Frage wurde nicht uebersprungen per SKIP (99) oder GEHE ZUR NAECHSTEN FRAGE (-) - if ((arPersonalPositions[modulo] < 99)) { - var faktor = 1; // Faktor ist 1 normal und 2, wenn Frage doppelt gewertet werden soll - if (arVotingDouble[modulo]) { - faktor = 2; - } - - // Bei Uebereinstimmung der persönlichen Meinung (1,0,-1) mit Partei-Antwort (1,0-1), den Zaehler (Anzahl Übereinstimmungen) um eins erhoehen - if (arPartyPositions[i] == arPersonalPositions[modulo]) { - positionsMatch += faktor; - arResults[indexPartyInArray] = positionsMatch; - - } - // Eigene Meinung ist neutral ODER Partei ist neutral -> 0,5 Punkte vergeben - else if ((arPersonalPositions[modulo] == 0) || (arPartyPositions[i] == 0)) { - positionsMatch += 0.5 * faktor; - arResults[indexPartyInArray] = positionsMatch; - - } // end: if arPartyPosition-i = arPersonalPosition - } // end: Frage nicht uebersprungen - } // end: for numberOfQuestions - - - /* - // Wenn Nutzer eingewilligt hat ... - if ( $("#keepStatsCheckbox").prop("checked")==1) - { - // Sende Auswertung an Server - fnSendResults(arResults, arPersonalPositions); - } - else - { - } - */ + for (i = 0; i <= (intParties-1); i++) + { + arResults.push(0); // Array mit leeren Werten füllen + } + + // Vergleichen der Positionen (= Fragen x Parteien) + for (i = 0; i <= (numberOfPositions-1); i++) + { + var modulo = i % numberOfQuestions; // 0=0,3,6,9 ; 1=1,4,7,10 ; 2=2,5,8,11 + if (modulo == 0) + { + indexPartyInArray++; // neue Partei in der Array-Liste + positionsMatch = 0; + } + + // Frage wurde nicht uebersprungen per SKIP (99) oder GEHE ZUR NAECHSTEN FRAGE (-) + if ( (arPersonalPositions[modulo] < 99) ) + { + var faktor=1; // Faktor ist 1 normal und 2, wenn Frage doppelt gewertet werden soll + if(arVotingDouble[modulo]) + {faktor=2;} + + // Bei Uebereinstimmung der persönlichen Meinung (1,0,-1) mit Partei-Antwort (1,0-1), den Zaehler (Anzahl Übereinstimmungen) um eins erhoehen + if (arPartyPositions[i] == arPersonalPositions[modulo]) + { + positionsMatch+=faktor; + arResults[indexPartyInArray] = positionsMatch; + + } + // Eigene Meinung ist neutral ODER Partei ist neutral -> 0,5 Punkte vergeben + else if ( (arPersonalPositions[modulo] == 0) || (arPartyPositions[i] == 0) ) + { + positionsMatch+=0.5*faktor; + arResults[indexPartyInArray] = positionsMatch; + + } // end: if arPartyPosition-i = arPersonalPosition + } // end: Frage nicht uebersprungen + } // end: for numberOfQuestions + + +/* + // Wenn Nutzer eingewilligt hat ... + if ( $("#keepStatsCheckbox").prop("checked")==1) + { + // Sende Auswertung an Server + fnSendResults(arResults, arPersonalPositions); + } + else + { + } +*/ // $("#keepStats").hide().empty(); // console.log(arResults) - return arResults; + return arResults; } // Senden der persoenlichen Ergebnisse an den Server (nach Einwilligung) // Aufruf aus fnEvaluation() -function fnSendResults(arResults, arPersonalPositions) { - // Korrektur der Parteiposition (-1,0,1) mit den Informationen aus der doppelten Wertung (-2,-1,0,1,2) - // Marius Nisslmueller, Bad Honnef, Juni 2020 - arPersonalPositionsForStats = arPersonalPositions.slice(); // Damit arPersonalPositions nicht verändert wird - for (let i = 0; i < arPersonalPositionsForStats.length; i++) { - if (arVotingDouble[i]) { - arPersonalPositionsForStats[i] *= 2; - } - } +function fnSendResults(arResults, arPersonalPositions) +{ + // Korrektur der Parteiposition (-1,0,1) mit den Informationen aus der doppelten Wertung (-2,-1,0,1,2) + // Marius Nisslmueller, Bad Honnef, Juni 2020 + arPersonalPositionsForStats = arPersonalPositions.slice(); // Damit arPersonalPositions nicht verändert wird + for(let i=0; i 4) && (modulo <= (intQuestions + 4))) { - // Positionen und Erklärungen - arPartyPositions.push(valueOne); // -1,0,1 - arPartyOpinions.push(valueTwo); // Erklärung zur Zahl - } else { - // nothing to do. Just empty lines in the CSV-file - } - } // end: if-else modus == 1 - } // end: for + } + else if ( (modulo == 3) && (valueTwo != "undefined") ) + { + // Webseite der Partei + arPartyInternet.push(valueTwo) + } + else if ( (modulo == 4) && (valueTwo != "undefined") ) + { + // Logo der Partei + arPartyLogosImg.push(valueTwo) + } + else if ( (modulo > 4) && (modulo <= (intQuestions+4) ) ) + { + // Positionen und Erklärungen + arPartyPositions.push(valueOne); // -1,0,1 + arPartyOpinions.push(valueTwo); // Erklärung zur Zahl + } + else + { + // nothing to do. Just empty lines in the CSV-file + } + } // end: if-else modus == 1 + } // end: for } // end: function // v.0.3 NEU // ersetzt die Position (-1, 0, 1) mit dem passenden Button -function fnTransformPositionToButton(position) { - var arButtons = new Array("btn-danger", "btn-warning", "btn-success") - var positionButton = "btn-default"; - for (z = -1; z <= 1; z++) { - if (z == position) { - positionButton = arButtons[(z + 1)]; - } - } - return positionButton; +function fnTransformPositionToButton(position) +{ + var arButtons = new Array("btn-danger","btn-warning","btn-success") + var positionButton = "btn-default"; + for (z = -1; z <= 1; z++) + { + if (z == position) + { + positionButton = arButtons[(z+1)]; + } + } + return positionButton; } // v.0.3 NEU // ersetzt die Position (-1, 0, 1) mit dem passenden Icon -function fnTransformPositionToIcon(position) { - var arIcons = new Array("✖", "◯", "✔") - var positionIcon = "↷"; - for (z = -1; z <= 1; z++) { - if (z == position) { - positionIcon = arIcons[(z + 1)]; - } - } - return positionIcon; +function fnTransformPositionToIcon(position) +{ + var arIcons = new Array("✖","◯","✔") + var positionIcon = "↷"; + for (z = -1; z <= 1; z++) + { + if (z == position) + { + positionIcon = arIcons[(z+1)]; + } + } + return positionIcon; } // Gibt die entsprechenden css-Klassen für Partei-Position (-1, 0, 1) und default zurück. @@ -299,116 +332,123 @@ function fnGetJumpToQuestionColorForPosition(position) { // ersetzt die Partei-Position (-1, 0, 1) mit dem passenden Text -function fnTransformPositionToText(position) { - var arText = new Array("[-]", "[o]", "[+]") - var positionText = "[/]"; - for (z = -1; z <= 1; z++) { - if (z == position) { - positionText = arText[(z + 1)]; - } - } - return positionText; +function fnTransformPositionToText(position) +{ + var arText = new Array("[-]","[o]","[+]") + var positionText = "[/]"; + for (z = -1; z <= 1; z++) + { + if (z == position) + { + positionText = arText[(z+1)]; + } + } + return positionText; } // Gibt ein Bild/CSS-Klasse für den Balken in der Auswertung entsprechend der Prozentzahl Uebereinstimmung zurück -function fnBarImage(percent) { - // bis v.0.3 mit PNG-Bildern, danach mit farblicher Bootstrap-Progressbar - - if (percent <= 33) { - // var barImage = "contra_px.png"; - var barImage = "bg-danger"; - } else if (percent <= 66) { - // var barImage = "neutral_px.png"; - var barImage = "bg-warning"; - } else { - // var barImage = "pro_px.png"; - var barImage = "bg-success"; - } - - return barImage; +function fnBarImage(percent) +{ + // bis v.0.3 mit PNG-Bildern, danach mit farblicher Bootstrap-Progressbar + + if (percent <= 33) { + // var barImage = "contra_px.png"; + var barImage = "bg-danger"; + } + else if (percent <= 66) { + // var barImage = "neutral_px.png"; + var barImage = "bg-warning"; + } + else { + // var barImage = "pro_px.png"; + var barImage = "bg-success"; + } + + return barImage; } // 02/2015 BenKob (doppelte Wertung) -function fnToggleSelfPosition(i) { - arPersonalPositions[i]--; - if (arPersonalPositions[i] == -2) { - arPersonalPositions[i] = 99 - } - if (arPersonalPositions[i] == 98) { - arPersonalPositions[i] = 1 - } +function fnToggleSelfPosition(i) +{ + arPersonalPositions[i]--; + if (arPersonalPositions[i]==-2) + {arPersonalPositions[i]=99} + if (arPersonalPositions[i]==98) + {arPersonalPositions[i]=1} // var positionImage = fnTransformPositionToImage(arPersonalPositions[i]); - var positionButton = fnTransformPositionToButton(arPersonalPositions[i]); - var positionIcon = fnTransformPositionToIcon(arPersonalPositions[i]); - var positionText = fnTransformPositionToText(arPersonalPositions[i]); - - // $("#selfPosition"+i).attr("src", "img/"+positionImage); - $(".selfPosition" + i).removeClass("btn-danger btn-warning btn-success btn-default").addClass(positionButton); - $(".selfPosition" + i).html(positionIcon); - $(".selfPosition" + i).attr("alt", positionText); - $(".selfPosition" + i).attr("title", positionText); - // $(".positionRow"+i).css("border","1px solid "+positionColor); + var positionButton = fnTransformPositionToButton(arPersonalPositions[i]); + var positionIcon = fnTransformPositionToIcon(arPersonalPositions[i]); + // var positionColor = fnTransformPositionToColor(arPersonalPositions[i]); + var positionText = fnTransformPositionToText(arPersonalPositions[i]); + + // $("#selfPosition"+i).attr("src", "img/"+positionImage); + $(".selfPosition"+i).removeClass("btn-danger btn-warning btn-success btn-default").addClass(positionButton); + $(".selfPosition"+i).html(positionIcon); + $(".selfPosition"+i).attr("alt", positionText); + $(".selfPosition"+i).attr("title", positionText); + // $(".positionRow"+i).css("border","1px solid "+positionColor); // console.log("toggle funktion i: "+i) - fnReEvaluate(); + fnReEvaluate(); } // 02/2015 BenKob (doppelte Wertung) -function fnToggleDouble(i) { - arVotingDouble[i] = !arVotingDouble[i]; - if (arVotingDouble[i]) { - // $("#doubleIcon"+i).attr("src","img/double-yes_icon.png"); - $("#doubleIcon" + i).removeClass("btn-outline-dark").addClass("btn-dark"); - $("#doubleIcon" + i).attr("title", TEXT_ANSWER_DOUBLE); - } else { - // $("#doubleIcon"+i).attr("src","img/double-no_icon.png"); - $("#doubleIcon" + i).removeClass("btn-dark").addClass("btn-outline-dark"); - $("#doubleIcon" + i).attr("title", TEXT_ANSWER_NORMAL); - } - fnReEvaluate(); +function fnToggleDouble(i) +{ + arVotingDouble[i]=!arVotingDouble[i]; + if(arVotingDouble[i]) + { + // $("#doubleIcon"+i).attr("src","img/double-yes_icon.png"); + $("#doubleIcon"+i).removeClass("btn-outline-dark").addClass("btn-dark"); + $("#doubleIcon"+i).attr("title",TEXT_ANSWER_DOUBLE); + } + else + { + // $("#doubleIcon"+i).attr("src","img/double-no_icon.png"); + $("#doubleIcon"+i).removeClass("btn-dark").addClass("btn-outline-dark"); + $("#doubleIcon"+i).attr("title",TEXT_ANSWER_NORMAL); + } + fnReEvaluate(); } + // vanilla JavaScript FadeIn / FadeOut // Modus = display: "none / block" ändern (0 = nein, 1 = ja) function fnFadeIn(el, time, modus) { - // Default FadeIn / FadeOut-Time - if (!time) { - time = 500; - } + // Default FadeIn / FadeOut-Time + if (!time) {time = 500;} - // Loading CSS - el.style.animation = "myFadeIn " + time + "ms 1" - el.style.opacity = 1; + // Loading CSS + el.style.animation = "myFadeIn "+time+"ms 1" + el.style.opacity = 1; - if (modus == 1) { - el.style.display = "" - el.style.visibility = "" - } + if (modus == 1) { + el.style.display = "" + el.style.visibility = "" + } } // vanilla JavaScript FadeIn / FadeOut // Modus = visibility show / hidden ändern (0 = nein, 1 = ja) function fnFadeOut(el, time, modus) { - // Default FadeIn / FadeOut-Time - if (!time) { - time = 500; - } + // Default FadeIn / FadeOut-Time + if (!time) {time = 500;} - // Loading CSS - el.style.animation = "myFadeOut " + time + "ms 1" - el.style.opacity = 0; + // Loading CSS + el.style.animation = "myFadeOut "+time+"ms 1" + el.style.opacity = 0; - // hide element from DOM AFTER opacity is set to 0 (setTimeout) - if (modus == 1) { - window.setTimeout(function () { - el.style.display = "none" - el.style.visibility = "hidden" - }, (time - 50)); - } + // hide element from DOM AFTER opacity is set to 0 (setTimeout) + if (modus == 1) { + window.setTimeout(function() { + el.style.display = "none" + el.style.visibility = "hidden" + }, (time-50)); + } }