first commit
This commit is contained in:
ryanwong
@@ -0,0 +1,28 @@
|
||||
const hideAnswerSelect = document.getElementById("hide-answer-select");
|
||||
const questionSelect = document.getElementById("select_mapping_type");
|
||||
const answerValueInput = document.querySelectorAll("answer-value");
|
||||
const imageInput = document.getElementById("answer-image");
|
||||
|
||||
if (questionSelect) {
|
||||
questionSelect.addEventListener("change", function (e) {
|
||||
const selectedIndex = this.selectedIndex;
|
||||
const type = parseInt(this.options[selectedIndex].dataset.type);
|
||||
if ([4, 5].includes(type)) {
|
||||
if (!answerValueInput.classList.contains("show")) answerValueInput.classList.add("show");
|
||||
} else {
|
||||
if (answerValueInput.classList.contains("show")) answerValueInput.classList.remove("show");
|
||||
}
|
||||
|
||||
if ([5, 6].includes(type)) {
|
||||
if (!imageInput.classList.contains("show")) imageInput.classList.add("show");
|
||||
} else {
|
||||
if (imageInput.classList.contains("show")) imageInput.classList.remove("show");
|
||||
}
|
||||
|
||||
if ([6].includes(type)) {
|
||||
if (!hideAnswerSelect.classList.contains("show")) hideAnswerSelect.classList.add("show");
|
||||
} else {
|
||||
if (hideAnswerSelect.classList.contains("show")) hideAnswerSelect.classList.remove("show");
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -0,0 +1,35 @@
|
||||
const rangesResponsesContainer = document.getElementById('ranges-responses-container');
|
||||
function addRangeResponse(e, el) {
|
||||
e.preventDefault();
|
||||
let nextBoxId = parseInt(el.dataset.next);
|
||||
let rangeResponseHtmlTemplate = `
|
||||
<div class="d-flex flex-row col-12 px-0 align-items-end" data-box-id="${nextBoxId}">
|
||||
<div class="form-group col-2 pl-0">
|
||||
<label for="range_${nextBoxId}" class="control-label">Range</label>
|
||||
<input type="text" class="form-control data-input"
|
||||
id="range_${nextBoxId}"
|
||||
placeholder="0-20"
|
||||
name="ranges" value="" />
|
||||
</div>
|
||||
<div class="form-group col-6 pl-0">
|
||||
<label for="response_${nextBoxId}" class="control-label">Response</label>
|
||||
<input type="text" class="form-control data-input"
|
||||
id="response_${nextBoxId}"
|
||||
placeholder="Response to accumlated weight between 0% and 20%"
|
||||
name="responses" value="" />
|
||||
</div>
|
||||
<button type="button" onclick="addRangeResponse(event, this)" class="form-group my-0 col-2 btn btn-primary mb-3" style="height:max-content;height:-moz-max-content" data-next="${nextBoxId + 1}">
|
||||
Add
|
||||
</button>
|
||||
<button type="button" onclick="removeRange(event, this)" class="form-group my-0 col-2 btn btn-danger mb-3 mx-1" style="height:max-content;height:-moz-max-content" data-box-id="${nextBoxId}">
|
||||
Del
|
||||
</button>
|
||||
</div>
|
||||
`;
|
||||
$(rangesResponsesContainer).append(rangeResponseHtmlTemplate);
|
||||
}
|
||||
function removeRange(e, el) {
|
||||
e.preventDefault();
|
||||
let boxToRemoveId = parseInt(el.dataset.boxId);
|
||||
document.querySelector(`div[data-box-id="${boxToRemoveId}"]`).remove();
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,22 @@
|
||||
const webcamElement = document.getElementById('webcam');
|
||||
const canvasElement = document.getElementById('canvas');
|
||||
const snapSoundElement = document.getElementById('snapSound');
|
||||
if(webcamElement && canvasElement && snapSoundElement){
|
||||
const webcam = new Webcam(
|
||||
webcamElement,
|
||||
'user',
|
||||
canvasElement,
|
||||
snapSoundElement,
|
||||
);
|
||||
|
||||
webcam
|
||||
.start()
|
||||
.then((result) => {
|
||||
console.log('webcam started');
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
});
|
||||
|
||||
var picture = webcam.snap();
|
||||
}
|
||||
@@ -0,0 +1,371 @@
|
||||
/*Powered By: Manaknightdigital Inc. https://manaknightdigital.com/ Year: 2019*/
|
||||
var mkd_events = (function () {
|
||||
var topics = {};
|
||||
var hOP = topics.hasOwnProperty;
|
||||
|
||||
return {
|
||||
subscribe: function (topic, listener) {
|
||||
// Create the topic's object if not yet created
|
||||
if (!hOP.call(topics, topic)) topics[topic] = [];
|
||||
|
||||
// Add the listener to queue
|
||||
var index = topics[topic].push(listener) - 1;
|
||||
|
||||
// Provide handle back for removal of topic
|
||||
return {
|
||||
remove: function () {
|
||||
delete topics[topic][index];
|
||||
},
|
||||
};
|
||||
},
|
||||
publish: function (topic, info) {
|
||||
// If the topic doesn't exist, or there's no listeners in queue, just leave
|
||||
if (!hOP.call(topics, topic)) return;
|
||||
|
||||
// Cycle through topics queue, fire!
|
||||
topics[topic].forEach(function (item) {
|
||||
item(info != undefined ? info : {});
|
||||
});
|
||||
},
|
||||
};
|
||||
})();
|
||||
|
||||
function mkd_is_number(evt, obj) {
|
||||
var charCode = evt.which ? evt.which : event.keyCode;
|
||||
var value = obj.value;
|
||||
|
||||
var minuscontains = value.indexOf("-") != -1;
|
||||
if (minuscontains) {
|
||||
if (charCode == 45) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
if (charCode == 45) {
|
||||
return true;
|
||||
}
|
||||
|
||||
var dotcontains = value.indexOf(".") != -1;
|
||||
if (dotcontains) {
|
||||
if (charCode == 46) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
if (charCode == 46) {
|
||||
return true;
|
||||
}
|
||||
if (charCode > 31 && (charCode < 48 || charCode > 57)) {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
function mkd_export_table(url) {
|
||||
if (url.indexOf("?") > -1) {
|
||||
url = url + "&format=csv";
|
||||
} else {
|
||||
url = url + "?format=csv";
|
||||
}
|
||||
window.location.href = url;
|
||||
}
|
||||
$(document).ready(function () {
|
||||
$("#sidebarCollapse").on("click", function () {
|
||||
$("#sidebar").toggleClass("active");
|
||||
});
|
||||
|
||||
//import csv code
|
||||
$("#btn-choose-csv").on("click", function (e) {
|
||||
e.preventDefault();
|
||||
$("#csv-file").trigger("click");
|
||||
});
|
||||
|
||||
$("#csv-file").on("change", function () {
|
||||
$("#import-csv").trigger("submit");
|
||||
});
|
||||
|
||||
$("#import-csv").on("submit", function (e) {
|
||||
e.preventDefault();
|
||||
var formData = new FormData(this);
|
||||
var url = $(this).attr("action");
|
||||
|
||||
$(this).addClass("d-none");
|
||||
$.ajax({
|
||||
url: url,
|
||||
type: "POST",
|
||||
data: formData,
|
||||
cache: false,
|
||||
contentType: false,
|
||||
processData: false,
|
||||
success: function (res) {
|
||||
var body_html = "";
|
||||
var head_html = "";
|
||||
if (res.preview == true) {
|
||||
var data = res.data;
|
||||
var header = data[0];
|
||||
data.shift();
|
||||
for (let headerItem of header) {
|
||||
head_html += `<th>${headerItem}</th>`;
|
||||
}
|
||||
for (let row of data) {
|
||||
body_html += "<tr>";
|
||||
for (let item of row) {
|
||||
body_html += `<td>${item} </td>`;
|
||||
}
|
||||
body_html += "</tr>";
|
||||
}
|
||||
|
||||
$("#csv-table-head").html(head_html);
|
||||
$("#csv-table-body").html(body_html);
|
||||
$("#csv-table").removeClass("d-none");
|
||||
$("#btn-save-csv").removeClass("d-none");
|
||||
} else if (res.saved == true) {
|
||||
alert("Imported Successfully");
|
||||
location.reload();
|
||||
}
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
$("#btn-save-csv").on("click", function (e) {
|
||||
e.preventDefault();
|
||||
var model = $("#btn-csv-upload-dialog").data("model");
|
||||
console.log(model);
|
||||
$("#import-csv").attr("action", "/v1/api/file/import/" + model);
|
||||
$("#import-csv").trigger("submit");
|
||||
});
|
||||
|
||||
$(".modal-image").on("click", function () {
|
||||
var src = $(this).attr("src");
|
||||
$("#modal-image-slot").attr("src", src);
|
||||
$("#modal-image-show").modal("show");
|
||||
});
|
||||
});
|
||||
|
||||
const selectedRows = [];
|
||||
// Buk Actions
|
||||
const bulkSelectAll = document.getElementById("bulkSelectAll");
|
||||
|
||||
const deleteButton = document.getElementById("bulkDeleteButton");
|
||||
const editButton = document.getElementById("bulkEditButton");
|
||||
const originalDeleteHref = deleteButton?.href ?? "";
|
||||
|
||||
// Select All click
|
||||
if (bulkSelectAll) {
|
||||
bulkSelectAll.addEventListener("click", (event) => {
|
||||
selectedRows.length = 0;
|
||||
|
||||
const bulkSelectRows = document.querySelectorAll(".bulkSelect");
|
||||
|
||||
const isSelectAll = event.target.checked;
|
||||
bulkSelectRows.forEach((item) => {
|
||||
item.checked = isSelectAll;
|
||||
if (isSelectAll) {
|
||||
selectedRows.push(item.dataset.id);
|
||||
}
|
||||
});
|
||||
// Update delete link
|
||||
if (isSelectAll) {
|
||||
if (deleteButton) deleteButton.style.display = "inline-block";
|
||||
if (deleteButton) deleteButton.href = originalDeleteHref + selectedRows.join("|");
|
||||
if (editButton) editButton.style.display = "inline-block";
|
||||
} else {
|
||||
if (deleteButton) deleteButton.style.display = "none";
|
||||
if (deleteButton) deleteButton.href = originalDeleteHref;
|
||||
if (editButton) editButton.style.display = "none";
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Handle Individual Select
|
||||
const handleBulkSelectChange = function (event) {
|
||||
const id = event.dataset.id;
|
||||
if (event.checked) {
|
||||
selectedRows.push(id);
|
||||
} else {
|
||||
const findIndex = selectedRows.findIndex((item) => item === id);
|
||||
if (findIndex > -1) {
|
||||
selectedRows.splice(findIndex, 1);
|
||||
}
|
||||
}
|
||||
deleteButton.href = originalDeleteHref + selectedRows.join("|");
|
||||
|
||||
deleteButton.style.display = selectedRows.length > 0 ? "inline-block" : "none";
|
||||
editButton.style.display = selectedRows.length > 0 ? "inline-block" : "none";
|
||||
};
|
||||
const orderContainer = document.getElementById("order-container");
|
||||
if (orderContainer) {
|
||||
(async () => {
|
||||
const quizzes = await fetch("/admin/api/quizzes?limit=0")
|
||||
.then((res) => res.json())
|
||||
.then((data) => data.data.items);
|
||||
|
||||
// Store listitems
|
||||
const listItems = [];
|
||||
|
||||
let dragStartIndex;
|
||||
let dragStartQuiz;
|
||||
|
||||
createList();
|
||||
|
||||
// Insert list items into DOM
|
||||
function createList() {
|
||||
quizzes.forEach((quiz) => {
|
||||
const quizContainer = document.createElement("div");
|
||||
const quizHeadTag = document.createElement("h2");
|
||||
quizHeadTag.className = "font-weight-bold mb-3";
|
||||
quizHeadTag.innerHTML = `Quiz: ${quiz.name}`;
|
||||
quizContainer.id = `${quiz.name.replace(/ /g, "_")}_id`;
|
||||
quizContainer.className = "quiz-container mb-5";
|
||||
|
||||
const draggable_list = document.createElement("ul");
|
||||
draggable_list.id = `draggable-list-${quiz.id}`;
|
||||
draggable_list.className = "draggable-list";
|
||||
|
||||
quizContainer.appendChild(quizHeadTag);
|
||||
quizContainer.appendChild(draggable_list);
|
||||
quiz.questions.forEach((questionObject, index) => {
|
||||
const listItem = document.createElement("li");
|
||||
|
||||
listItem.setAttribute("data-index", index);
|
||||
listItem.setAttribute("data-quiz", quiz.id);
|
||||
|
||||
listItem.innerHTML = `
|
||||
<span class="number">${questionObject.order}</span>
|
||||
<div class="draggable" draggable="true">
|
||||
<p class="question-text" data-question-id="${questionObject.id}" data-question-new-order="${questionObject.order}">${questionObject.question}</p>
|
||||
<i class="fas fa-grip-lines"></i>
|
||||
</div>
|
||||
`;
|
||||
|
||||
listItems.push(listItem);
|
||||
|
||||
draggable_list.appendChild(listItem);
|
||||
});
|
||||
orderContainer.appendChild(quizContainer);
|
||||
});
|
||||
addEventListeners();
|
||||
}
|
||||
|
||||
function dragStart() {
|
||||
dragStartIndex = +this.closest("li").getAttribute("data-index");
|
||||
dragStartQuiz = +this.closest("li").getAttribute("data-quiz");
|
||||
}
|
||||
|
||||
function dragEnter() {
|
||||
this.classList.add("over");
|
||||
}
|
||||
|
||||
function dragLeave() {
|
||||
this.classList.remove("over");
|
||||
}
|
||||
|
||||
function dragOver(e) {
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
function dragDrop() {
|
||||
const dragEndIndex = +this.getAttribute("data-index");
|
||||
const dragEndQuiz = +this.getAttribute("data-quiz");
|
||||
swapItems(dragStartIndex, dragStartQuiz, dragEndIndex, dragEndQuiz);
|
||||
|
||||
this.classList.remove("over");
|
||||
}
|
||||
|
||||
// Swap list items that are drag and drop
|
||||
function swapItems(fromIndex, fromQuiz, toIndex, toQuiz) {
|
||||
const itemOne = listItems.find((item) => {
|
||||
return item.getAttribute("data-quiz") == fromQuiz && item.getAttribute("data-index") == fromIndex;
|
||||
});
|
||||
const itemTwo = listItems.find((item) => {
|
||||
return item.getAttribute("data-quiz") == toQuiz && item.getAttribute("data-index") == toIndex;
|
||||
});
|
||||
|
||||
const movableItemOne = itemOne.querySelector(".draggable");
|
||||
const movableItemTwo = itemTwo.querySelector(".draggable");
|
||||
|
||||
itemOne.appendChild(movableItemTwo);
|
||||
itemTwo.appendChild(movableItemOne);
|
||||
|
||||
const itemOneOrder = movableItemOne.querySelector(".question-text").getAttribute("data-question-new-order");
|
||||
const itemTwoOrder = movableItemTwo.querySelector(".question-text").getAttribute("data-question-new-order");
|
||||
|
||||
movableItemOne.querySelector(".question-text").setAttribute("data-question-new-order", itemTwoOrder);
|
||||
movableItemTwo.querySelector(".question-text").setAttribute("data-question-new-order", itemOneOrder);
|
||||
}
|
||||
|
||||
function addEventListeners() {
|
||||
const draggables = document.querySelectorAll(".draggable");
|
||||
const dragListItems = document.querySelectorAll(".draggable-list li");
|
||||
|
||||
draggables.forEach((draggable) => {
|
||||
draggable.addEventListener("dragstart", dragStart);
|
||||
});
|
||||
|
||||
dragListItems.forEach((item) => {
|
||||
item.addEventListener("dragover", dragOver);
|
||||
item.addEventListener("drop", dragDrop);
|
||||
item.addEventListener("dragenter", dragEnter);
|
||||
item.addEventListener("dragleave", dragLeave);
|
||||
});
|
||||
}
|
||||
})();
|
||||
}
|
||||
|
||||
async function submitChanges(el, e) {
|
||||
e.preventDefault();
|
||||
el.innerHTML = `<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Loading...`;
|
||||
const questions = document.querySelectorAll(".question-text");
|
||||
const payload = [];
|
||||
questions.forEach((question) => {
|
||||
payload.push({
|
||||
id: question.getAttribute("data-question-id"),
|
||||
order: question.getAttribute("data-question-new-order"),
|
||||
});
|
||||
});
|
||||
const response = await fetch("/questions/order/save", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"content-type": "application/json",
|
||||
},
|
||||
body: JSON.stringify(payload),
|
||||
}).then((res) => res.json());
|
||||
console.log(response);
|
||||
el.innerHTML = `Submit changes`;
|
||||
}
|
||||
|
||||
function weightScoreInputChange(el, event) {
|
||||
if (el.value && el.value.trim()) {
|
||||
if (!el.classList.contains("has-value")) el.classList.add("has-value");
|
||||
} else {
|
||||
el.classList.remove("has-value");
|
||||
}
|
||||
}
|
||||
|
||||
async function updateMainPicture(self, evt) {
|
||||
evt.preventDefault();
|
||||
const imageId = document.getElementById("file_image").value;
|
||||
if (!imageId) {
|
||||
return false;
|
||||
}
|
||||
self.innerHTML = `<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Loading...`;
|
||||
const response = await fetch("/main-image/update", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"content-type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
image_url: imageId,
|
||||
}),
|
||||
}).then((res) => res.json());
|
||||
console.log(response);
|
||||
self.innerHTML = `Update image`;
|
||||
}
|
||||
|
||||
function printSpecific(divId) {
|
||||
let divToPrint = document.getElementById(divId);
|
||||
let printBtn = document.querySelector(".print-btn");
|
||||
divToPrint.classList.add("print");
|
||||
printBtn.classList.add("print");
|
||||
window.print();
|
||||
printBtn.classList.remove("print");
|
||||
divToPrint.classList.remove("print");
|
||||
}
|
||||
@@ -0,0 +1,257 @@
|
||||
const mcqiImageDimensionBox = document.getElementById("demo-box");
|
||||
const addQuestionForm = document.getElementById("add-question-form");
|
||||
const editQuestionForm = document.getElementById("edit-question-form");
|
||||
const extraOutputsContainer = document.getElementById("extra-outputs");
|
||||
const sliderSelectContainer = document.getElementById("slider-select");
|
||||
const typeSelect = document.getElementById("select_mapping_type");
|
||||
const sliderRangeInput = document.getElementById("text_slider_range");
|
||||
const minSlideRange = document.getElementById("min-slide-range");
|
||||
const maxSlideRange = document.getElementById("max-slide-range");
|
||||
const imageDimensions = document.getElementById("image-dimensions");
|
||||
const imageWidth = document.getElementById("image-width");
|
||||
const imageHeight = document.getElementById("image-height");
|
||||
|
||||
const dependsOnMainInput = document.getElementById("text_depends_on");
|
||||
const dependsOnQuestionId = document.getElementById("depended_question_id");
|
||||
const dependsOnAnswer = document.getElementById("depended_answer");
|
||||
|
||||
const outputVariableInput = document.getElementById("text_extra_output_variable");
|
||||
|
||||
if (addQuestionForm) {
|
||||
addQuestionForm.addEventListener("submit", function (event) {
|
||||
event.preventDefault();
|
||||
if (dependsOnQuestionId.value && dependsOnAnswer.value) {
|
||||
let joinedStr = `${dependsOnQuestionId.value}|${dependsOnAnswer.value}`;
|
||||
dependsOnMainInput.value = joinedStr.trim();
|
||||
} else {
|
||||
dependsOnMainInput.value = "";
|
||||
}
|
||||
if (minSlideRange.value && maxSlideRange.value) {
|
||||
sliderRangeInput.value = `${minSlideRange.value}-${maxSlideRange.value}`;
|
||||
}
|
||||
let arrayOfExtras = [];
|
||||
|
||||
const outputVariableExtrasContainer = document.querySelectorAll(".output-variable-container");
|
||||
outputVariableExtrasContainer.forEach(function (extraContainer) {
|
||||
//get names and weights
|
||||
let currentExtraName = extraContainer.querySelector("select").value;
|
||||
let currentExtraWeight = extraContainer.querySelector(".extra-output-weight").value;
|
||||
if (currentExtraName && currentExtraWeight) {
|
||||
arrayOfExtras.push({
|
||||
name: currentExtraName,
|
||||
weight: currentExtraWeight,
|
||||
});
|
||||
}
|
||||
});
|
||||
if (arrayOfExtras.length > 0) {
|
||||
outputVariableInput.value = JSON.stringify(arrayOfExtras);
|
||||
} else {
|
||||
outputVariableInput.value = "[]";
|
||||
}
|
||||
this.submit();
|
||||
});
|
||||
}
|
||||
|
||||
if (editQuestionForm) {
|
||||
editQuestionForm.addEventListener("submit", function (event) {
|
||||
event.preventDefault();
|
||||
console.log("stopped");
|
||||
if (dependsOnQuestionId.value && dependsOnAnswer.value) {
|
||||
let joinedStr = `${dependsOnQuestionId.value}|${dependsOnAnswer.value}`;
|
||||
dependsOnMainInput.value = joinedStr.trim();
|
||||
} else {
|
||||
dependsOnMainInput.value = "";
|
||||
}
|
||||
if (minSlideRange.value && maxSlideRange.value) {
|
||||
sliderRangeInput.value = `${minSlideRange.value}-${maxSlideRange.value}`;
|
||||
}
|
||||
let arrayOfExtras = [];
|
||||
const outputVariableExtrasContainer = document.querySelectorAll(".output-variable-container");
|
||||
outputVariableExtrasContainer.forEach(function (extraContainer) {
|
||||
//get names and weights
|
||||
let currentExtraName = extraContainer.querySelector("select").value;
|
||||
let currentExtraWeight = extraContainer.querySelector(".extra-output-weight").value;
|
||||
if (currentExtraName && currentExtraWeight) {
|
||||
arrayOfExtras.push({
|
||||
name: currentExtraName,
|
||||
weight: currentExtraWeight,
|
||||
});
|
||||
}
|
||||
});
|
||||
if (arrayOfExtras.length > 0) {
|
||||
outputVariableInput.value = JSON.stringify(arrayOfExtras);
|
||||
} else {
|
||||
outputVariableInput.value = "[]";
|
||||
}
|
||||
this.submit();
|
||||
});
|
||||
}
|
||||
|
||||
typeSelect.addEventListener("change", function () {
|
||||
let type = this.value;
|
||||
if (type == 6) {
|
||||
sliderSelectContainer.removeAttribute("hidden");
|
||||
if (!sliderSelectContainer.classList.contains("required")) sliderSelectContainer.classList.add("required");
|
||||
minSlideRange.setAttribute("required", "required");
|
||||
maxSlideRange.setAttribute("required", "required");
|
||||
} else if (type == 5) {
|
||||
imageDimensions.removeAttribute("hidden");
|
||||
if (!imageDimensions.classList.contains("required")) imageDimensions.classList.add("required");
|
||||
imageWidth.setAttribute("required", "required");
|
||||
imageHeight.setAttribute("required", "required");
|
||||
} else {
|
||||
sliderSelectContainer.setAttribute("hidden", "true");
|
||||
sliderSelectContainer.classList.remove("required");
|
||||
minSlideRange.removeAttribute("required");
|
||||
maxSlideRange.removeAttribute("required");
|
||||
|
||||
imageDimensions.setAttribute("hidden", "true");
|
||||
imageDimensions.classList.remove("required");
|
||||
imageWidth.removeAttribute("required");
|
||||
imageHeight.removeAttribute("required");
|
||||
}
|
||||
});
|
||||
|
||||
function addExtraOutputVariable() {
|
||||
let options = "";
|
||||
outputVariables.forEach(function (oV) {
|
||||
options += `<option value="${oV}">${oV}</option>`;
|
||||
});
|
||||
let htmlTemplate = `
|
||||
<div class="output-variable-container mb-2 d-flex flex-lg-row flex-column flex-lg-wrap col-lg-12 px-0 ">
|
||||
<div class="d-flex mr-2 flex-column px-0 col-lg col-12">
|
||||
<label for="extra-output-var">Output variable</label>
|
||||
<select class="custom-select extra-output-var custom-picker d-block w-100" id="extra-output-var" data-style="btn-light" data-live-search="true">
|
||||
<option class="select_mapping_status_option" value=""></option>
|
||||
${options}
|
||||
</select>
|
||||
</div>
|
||||
<div class="d-flex mr-2 flex-column px-0 col-lg col-12">
|
||||
<label for="extra-output-weight">Weight</label>
|
||||
<input type="number" class="form-control data-input extra-output-weight"/>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
$(htmlTemplate).insertBefore(".add-another-extra");
|
||||
}
|
||||
|
||||
function questionSelectionChanged(el, event) {
|
||||
const shown_number_order = document.getElementById("shown_number_order");
|
||||
const number_order = document.getElementById("number_order");
|
||||
shown_number_order.value = parseInt(el.options[el.selectedIndex].dataset.lastOrder) + 1;
|
||||
number_order.value = parseInt(el.options[el.selectedIndex].dataset.lastOrder) + 1;
|
||||
}
|
||||
|
||||
const questionSelect = document.getElementById("select_mapping_type");
|
||||
const hideAnswerSelect = $(".hide-answer-select");
|
||||
const answerValueInput = $(".answer-value");
|
||||
const imageInput = $(".answer-image");
|
||||
|
||||
if (questionSelect) {
|
||||
questionSelect.addEventListener("change", function (e) {
|
||||
const selectedIndex = this.selectedIndex;
|
||||
const type = parseInt(this.options[selectedIndex].dataset.type);
|
||||
if ([4, 5].includes(type)) {
|
||||
if (!answerValueInput.hasClass("show")) answerValueInput.addClass("show");
|
||||
} else {
|
||||
answerValueInput.removeClass("show");
|
||||
}
|
||||
|
||||
if ([5, 6].includes(type)) {
|
||||
if (!imageInput.hasClass("show")) imageInput.addClass("show");
|
||||
} else {
|
||||
imageInput.removeClass("show");
|
||||
}
|
||||
|
||||
if ([6].includes(type)) {
|
||||
if (!hideAnswerSelect.hasClass("show")) hideAnswerSelect.addClass("show");
|
||||
} else {
|
||||
hideAnswerSelect.removeClass("show");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const successflashMessage = document.querySelector(".custom-flash-message.success");
|
||||
const errorflashMessage = document.querySelector(".custom-flash-message.error");
|
||||
|
||||
const el = document.getElementById("sortable-list");
|
||||
if (el) {
|
||||
var sortable = new Sortable(el, {
|
||||
group: "list-1",
|
||||
ghostClass: "blue-background-class",
|
||||
sort: true,
|
||||
animation: 150,
|
||||
dataIdAttr: "data-id",
|
||||
draggable: ".accordion",
|
||||
handle: ".accordion",
|
||||
chosenClass: "active",
|
||||
onChoose: function (evt) {},
|
||||
onEnd: function (evt) {},
|
||||
onChange: function (evt) {},
|
||||
});
|
||||
}
|
||||
|
||||
function showMessage(message, type, errorObj = {}) {
|
||||
if (type == "error") {
|
||||
if (Object.keys(errorObj).length > 0) {
|
||||
let errors = ``;
|
||||
Object.keys(errorObj).forEach(function (key) {
|
||||
errors += errorObj[key];
|
||||
errors += "</br>";
|
||||
});
|
||||
errorflashMessage.innerHTML = errors;
|
||||
} else {
|
||||
errorflashMessage.innerText = message;
|
||||
}
|
||||
errorflashMessage.classList.add("show");
|
||||
setTimeout(() => {
|
||||
errorflashMessage.classList.remove("show");
|
||||
}, 5000);
|
||||
} else if (type == "success") {
|
||||
successflashMessage.classList.add("show");
|
||||
successflashMessage.innerText = message;
|
||||
setTimeout(() => {
|
||||
successflashMessage.classList.remove("show");
|
||||
}, 5000);
|
||||
}
|
||||
}
|
||||
|
||||
function submitAddAnswerForm() {
|
||||
//check for required
|
||||
const addAnswerForm = document.getElementById("add-answer-modal-form");
|
||||
const questionType = addAnswerForm.querySelector("#add_form_question_type").value;
|
||||
const answer = addAnswerForm.querySelector("#add_form_answer").value;
|
||||
const answerValue = addAnswerForm.querySelector("#add_form_answer_value").value;
|
||||
const image = addAnswerForm.querySelector("input[data-target='add_form_image']").value;
|
||||
if (!answer) {
|
||||
return showMessage("Answer field is missing", "error");
|
||||
}
|
||||
if (questionType == 5 || questionType == 4) {
|
||||
if (!answerValue) {
|
||||
return showMessage("Answer value field is missing", "error");
|
||||
}
|
||||
}
|
||||
if (questionType == 5) {
|
||||
if (!image) {
|
||||
return showMessage("Image field is missing", "error");
|
||||
}
|
||||
}
|
||||
addAnswerForm.submit();
|
||||
}
|
||||
|
||||
function clearImage(el) {
|
||||
el.parentElement.querySelector("#file_image_id").value = "";
|
||||
el.parentElement.querySelector("#media_image_id").src = "/image/placeholder-image.png";
|
||||
}
|
||||
|
||||
function confirmDelete(self) {
|
||||
if (confirm("Are you sure you want to delete this answer?")) window.location.href = self.getAttribute("href");
|
||||
}
|
||||
|
||||
function changeDimension(type, self) {
|
||||
if (type == "width") {
|
||||
mcqiImageDimensionBox.style.width = `${self.value ? self.value : 0}px`;
|
||||
} else if (type == "height") {
|
||||
mcqiImageDimensionBox.style.height = `${self.value ? self.value : 0}px`;
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,364 @@
|
||||
/*Powered By: Manaknightdigital Inc. https://manaknightdigital.com/ Year: 2019*/
|
||||
$(document).ready(function() {
|
||||
var page = 0;
|
||||
var num_page = 0;
|
||||
var image_selected = "";
|
||||
var field = "";
|
||||
});
|
||||
|
||||
// ====== Assets ===========
|
||||
window.asset_page = 0;
|
||||
window.asset_num_page = 0;
|
||||
window.asset_per_page = 0;
|
||||
window.asset_num_item = 0;
|
||||
window.asset_selected_id = 0;
|
||||
window.asset_selected_img = "";
|
||||
|
||||
// ====== CROPPING ===========
|
||||
window.crop_object = null;
|
||||
window.crop_width = 500;
|
||||
window.crop_height = 500;
|
||||
window.crop_boundary_width = 500;
|
||||
window.crop_boundary_height = 500;
|
||||
window.crop_output_image = "output_image";
|
||||
window.crop_image_id = 0;
|
||||
window.crop_image_url = "";
|
||||
|
||||
$(document).ready(function() {
|
||||
$(".mkd-close-modal").click(function() {
|
||||
$("#mkd-media-gallery-wrapper").html("");
|
||||
|
||||
window.asset_page = 0;
|
||||
window.asset_num_page = 0;
|
||||
window.asset_per_page = 0;
|
||||
window.asset_num_item = 0;
|
||||
window.asset_selected_id = 0;
|
||||
window.asset_selected_img = "";
|
||||
|
||||
if (window.crop_object) {
|
||||
window.crop_object.destroy();
|
||||
}
|
||||
window.crop_object = null;
|
||||
window.crop_width = 500;
|
||||
window.crop_height = 500;
|
||||
window.crop_boundary_width = 500;
|
||||
window.crop_boundary_height = 500;
|
||||
window.crop_output_image = "output_image";
|
||||
window.crop_image_id = 0;
|
||||
window.crop_image_url = "";
|
||||
$("#mkd-media-gallery-container").show();
|
||||
$(".mkd-media-panel-1").show();
|
||||
$(".mkd-media-panel-3").hide();
|
||||
$("#mkd-media-upload-container").hide();
|
||||
$("#mkd-media-crop-container").hide();
|
||||
$(".mkd-media-panel-2").hide();
|
||||
});
|
||||
$("#mkd-media-choose").click(function() {
|
||||
if (window.asset_selected_id != 0) {
|
||||
$("#" + window.crop_image_id).val(window.asset_selected_id);
|
||||
$("#" + window.crop_image_url).val(window.asset_selected_img);
|
||||
$("#" + window.crop_output_image).attr("src", window.asset_selected_img);
|
||||
$("#mkd-media-gallery").modal("hide");
|
||||
$("#mkd-media-upload-container").hide();
|
||||
$("#mkd-media-crop-container").hide();
|
||||
$("#mkd-media-gallery-container").show();
|
||||
$(".mkd-media-panel-1").show();
|
||||
$(".mkd-media-panel-2").hide();
|
||||
$(".mkd-media-panel-3").hide();
|
||||
$("#mkd-media-gallery-wrapper").html("");
|
||||
|
||||
window.asset_page = 0;
|
||||
window.asset_num_page = 0;
|
||||
window.asset_per_page = 0;
|
||||
window.asset_num_item = 0;
|
||||
window.asset_selected_id = 0;
|
||||
window.asset_selected_img = "";
|
||||
|
||||
window.crop_object = null;
|
||||
window.crop_width = 500;
|
||||
window.crop_height = 500;
|
||||
window.crop_boundary_width = 500;
|
||||
window.crop_boundary_height = 500;
|
||||
window.crop_output_image = "output_image";
|
||||
window.crop_image_id = 0;
|
||||
window.crop_image_url = "";
|
||||
}
|
||||
});
|
||||
$("#mkd-load-more").click(function() {
|
||||
if (window.asset_page + window.asset_per_page >= window.asset_num_item) {
|
||||
$("#mkd-load-more-container").hide();
|
||||
}
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "/v1/api/assets/" + window.asset_page
|
||||
}).done(function(result) {
|
||||
window.asset_page = result.page;
|
||||
window.asset_num_page = result.num_page;
|
||||
window.asset_num_item = result.num_item;
|
||||
window.asset_per_page = result.per_page;
|
||||
var items = result.item;
|
||||
for (var i = 0; i < items.length; i++) {
|
||||
var element = items[i];
|
||||
$("#mkd-media-gallery-wrapper").append(
|
||||
'<div class="col-md-2 mb-2"><img data-id="' +
|
||||
element.id +
|
||||
'"src="' +
|
||||
element.url +
|
||||
'" alt="" onerror="if (this.src != \'/uploads/placeholder.jpg\') this.src = \'/uploads/placeholder.jpg\';" class="img-fluid mkd-gallery-image-image"></div>'
|
||||
);
|
||||
}
|
||||
|
||||
if (window.asset_page + window.asset_per_page >= window.asset_num_item) {
|
||||
$("#mkd-load-more-container").hide();
|
||||
}
|
||||
window.asset_page = window.asset_page + window.asset_per_page;
|
||||
|
||||
$(".mkd-gallery-image-image").click(function() {
|
||||
var id = Number($(this).attr("data-id"));
|
||||
$(this).addClass("active");
|
||||
window.asset_selected_id = id;
|
||||
window.asset_selected_img = $(this).attr("src");
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
$(".mkd-choose-image").click(function() {
|
||||
var view_width = Number($(this).attr("data-view-width"));
|
||||
var view_height = Number($(this).attr("data-view-height"));
|
||||
var boundary_width = Number($(this).attr("data-boundary-width"));
|
||||
var boundary_height = Number($(this).attr("data-boundary-height"));
|
||||
var image_preview = $(this).attr("data-image-preview");
|
||||
var image_id = $(this).attr("data-image-id");
|
||||
var image_url = $(this).attr("data-image-url");
|
||||
window.crop_output_image = image_preview;
|
||||
window.crop_image_id = image_id;
|
||||
window.crop_image_url = image_url;
|
||||
|
||||
if (Number.isInteger(view_width)) {
|
||||
window.crop_width = Number(view_width);
|
||||
}
|
||||
if (Number.isInteger(view_height)) {
|
||||
window.crop_height = Number(view_height);
|
||||
}
|
||||
if (Number.isInteger(boundary_width)) {
|
||||
window.crop_boundary_width = Number(boundary_width);
|
||||
}
|
||||
if (Number.isInteger(boundary_height)) {
|
||||
window.crop_boundary_height = Number(boundary_height);
|
||||
}
|
||||
$("#mkd-media-gallery").modal("show");
|
||||
$("#mkd-load-more-container").show();
|
||||
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "/v1/api/assets/0"
|
||||
}).done(function(result) {
|
||||
window.asset_page = result.page;
|
||||
window.asset_num_page = result.num_page;
|
||||
window.asset_num_item = result.num_item;
|
||||
window.asset_per_page = result.per_page;
|
||||
var items = result.item;
|
||||
for (var i = 0; i < items.length; i++) {
|
||||
var element = items[i];
|
||||
$("#mkd-media-gallery-wrapper").append(
|
||||
'<div class="col-md-2 mb-2"><img data-id="' +
|
||||
element.id +
|
||||
'"src="' +
|
||||
element.url +
|
||||
'" alt="" onerror="if (this.src != \'/uploads/placeholder.jpg\') this.src = \'/uploads/placeholder.jpg\';" class="img-fluid mkd-gallery-image-image"></div>'
|
||||
);
|
||||
}
|
||||
|
||||
if (result.page + result.per_page >= result.num_item) {
|
||||
$("#mkd-load-more-container").hide();
|
||||
}
|
||||
|
||||
window.asset_page = window.asset_page + window.asset_per_page;
|
||||
|
||||
$(".mkd-gallery-image-image").click(function() {
|
||||
var id = Number($(this).attr("data-id"));
|
||||
$(this).addClass("active");
|
||||
window.asset_selected_id = id;
|
||||
window.asset_selected_img = $(this).attr("src");
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
$("#mkd-media-upload").click(function() {
|
||||
$("#mkd-media-gallery-container").hide();
|
||||
$(".mkd-media-panel-1").hide();
|
||||
$(".mkd-media-panel-3").hide();
|
||||
$("#mkd-media-upload-container").show();
|
||||
$(".mkd-media-panel-2").show();
|
||||
});
|
||||
|
||||
mkd_events.subscribe("crop_image", function(e) {
|
||||
$("#mkd-media-upload-container").hide();
|
||||
$("#mkd-media-crop-container").show();
|
||||
$(".mkd-media-panel-1").hide();
|
||||
$(".mkd-media-panel-2").hide();
|
||||
$(".mkd-media-panel-3").show();
|
||||
|
||||
var el = document.getElementById("mkd-crop-upload-container");
|
||||
window.crop_object = new Croppie(el, {
|
||||
enableExif: true,
|
||||
viewport: {
|
||||
width: window.crop_width,
|
||||
height: window.crop_height
|
||||
},
|
||||
boundary: {
|
||||
width: window.crop_boundary_width,
|
||||
height: window.crop_boundary_height
|
||||
}
|
||||
});
|
||||
|
||||
window.crop_object.bind({
|
||||
url: e.url
|
||||
});
|
||||
|
||||
$("#mkd-media-crop").click(function() {
|
||||
window.crop_object
|
||||
.result({
|
||||
type: "base64",
|
||||
format: "png"
|
||||
})
|
||||
.then(function(base64) {
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: "/v1/api/image/upload",
|
||||
data: {
|
||||
image: base64
|
||||
}
|
||||
})
|
||||
.done(function(result) {
|
||||
mkd_events.publish("image_uploaded", result);
|
||||
})
|
||||
.fail(function(jqXHR, textStatus) {
|
||||
alert("Image Upload Failed");
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
mkd_events.subscribe("file_upload", function(e) {
|
||||
var formData = new FormData();
|
||||
formData.append("file", e.url, "file");
|
||||
$.ajax({
|
||||
url: "/v1/api/file/upload",
|
||||
type: "post",
|
||||
data: formData,
|
||||
processData: false,
|
||||
contentType: false,
|
||||
cache: false,
|
||||
async: false,
|
||||
success: function(data) {
|
||||
$("#" + e.id).val(data.file);
|
||||
$("#" + e.id + "_id").val(data.id);
|
||||
$("#" + e.id + "_text").html(data.file);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
mkd_events.subscribe("image_uploaded", function(e) {
|
||||
$("#mkd-media-gallery").modal("hide");
|
||||
$("#mkd-media-upload-container").hide();
|
||||
$("#mkd-media-crop-container").hide();
|
||||
$("#mkd-media-gallery-container").show();
|
||||
$(".mkd-media-panel-1").show();
|
||||
$(".mkd-media-panel-2").hide();
|
||||
$(".mkd-media-panel-3").hide();
|
||||
$("#" + window.crop_output_image).attr("src", e.image);
|
||||
$("#" + window.crop_image_id).val(e.id);
|
||||
$("#" + window.crop_image_url).val(e.image);
|
||||
$("#mkd-media-gallery-wrapper").html("");
|
||||
|
||||
window.asset_page = 0;
|
||||
window.asset_num_page = 0;
|
||||
window.asset_num_item = 0;
|
||||
window.asset_selected_id = 0;
|
||||
window.asset_selected_img = "";
|
||||
|
||||
if (window.crop_object) {
|
||||
window.crop_object.destroy();
|
||||
}
|
||||
window.crop_object = null;
|
||||
window.crop_width = 500;
|
||||
window.crop_height = 500;
|
||||
window.crop_boundary_width = 500;
|
||||
window.crop_boundary_height = 500;
|
||||
window.crop_output_image = "output_image";
|
||||
window.crop_image_id = 0;
|
||||
window.crop_image_url = "";
|
||||
});
|
||||
|
||||
mkd_events.subscribe("file_import", function(e) {
|
||||
var formData = new FormData();
|
||||
formData.append("file", e.url, "file");
|
||||
$.ajax({
|
||||
url: "/v1/api/file/import/" + e.model,
|
||||
type: "post",
|
||||
data: formData,
|
||||
processData: false,
|
||||
contentType: false,
|
||||
cache: false,
|
||||
async: false,
|
||||
success: function(data) {
|
||||
alert("Imported Data successfully");
|
||||
},
|
||||
error: function(error) {
|
||||
alert("Error: " + error.responseJSON.message);
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
function onFileSelected(event) {
|
||||
var selectedFile = event.target.files[0];
|
||||
var reader = new FileReader();
|
||||
reader.onload = function(e) {
|
||||
mkd_events.publish("crop_image", {
|
||||
url: e.target.result
|
||||
});
|
||||
};
|
||||
reader.readAsDataURL(selectedFile);
|
||||
}
|
||||
|
||||
function onFileUploaded(event, id) {
|
||||
var selectedFile = event.target.files[0];
|
||||
var reader = new FileReader();
|
||||
reader.onload = function(e) {
|
||||
mkd_events.publish("file_upload", {
|
||||
url: selectedFile,
|
||||
id: id
|
||||
});
|
||||
};
|
||||
reader.readAsDataURL(selectedFile);
|
||||
}
|
||||
|
||||
function onFileImport(event, model) {
|
||||
alert(
|
||||
"Remember to have to the following in CSV: \n1.All field seperate by ;. \n2.ID is first field. \n3.All field wrap around with double quotes.\n4.1 line per row.\n5.No header row."
|
||||
);
|
||||
var selectedFile = event.target.files[0];
|
||||
var reader = new FileReader();
|
||||
reader.onload = function(e) {
|
||||
mkd_events.publish("file_import", {
|
||||
url: selectedFile,
|
||||
model: model
|
||||
});
|
||||
};
|
||||
reader.readAsDataURL(selectedFile);
|
||||
}
|
||||
|
||||
function fixBrokenImages(url) {
|
||||
var img = document.getElementsByTagName("img");
|
||||
var i = 0,
|
||||
l = img.length;
|
||||
for (; i < l; i++) {
|
||||
var t = img[i];
|
||||
if (t.naturalWidth === 0) {
|
||||
//this image is broken
|
||||
t.src = url;
|
||||
}
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
Vendored
+4033
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,48 @@
|
||||
var canvas = document.getElementById('signature-pad');
|
||||
|
||||
// Adjust canvas coordinate space taking into account pixel ratio,
|
||||
// to make it look crisp on mobile devices.
|
||||
// This also causes canvas to be cleared.
|
||||
|
||||
function resizeCanvas() {
|
||||
// When zoomed out to less than 100%, for some very strange reason,
|
||||
// some browsers report devicePixelRatio as less than 1
|
||||
// and only part of the canvas is cleared then.
|
||||
var ratio = Math.max(window.devicePixelRatio || 1, 1);
|
||||
canvas.width = canvas.offsetWidth * ratio;
|
||||
canvas.height = canvas.offsetHeight * ratio;
|
||||
canvas.getContext('2d').scale(ratio, ratio);
|
||||
}
|
||||
|
||||
if (canvas) {
|
||||
window.onresize = resizeCanvas;
|
||||
resizeCanvas();
|
||||
}
|
||||
|
||||
var signaturePad = new SignaturePad(canvas, {
|
||||
backgroundColor: 'rgb(255, 255, 255)', // necessary for saving image as JPEG; can be removed is only saving as PNG or SVG
|
||||
});
|
||||
|
||||
document.getElementById('save-png').addEventListener('click', function () {
|
||||
if (signaturePad.isEmpty()) {
|
||||
return alert('Please provide a signature first.');
|
||||
}
|
||||
|
||||
var data = signaturePad.toDataURL('image/png');
|
||||
console.log(data);
|
||||
});
|
||||
|
||||
document.getElementById('clear').addEventListener('click', function () {
|
||||
signaturePad.clear();
|
||||
});
|
||||
|
||||
document.getElementById('draw').addEventListener('click', function () {
|
||||
var ctx = canvas.getContext('2d');
|
||||
console.log(ctx.globalCompositeOperation);
|
||||
ctx.globalCompositeOperation = 'source-over'; // default value
|
||||
});
|
||||
|
||||
document.getElementById('erase').addEventListener('click', function () {
|
||||
var ctx = canvas.getContext('2d');
|
||||
ctx.globalCompositeOperation = 'destination-out';
|
||||
});
|
||||
@@ -0,0 +1,24 @@
|
||||
if (document.getElementById('mkd-suneditor')) {
|
||||
SUNEDITOR.create(document.getElementById('mkd-suneditor') || 'mkd-suneditor', {
|
||||
// All of the plugins are loaded in the "window.SUNEDITOR" object in dist/suneditor.min.js file
|
||||
// Insert options
|
||||
// Language global object (default: en)
|
||||
height: 500,
|
||||
width: '100%',
|
||||
buttonList: [
|
||||
// Default
|
||||
['undo', 'redo'],
|
||||
['font', 'fontSize', 'formatBlock'],
|
||||
['paragraphStyle', 'blockquote'],
|
||||
['bold', 'underline', 'italic', 'strike', 'subscript', 'superscript'],
|
||||
['fontColor', 'hiliteColor', 'textStyle'],
|
||||
['removeFormat'],
|
||||
['outdent', 'indent'],
|
||||
['align', 'horizontalRule', 'list', 'lineHeight'],
|
||||
['table', 'link', 'image', 'video', 'audio'],
|
||||
['imageGallery'],
|
||||
['fullScreen', 'showBlocks', 'codeView'],
|
||||
['preview', 'print'],
|
||||
],
|
||||
});
|
||||
}
|
||||
Reference in New Issue
Block a user