diff --git a/js/main.js b/js/main.js
index 0ba662bfc1dcc2c57995ab4b0a69ef29fee682a5..585b7a0f56424088294893839f13ae370871c0c0 100644
--- a/js/main.js
+++ b/js/main.js
@@ -1,52 +1,17 @@
/*==========================
- Global JS for Polls component
+ Global JS for Polls component
+ All scripts related to poll pages (count, data src, choices, etc) are within
+ the polls-math.js file
==========================*/
-/*imports*/
-
-//import {getPollTotalInfo} from './polls-math.js';
-
-/* Load necessary scripts on load & navigation */
+/* Load necessary scripts on navigation */
window.addEventListener('load', () => {
- console.log("loading main.js");
-
- //check if content has loaded
- let checkContent = setInterval(firstLoad,500);
-
- function firstLoad(){
- let elementsLoaded = true;
- console.log("main js first load");
- try {
- let firstSib = document.querySelector("solid-display").dataset.src;
- } catch (error) {
- console.log(error);
- elementsLoaded = false;
- }
- console.log("Element loading status : ", elementsLoaded);
-
- if(elementsLoaded == true){
- clearInterval(checkContent);
- console.log("elements are there, opening options in form");
- newOptionContent();
- }
- }
-
- /*
- //update poll ID's
- setTimeout(function(){
- try {
- newOptionContent();
- //getPollTotalInfo();
- } catch (error) {
- console.log(error);
- }
- }, 1500);
- */
+ //console.log("loading main.js");
+ newOptionContent();
document.querySelectorAll("solid-router")[0].addEventListener("navigate",()=> {
- console.log("navigating");
- //newOptionContent();
- //getPollTotalInfo();
+ //console.log("navigating");
+ newOptionContent();
});
});
@@ -82,7 +47,7 @@ function showHideBlocks(activeCTAClass,inactiveCTAClass,diplayBlockClass,hideBlo
//add border active blocks
for (k = 0; k < activeCTAClass.length; k++) {
//change display
- console.log(activeCTAClass[k]);
+ //console.log(activeCTAClass[k]);
activeCTAClass[k].classList.add("active-tab");
}
//remove border for inactive blocks
@@ -104,21 +69,33 @@ function showHideBlocks(activeCTAClass,inactiveCTAClass,diplayBlockClass,hideBlo
function newOptionContent(){
//get options section
let options = document.querySelectorAll("solid-multiple-form[name=pollOptions]");
- console.log("options : ",options);
+ //console.log("options : ",options);
+
+
+
+ //if options are open, do nothing, else open 2 options
+
for(i = 0; i < options.length; i++) {
- let button = options[i].querySelectorAll("button");
- console.log("button : ",options[i].querySelectorAll("button").textContent);
-
- for(y = 0; y < button.length; y++) {
- let buttonContent = button[i].textContent;
- console.log("the content",buttonContent );
-
- button[i].textContent = "Add option";
- //open 2 first options
- console.log("Open first option");
- button[i].click();
- console.log("Open second option");
- button[i].click();
+
+ let votingOptions = options[i].querySelector("input[type=text]");
+ //console.log("voting options are", votingOptions);
+ //check if options lines exist
+ if (votingOptions != null) {
+ //console.log("options are displayed")
+ } else {
+ let button = options[i].querySelectorAll("button");
+ //console.log("button : ",options[i].querySelectorAll("button").textContent);
+ for(y = 0; y < button.length; y++) {
+ let buttonContent = button[i].textContent;
+ //console.log("the content",buttonContent );
+
+ button[i].textContent = "Add option";
+ //open 2 first options
+ //console.log("Open first option");
+ button[i].click();
+ //console.log("Open second option");
+ button[i].click();
+ }
}
}
}
diff --git a/js/polls-math.js b/js/polls-math.js
index 91cc84501808929ad10a3d811eecc67b5532b265..ca0115fecf15c3f199350fa850fa7a32c224d8f0 100644
--- a/js/polls-math.js
+++ b/js/polls-math.js
@@ -9,184 +9,180 @@
* Lauch script on load
* Update on navigate
*********/
-let checkContent = setInterval(firstLoad,1);
+let checkContent = setInterval(firstLoad,500);
function firstLoad(){
let elementsLoaded = true;
try {
//set the domain source constant
- console.log("loading math.js");
+ //console.log("loading math.js");
let firstSib = document.querySelector("solid-display").dataset.src;
} catch (error) {
- console.log(error);
+ //console.log(error);
elementsLoaded = false;
}
- console.log("Element loading status : ", elementsLoaded);
+ //console.log("Element loading status : ", elementsLoaded);
if(elementsLoaded == true){
const dataSourceURI = document.querySelector("solid-display").dataset.src;
const urlComponents = new URL(dataSourceURI);
const dataSourceDomain = urlComponents.origin;
- console.log("the data domain is",dataSourceDomain);
+ //console.log("the data domain is",dataSourceDomain);
clearInterval(checkContent);
- console.log("elements are there, updating id's");
+ console.log("about to do new options");
+ newOptionContent();
+ //console.log("elements are there, updating id's");
getPollTotalInfo(dataSourceDomain);
- //update ID's on navigate
+ /*****
+ Updates on navigate
+ */
document.querySelector("solid-router").addEventListener("navigate",()=> {
- console.log("updating on navigation - math.js");
+ //console.log("updating on navigation - math.js");
try {
+ newOptionContent();
getPollTotalInfo(dataSourceDomain);
updateFormSource();
}catch (error) {
- console.log("error on navigation : ",error);
+ //console.log("error on navigation : ",error);
}
});
- }
-
-
- /*
- //update poll ID's
- try {
- console.log("update the poll ID on load");
- getPollTotalInfo();
- } catch (error) {
- console.log(error);
- }
- */
+ /*********
+ * Get info on the current poll
+ *********/
+ function getPollTotalInfo(dataSourceDomain){
+ //get value of data-scr linked to poll page
+ const pollPage = document.querySelectorAll("#pollPage")[0];
+ const pageTitle = pollPage.querySelectorAll("solid-display[id=title]");
+ //console.log("page title is",pageTitle);
-
-
- /*********
- * Get info on the current poll
- *********/
- function getPollTotalInfo(dataSourceDomain){
- //get value of data-scr linked to poll page
- const pollPage = document.querySelectorAll("#pollPage")[0];
- const pageTitle = pollPage.querySelectorAll("solid-display[id=title]");
- console.log("page title is",pageTitle);
-
- for (let i = 0; i < pageTitle.length; i++){
- //get the data src node of first sib display & extract the url
- const dataSrc = pageTitle[i].dataset.src;
- //extract current poll ID from the data src
- const pollId = dataSrc.match(/\/([0-9]+)\/$/)[1];
- /*push to function that will take the value of ID
- &
- push it to the poll option data range
- push it to the total polls data-src
- */
- setCurrentPollOptions(dataSourceDomain,pollPage,pollId);
- setTotalResultId(dataSourceDomain,pollPage,pollId);
+ for (let i = 0; i < pageTitle.length; i++){
+ try {
+ //get the data src node of first sib display & extract the url
+ const dataSrc = pageTitle[i].dataset.src;
+ //extract current poll ID from the data src
+ const pollId = dataSrc.match(/\/([0-9]+)\/$/)[1];
+ /*push to function that will take the value of ID
+ &
+ push it to the poll option data range
+ push it to the total polls data-src
+ */
+ setCurrentPollOptions(dataSourceDomain,pollPage,pollId);
+ setTotalResultId(dataSourceDomain,pollPage,pollId);
+
+ } catch (error) {
+ //console.log("Poll total cannot be display due to : ",error);
+ }
+ }
+ }
+ /**
+ * push poll ID into data-scr url of current poll
+ */
+ function setTotalResultId(dataSourceDomain,currentPage,currentId){
+ //get the vote blocks
+ //console.log("setting currnt source");
+ const currentPollValues = currentPage.querySelectorAll("[id=poll-votes-values]")[0];
+ //add the poll number
+ const currentPollSrc = dataSourceDomain + "/polls/total_votes/" + currentId + "/";
+ //console.log("the domaine here is : ", dataSourceDomain,currentPollSrc);
+ //push the reconstructed data src to the HTML
+ currentPage.querySelector("[id=poll-votes-values]").dataset.src = currentPollSrc;
}
- }
- /**
- * push poll ID into data-scr url of current poll
- */
- function setTotalResultId(dataSourceDomain,currentPage,currentId){
- //get the vote blocks
- console.log("setting currnt source");
- const currentPollValues = currentPage.querySelectorAll("[id=poll-votes-values]")[0];
- //add the poll number
- const currentPollSrc = dataSourceDomain + "/polls/total_votes/" + currentId + "/";
- console.log("the domaine here is : ", dataSourceDomain,currentPollSrc);
- //push the reconstructed data src to the HTML
- currentPage.querySelector("[id=poll-votes-values]").dataset.src = currentPollSrc;
- }
- /**
- * push poll ID into data-scr url poll options
- */
- function setCurrentPollOptions(dataSourceDomain,currentPage,currentId){
- //add the poll option number within the URL of the options
- //get the form block
- const formContent = currentPage.querySelector("[id=poll-votes-form]");
- if(formContent == null){
- throw "there's no formContent with the id poll-votes-form";
+ /**
+ * push poll ID into data-scr url poll options
+ */
+ function setCurrentPollOptions(dataSourceDomain,currentPage,currentId){
+ //add the poll option number within the URL of the options
+ //get the form block
+ const formContent = currentPage.querySelector("[id=poll-votes-form]");
+ if(formContent == null){
+ throw "there's no formContent with the id poll-votes-form";
+ }
+ //get the range for option choices
+ const newOptionRange = dataSourceDomain+"/polls/"+currentId+"/pollOptions/";
+ //push new
+ formContent.setAttribute('range-chosenoption',newOptionRange);
}
- //get the range for option choices
- const newOptionRange = dataSourceDomain+"/polls/"+currentId+"/pollOptions/";
- //push new
- formContent.setAttribute('range-chosenoption',newOptionRange);
- }
- /***********************************************************
- * BELOW SCRIPT TO UPDATE VALUES WITHIN A POLL
- *
- 1. Get the values of the displayed totals of each poll options
- calculate the percentage & display them
-
- 2. Functions that take advantage of process done in 1 in order to
- personnalise content & css within the vote tab
- ***********************************************************/
-
- document.querySelector("#poll-votes-values").addEventListener("populate",() => {
- //get all the polls
- const pollVoteValues = document.querySelectorAll("#poll-votes-values");
- for (let i = 0; i < pollVoteValues.length; i++){
- //for each poll get the totals of each option
- const voteOptionResults = pollVoteValues[i].querySelectorAll("[name=total_votes]");
- let totalCount = 0;
- let choiceNumber = 0;
- //add option total to the global tally
- for(let y = 0; y < voteOptionResults.length; y++){
- const currentValue = parseInt(voteOptionResults[y].innerHTML);
- if (!Number.isNaN(currentValue)){
- totalCount = totalCount + currentValue;
- }
- else{
- console.log("it's Cheese NaN");
- }
- }
- //launch function to display the number of votes in HTML
+ /***********************************************************
+ * BELOW SCRIPT TO UPDATE VALUES WITHIN A POLL
+ *
+ 1. Get the values of the displayed totals of each poll options
+ calculate the percentage & display them
- displayTotalVotes(pollVoteValues[i],totalCount);
+ 2. Functions that take advantage of process done in 1 in order to
+ personnalise content & css within the vote tab
+ ***********************************************************/
- /*now that we have the values & the totals we can calculate the %ge of each option
- we will also take advantage of this step to launch the functions that set
- the background color and the choice number*/
+ document.querySelector("#poll-votes-values").addEventListener("populate",() => {
+ //get all the polls
+ const pollVoteValues = document.querySelectorAll("#poll-votes-values");
+ for (let i = 0; i < pollVoteValues.length; i++){
+ //for each poll get the totals of each option
+ const voteOptionResults = pollVoteValues[i].querySelectorAll("[name=total_votes]");
+ let totalCount = 0;
+ let choiceNumber = 0;
+ //add option total to the global tally
+ for(let y = 0; y < voteOptionResults.length; y++){
+ const currentValue = parseInt(voteOptionResults[y].innerHTML);
+ if (!Number.isNaN(currentValue)){
+ totalCount = totalCount + currentValue;
+ }
+ else{
+ //console.log("it's Cheese NaN");
+ }
+ }
+ //launch function to display the number of votes in HTML
+
+ displayTotalVotes(pollVoteValues[i],totalCount);
- for(let z = 0; z < voteOptionResults.length; z++){
- const currentValue = parseInt(voteOptionResults[z].innerHTML);
+ /*now that we have the values & the totals we can calculate the %ge of each option
+ we will also take advantage of this step to launch the functions that set
+ the background color and the choice number*/
- const percentageBarField = voteOptionResults[z].nextElementSibling;
+ for(let z = 0; z < voteOptionResults.length; z++){
+ const currentValue = parseInt(voteOptionResults[z].innerHTML);
- if (!Number.isNaN(currentValue)) {
- const percentageOfTotal = ((currentValue/totalCount)*100).toFixed(2)+"%";
- percentageBarField.querySelector(".progressBarValue").innerHTML = percentageOfTotal;
- percentageBarField.querySelector(".progressBarValue").style.width = percentageOfTotal;
+ const percentageBarField = voteOptionResults[z].nextElementSibling;
+ if (!Number.isNaN(currentValue)) {
+ const percentageOfTotal = ((currentValue/totalCount)*100).toFixed(2)+"%";
+ percentageBarField.querySelector(".progressBarValue").innerHTML = percentageOfTotal;
+ percentageBarField.querySelector(".progressBarValue").style.width = percentageOfTotal;
+
+ }
+ else{
+ const percentageOfTotal = "";
+ percentageBarField.querySelector(".progressBarValue").innerHTML = "0%";
+ }
+ setChoiceColor(percentageBarField,choiceNumber);
+ choiceNumber = choiceNumber + 1;
+ if (choiceNumber > 3 ) {
+ choiceNumber = 1;
+ }
}
- else{
- const percentageOfTotal = "";
- percentageBarField.querySelector(".progressBarValue").innerHTML = "0%";
- }
- setChoiceColor(percentageBarField,choiceNumber);
- choiceNumber = choiceNumber + 1;
- if (choiceNumber > 3 ) {
- choiceNumber = 1;
- }
+ //launch the function that will display the choice number
+ setChoiceNumber(pollVoteValues[i]);
}
- //launch the function that will set the choice number
- setChoiceNumber(pollVoteValues[i]);
- }
- });
+ });
+ }
}
function updateFormSource(){
const pollSection = document.querySelectorAll("#pollListing,#pollPage,#add-survey");
pollSection.forEach((section) => {
- console.log("poll section is :", section);
+ //console.log("poll section is :", section);
const applicationForms = section.querySelectorAll("solid-form");
- console.log("forms are : ",applicationForms);
+ //console.log("forms are : ",applicationForms);
applicationForms.forEach((form) => {
- console.log("updating form sources");
+ //console.log("updating form sources");
form.dataset.src = form.dataset.src;
});
});
@@ -225,4 +221,41 @@ function displayTotalVotes(poll,totalCount){
}
+
+/* ===================
+Add survey form
+* Add content to new option button
+* Open by default 2 options
+================== */
+//change content of button
+function newOptionContent(){
+ //get options section
+ let options = document.querySelectorAll("solid-multiple-form[name=pollOptions]");
+ console.log("options : ",options);
+ let hasRun = false;
+
+ //if options are open, do nothing, else open 2 options
+ for(i = 0; i < options.length; i++) {
+ let votingOptions = options[i].querySelectorAll("input[type=text]");
+ console.log("voting options are", votingOptions,votingOptions.length);
+
+ //check if options lines exist
+ if (votingOptions.length == 0) {
+ let button = options[i].querySelectorAll("button");
+ for(y = 0; y < button.length; y++) {
+
+ button[y].textContent = "Add option";
+
+ //open 2 first options
+ console.log("Open first option with content :",button[y]);
+ button[y].click();
+ console.log("Open second option",button[y]);
+ button[y].click();
+ }
+ } else {
+ console.log("options are displayed");
+ }
+ }
+}
+
//export {getPollTotalInfo};
\ No newline at end of file