Skip to content

Commit

Permalink
some changes
Browse files Browse the repository at this point in the history
  • Loading branch information
tafakkur committed Mar 31, 2021
1 parent 5f699d0 commit f77f16f
Show file tree
Hide file tree
Showing 7 changed files with 7,256 additions and 36 deletions.
Binary file added examples/Fast_Mode.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added examples/Fast_Mode.mp4
Binary file not shown.
27 changes: 27 additions & 0 deletions functions/Fast Select Button.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
Qualtrics.SurveyEngine.addOnReady(function () {
let w_loc = window.location.pathname.split("/");
let quest = this;
let mario = document.querySelector("#mario_button");
let buttons = quest.questionContainer.querySelectorAll(".q-checkbox");
if (w_loc.indexOf("SV_8HBDY4VRJnFn40J") > -1) {
mario.onclick = function () {
mario.toggleClassName("active");
mario.toggleClassName("glow");
if (mario.hasClassName("active")) {
mario.innerText = "Fast Select Mode Active";
quest.questionContainer.style.border = "7px solid red";
buttons.forEach((but) => {
but.parentElement.onmouseover = function () {
this.querySelector("input").click();
};
});
} else {
mario.innerText = "Activate Fast Select Mode";
quest.questionContainer.style.border = "none";
buttons.forEach((but) => {
but.parentElement.onmouseover = function () {};
});
}
};
}
});
75 changes: 75 additions & 0 deletions functions/Fast Select KB.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,75 @@
Qualtrics.SurveyEngine.addOnReady(function () {
let w_loc = window.location.pathname.split("/");
let quest = this;
let fast_mode = false;
let mario = document.querySelector("#mario_heading");
if (w_loc.indexOf("SV_8HBDY4VRJnFn40J") > -1) {
quest.questionContainer.querySelector("legend").insertAdjacentHTML(
"beforeend",
`
<style>.Skin label.q-checkbox {
border-radius: 50%;
border: 2px solid green !important;
}
.Skin label.q-checkbox.q-checked,
.Skin label.q-checkbox.q-checked.q-focused {
border: 2px solid green !important;
background: green !important;
}
.Skin .SBS .Answers th {
color: transparent;
}
.Skin .SBSMatrix th {
font-weight: 900;
text-align: center;
}
.Skin .SBS thead th span {
top: 2rem;
position: relative;
}
</style>`
);

let buttons = quest.questionContainer.getElementsByClassName("q-checkbox");
for (but of buttons) {
but.parentElement.onmouseover = function () {
if (fast_mode) {
let chk = this.querySelector("label");
if (!chk.hasClassName("q-checked")) {
chk.click();
}
}
};
}

function toggle_fast_mode() {
mario.toggleClassName("active");
mario.toggleClassName("glow");
if (!fast_mode) {
fast_mode = true;
mario.innerText = "Fast Select Mode Active";
quest.questionContainer.style.border = "7px solid red";
} else {
fast_mode = false;
mario.innerText = "Hold Shift to Activate Fast Select";
quest.questionContainer.style.border = "none";
}
}

window.onkeydown = function check_key(e) {
if (e.shiftKey) {
toggle_fast_mode();
window.onkeydown = function check_key(e) {};
}
};
window.onkeyup = function up_key(e) {
toggle_fast_mode();
window.onkeydown = function check_key(e) {
if (e.shiftKey) {
toggle_fast_mode();
window.onkeydown = function check_key(e) {};
}
};
};
}
});
46 changes: 46 additions & 0 deletions functions/List of answered and unanswered questions.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
Qualtrics.SurveyEngine.addOnReady(function () {
document.querySelector("#NextButton").onclick = function () {
let page_ans = [],
page_uans = [];
document.querySelectorAll("div[id^=QID][class*=QID]").forEach((question) => {
let chosen = question.querySelectorAll(".q-checked");
if (chosen.length == 0) {
page_uans.push(question.id);
} else if (chosen.length > 0) {
page_ans.push(question.id);
}
});
let old_ans = String(Qualtrics.SurveyEngine.getEmbeddedData("answered"))
.split(",")
.filter((el, ind, ar) => {
if (ar.indexOf(el) != ind || el == "null") return false;
else return el;
});
let old_uans = String(Qualtrics.SurveyEngine.getEmbeddedData("unanswered"))
.split(",")
.filter((el, ind, ar) => {
if (ar.indexOf(el) != ind || el == "null") return false;
else return el;
});

page_ans.forEach((item) => old_ans.push(item));
page_uans.forEach((item) => old_uans.push(item));

old_uans = old_uans
.filter((a) => {
if (old_ans.indexOf(a) > -1) return false;
else return a;
})
.filter((el, ind, ar) => {
if (ar.indexOf(el) != ind || el == "null") return false;
else return el;
});
old_ans = old_ans.filter((el, ind, ar) => {
if (ar.indexOf(el) != ind || el == "null") return false;
else return el;
});

Qualtrics.SurveyEngine.setEmbeddedData("unanswered", old_uans.join());
Qualtrics.SurveyEngine.setEmbeddedData("answered", old_ans.join());
};
});
72 changes: 36 additions & 36 deletions personal_qualtrics_theme.css
Original file line number Diff line number Diff line change
@@ -1,47 +1,55 @@
.Skin .QuestionOuter.Matrix{ max-width: 100%; }

/*This CSS has been tested with the built-in templates "Boxed Questions" and "Minimal 2014". It will NOT work with the newer responsive templates that use wide bars instead of checkboxes, and it will not work with the older non-responsive templates. (Some colors may be affected, but those templates use other selectors for the elements that would still need to be customized.)*/
.Skin .QuestionOuter.Matrix {
max-width: 100%;
}

/*Change next and previous button colors ("static" and on mouseover/focus*/
.my_button,
.Skin #Buttons #NextButton,
.Skin #Buttons #PreviousButton {
color: rgb(255, 255, 255) !important;
font-size: 16px;
cursor: pointer;
text-align: center;
appearance: none;
background-color: #271c88;
border-width: initial;
border-style: none;
border-color: initial;
border-image: initial;
padding: 8px 20px;
border-radius: 4px;
margin: 0px;
text-decoration: none;
transition: background 0.3s ease 0s;
}

.Skin #Buttons #NextButton:hover,
.Skin #Buttons #NextButton:focus,
.my_button:focus,
.my_button:hover,
.Skin #Buttons #PreviousButton:hover,
.Skin #Buttons #PreviousButton:focus {
background: #ac4e18;
}

/*Add extra padding on top and sides of survey (looks better if embedding the survey in another page using iframes)*/
/* .Skin .SkinInner {
padding-right: 30px;
padding-left: 30px;
padding-top: 30px;
} */

/*(Optional) Set fonts for survey body and buttons to use a Google Font (Source Sans Pro, sans-serif fallback)*/
body,
.Skin,
.Skin #Buttons #NextButton,
.Skin #Buttons #PreviousButton,
.Skin #Buttons #NextButton:hover,
.Skin #Buttons #NextButton:focus,
.my_button,
.my_button:hover,
.my_button:focus,
.Skin #Buttons #PreviousButton:hover,
.Skin #Buttons #PreviousButton:focus {
font-family: "Source Sans Pro", sans-serif !important;
}

/*Change colors for most survey items including multiple choice and matrix table (radio buttons and checkboxes); surround colors for clicked-on dropdowns; sliders (bar and slider types, but not the star type); text entry box border color (when cursor is inside the box); and number labels for drag-and-drop ranking items*/
.Skin label.q-radio.q-checked {
/* background-color: #20445e; */
}
.Skin label.q-checkbox,
.Skin label.q-radio {
border: 2px solid #20445e;
}
/* .Skin label.q-checkbox.q-focused,.Skin label.q-radio.q-focused{outline:#000 dotted thin} */
.Skin label.q-radio.q-checked {
background-color: #20445e;
}
Expand Down Expand Up @@ -92,7 +100,6 @@ body,
background-color: #20445e;
}

/*Change color fills for progress bar (ProgressBarFill is the "filled-in" color; ProgressBarFillContainer is the "unfilled" background color)*/
.Skin .ProgressBarFill {
background-color: #0c3452;
}
Expand All @@ -104,11 +111,7 @@ body,
.Skin label.MultipleAnswer,
.Skin label.SingleAnswer {
cursor: pointer;
/* background: #f1f1f1; */
/* background: #00000003; */
/* border: 1px solid #0000001a; */
transition: background 0.2s ease-in-out;
/* padding: 20px; */
display: block;
text-align: center;
-webkit-border-radius: 2px;
Expand All @@ -122,26 +125,23 @@ body,
.Skin label.MultipleAnswer.q-checked:hover,
.Skin label.SingleAnswer.q-checked.q-focused:hover,
.Skin label.SingleAnswer.q-checked:hover {
/* background: #00000014; */
/* border-color: #1251c1; */
/* border: 3px solid #1251c1; */
color: #001797;
font-weight: bold;
color: #001797;
font-weight: bold;
}
.Skin label.MultipleAnswer.q-checked,
.Skin label.SingleAnswer.q-checked {
/* background: #00000014; */
/* border-color: #00395a; */
/* border-color: #1251c1; */
/* border: 3px solid #1251c1; */
color: #001797;
font-weight: bold;
font-weight: bold;
}

@media (min-width: 770px){
.Skin .SkinInner {
background-color: #71b6eb;
width: 900px;
max-width: 95%;
width: 80vw;
max-width: 800px;
margin: 0 auto;
background: #fff;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
-ms-border-radius: 8px;
-o-border-radius: 8px;
border-radius: 8px;
}
}
Loading

0 comments on commit f77f16f

Please sign in to comment.