Zenjob Notes, and new Templates
This commit is contained in:
Norm Rasmussen
@ -0,0 +1,242 @@
|
||||
{% include "header" %}
|
||||
{% include "sub_navigation" %}
|
||||
<div class="mo-search-wrapper">
|
||||
<div class="mo-search-header">Filter by progress : </div>
|
||||
<div class="filter-wrapper mo-filter-btn uk-text-bold mo-active-filter-prog np-button">
|
||||
<select onchange="filterCourse()">
|
||||
<option class="mo-filter-item" selected disabled hidden>All</option>
|
||||
<option class="mo-filter-item" value="a">All</option>
|
||||
<option class="mo-filter-item" value="n">Not Started</option>
|
||||
<option class="mo-filter-item" value="i">In Progress</option>
|
||||
<option class="mo-filter-item" value="c">Completed</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<main class="np-main np-dashboard np-subpage-container np-max-width">
|
||||
<div class="row np-flex-center">
|
||||
<div class="col-xs-12 col-sm-8">
|
||||
{% if features.learning_paths? %}
|
||||
<div class="np-dashboard-resources-title">
|
||||
{% t shared.learning_paths %}
|
||||
</div>
|
||||
{% include "learning_paths_index", items: learning_paths.enrolled %}
|
||||
{% endif %}
|
||||
<div class="np-dashboard-resources-title">
|
||||
{% t shared.course_vocabulary.plural, key: current_school.course_vocabulary %}
|
||||
</div>
|
||||
{% include "courses_index" %}
|
||||
</div>
|
||||
{% if features.training_events? %}
|
||||
<div class="np-grid-spacing col-xs-12 col-sm-4">
|
||||
<div class="np-dashboard-resources-title">
|
||||
{% t .upcoming_events %}
|
||||
</div>
|
||||
{% include "training_events_dashboard" %}
|
||||
{% endif %}
|
||||
<div class="np-dashboard-resources-title">
|
||||
Achievements
|
||||
</div>
|
||||
<div class="">
|
||||
{% include "achievements" %}
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
<div class="np-dashboard-resources-title">
|
||||
Course Progress
|
||||
</div>
|
||||
{% include "completion_dashboard" %}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||||
<script>
|
||||
|
||||
|
||||
console.log($('#dash-sort').children())
|
||||
function textDisplayCount() {
|
||||
let courseCount = $('#dash-sort').children().length;
|
||||
return courseCount
|
||||
}
|
||||
function selectAll() {
|
||||
$(".select-selected").html("All").change();
|
||||
filterCourse()
|
||||
$(".select-items div").each(function() {
|
||||
if($( this ).text() == $(".select-selected").text()) {
|
||||
$(this).addClass("same-as-selected");
|
||||
} else {
|
||||
$(this).removeClass("same-as-selected");
|
||||
}
|
||||
});
|
||||
$(".missing").hide();
|
||||
}
|
||||
function filterCourse() {
|
||||
let opt = document.getElementsByClassName("select-selected")[0]
|
||||
if (opt.innerText == "All") {
|
||||
$('#dash-sort').children().each(function (i) {
|
||||
$(this).show();
|
||||
});
|
||||
if(textDisplayCount() === 0) {
|
||||
$(".all").show();
|
||||
$(".not-started").hide();
|
||||
$(".in-progress").hide();
|
||||
$(".completed").hide();
|
||||
} else {
|
||||
$(".all").hide();
|
||||
$(".not-started").hide();
|
||||
$(".in-progress").hide();
|
||||
$(".completed").hide();
|
||||
}
|
||||
} else if(opt.innerText == "Not Started") {
|
||||
$('#dash-sort').children().each(function (i) {
|
||||
if($(this).attr("id") == 0) {
|
||||
$(this).show();
|
||||
} else {
|
||||
$(this).hide();
|
||||
}
|
||||
});
|
||||
if(textDisplayCount() === 0) {
|
||||
$(".all").hide();
|
||||
$(".not-started").show();
|
||||
$(".in-progress").hide();
|
||||
$(".completed").hide();
|
||||
} else {
|
||||
$(".all").hide();
|
||||
$(".not-started").hide();
|
||||
$(".in-progress").hide();
|
||||
$(".completed").hide();
|
||||
}
|
||||
} else if (opt.innerText == "In Progress") {
|
||||
$('#dash-sort').children().each(function (i) {
|
||||
if($(this).attr("id") == 0 || $(this).attr("id") == 100) {
|
||||
$(this).hide();
|
||||
} else {
|
||||
$(this).show();
|
||||
}
|
||||
});
|
||||
if(textDisplayCount() === 0) {
|
||||
$(".all").hide();
|
||||
$(".not-started").hide();
|
||||
$(".in-progress").show();
|
||||
$(".completed").hide();
|
||||
} else {
|
||||
$(".all").hide();
|
||||
$(".not-started").hide();
|
||||
$(".in-progress").hide();
|
||||
$(".completed").hide();
|
||||
}
|
||||
} else if(opt.innerText == "Completed") {
|
||||
$('#dash-sort').children().each(function (i) {
|
||||
if($(this).attr("id") == 100) {
|
||||
$(this).show();
|
||||
} else {
|
||||
$(this).hide();
|
||||
}
|
||||
});
|
||||
if(textDisplayCount() === 0) {
|
||||
$(".all").hide();
|
||||
$(".not-started").hide();
|
||||
$(".in-progress").hide();
|
||||
$(".completed").show();
|
||||
} else {
|
||||
$(".all").hide();
|
||||
$(".not-started").hide();
|
||||
$(".in-progress").hide();
|
||||
$(".completed").hide();
|
||||
}
|
||||
}
|
||||
$("#prog-filter").css("background", "#06a6b7")
|
||||
}
|
||||
</script>
|
||||
<script>
|
||||
var x, i, j, l, ll, selElmnt, a, b, c;
|
||||
/* Look for any elements with the class "filter-wrapper": */
|
||||
x = document.getElementsByClassName("filter-wrapper");
|
||||
l = x.length;
|
||||
for (i = 0; i < l; i++) {
|
||||
selElmnt = x[i].getElementsByTagName("select")[0];
|
||||
ll = selElmnt.length;
|
||||
/* For each element, create a new DIV that will act as the selected item: */
|
||||
a = document.createElement("DIV");
|
||||
a.setAttribute("class", "select-selected");
|
||||
a.innerHTML = selElmnt.options[selElmnt.selectedIndex].innerHTML;
|
||||
x[i].appendChild(a);
|
||||
/* For each element, create a new DIV that will contain the option list: */
|
||||
b = document.createElement("DIV");
|
||||
b.setAttribute("class", "select-items select-hide");
|
||||
for (j = 1; j < ll; j++) {
|
||||
/* For each option in the original select element,
|
||||
create a new DIV that will act as an option item: */
|
||||
c = document.createElement("DIV");
|
||||
c.innerHTML = selElmnt.options[j].innerHTML;
|
||||
c.addEventListener("click", function(e) {
|
||||
/* When an item is clicked, update the original select box,
|
||||
and the selected item: */
|
||||
var y, i, k, s, h, sl, yl;
|
||||
s = this.parentNode.parentNode.getElementsByTagName("select")[0];
|
||||
sl = s.length;
|
||||
h = this.parentNode.previousSibling;
|
||||
for (i = 0; i < sl; i++) {
|
||||
if (s.options[i].innerHTML == this.innerHTML) {
|
||||
s.selectedIndex = i;
|
||||
h.innerHTML = this.innerHTML;
|
||||
y = this.parentNode.getElementsByClassName("same-as-selected");
|
||||
yl = y.length;
|
||||
for (k = 0; k < yl; k++) {
|
||||
y[k].removeAttribute("class");
|
||||
}
|
||||
this.setAttribute("class", "same-as-selected");
|
||||
break;
|
||||
}
|
||||
}
|
||||
filterCourse()
|
||||
h.click();
|
||||
});
|
||||
b.appendChild(c);
|
||||
}
|
||||
x[i].appendChild(b);
|
||||
a.addEventListener("click", function(e) {
|
||||
/* When the select box is clicked, close any other select boxes,
|
||||
and open/close the current select box: */
|
||||
e.stopPropagation();
|
||||
closeAllSelect(this);
|
||||
this.nextSibling.classList.toggle("select-hide");
|
||||
this.classList.toggle("select-arrow-active");
|
||||
});
|
||||
}
|
||||
|
||||
function closeAllSelect(elmnt) {
|
||||
/* A function that will close all select boxes in the document,
|
||||
except the current select box: */
|
||||
var x, y, i, xl, yl, arrNo = [];
|
||||
x = document.getElementsByClassName("select-items");
|
||||
y = document.getElementsByClassName("select-selected");
|
||||
xl = x.length;
|
||||
yl = y.length;
|
||||
for (i = 0; i < yl; i++) {
|
||||
if (elmnt == y[i]) {
|
||||
arrNo.push(i)
|
||||
} else {
|
||||
y[i].classList.remove("select-arrow-active");
|
||||
}
|
||||
}
|
||||
for (i = 0; i < xl; i++) {
|
||||
if (arrNo.indexOf(i)) {
|
||||
x[i].classList.add("select-hide");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* If the user clicks anywhere outside the select box,
|
||||
then close all select boxes: */
|
||||
document.addEventListener("click", closeAllSelect);
|
||||
|
||||
$(document).ready(function () {
|
||||
$(".select-items div").each(function() {
|
||||
if($( this ).text() == $(".select-selected").text()) {
|
||||
$(this).addClass("same-as-selected");
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user