inside out project STEP-106 to STEP-107 app.js Code Changes
// inside out project STEP-106
// inside out project STEP-106
window.onload = init();
window.onload = init();
function init() {
function init() {
window.addEventListener('scroll', function(e) {
window.addEventListener('scroll', function(e) {
var distanceY = window.pageYOffset || document.documentElement.scrollTop,
var distanceY = window.pageYOffset || document.documentElement.scrollTop,
shrinkOn = 300,
shrinkOn = 300,
header = document.querySelector("header");
header = document.querySelector("header");
if (distanceY > shrinkOn) {
if (distanceY > shrinkOn) {
classie.add(header, "smaller");
classie.add(header, "smaller");
} else {
} else {
if (classie.has(header, "smaller")) {
if (classie.has(header, "smaller")) {
classie.remove(header, "smaller");
classie.remove(header, "smaller");
}
}
}
}
});
});
$.ajax({
$.ajax({
method: 'GET',
method: 'GET',
url: 'https://me.inside-out-project.com/wp-json/wp-api-menus/v2/menus/3',
url: 'https://me.inside-out-project.com/wp-json/wp-api-menus/v2/menus/3',
dataType: 'json',
dataType: 'json',
success: function(data) {
success: function(data) {
$('nav').hide();
$('nav').hide();
var menu = menuBuilder(data.items);
var menu = menuBuilder(data.items);
$('nav').html(menu).slideDown();
$('nav').html(menu).slideDown();
$('nav li a').click(function() {
$('nav li a').click(function() {
getPage($(this).data("pgid"));
getPage($(this).data("pgid"), $(this).data("callkind"));
});
});
getPage(314);
getPage(314,'pages');
$("#loaderDiv").fadeOut("slow");
$("#loaderDiv").fadeOut("slow");
},
},
error: function() {
error: function() {
console.log('all is not good');
console.log('all is not good');
}
}
});
});
$.ajax({
$.ajax({
method: 'GET',
method: 'GET',
url: 'https://me.inside-out-project.com/wp-json/wp-api-menus/v2/menus/12',
url: 'https://me.inside-out-project.com/wp-json/wp-api-menus/v2/menus/12',
dataType: 'json',
dataType: 'json',
success: function (data) {
success: function (data) {
var menu = menuBuilder(data.items, 'genLinks', 'footer-ul');
var menu = menuBuilder(data.items, 'genLinks', 'footer-ul');
$('#genLinks').replaceWith(menu);
$('#genLinks').replaceWith(menu);
$('#genLinks li a').click(function () {
$('#genLinks li a').click(function () {
getPage($(this).data("pgid"));
getPage($(this).data("pgid"), $(this).data("callkind"));
});
});
},
},
error: function () {
error: function () {
console.log('all is not good');
console.log('all is not good');
}
}
});
});
getPosts();
}
}
function menuBuilder(obj, targetEl, classInfo) {
function menuBuilder(obj, targetEl, classInfo) {
var theMenu = '';
var theMenu = '';
if (obj.length > 0) {
if (obj.length > 0) {
let target = (targetEl)?' id="'+targetEl+'"':'';
let target = (targetEl)?' id="'+targetEl+'"':'';
let elClass = (classInfo)?' class="'+classInfo+'"':'';
let elClass = (classInfo)?' class="'+classInfo+'"':'';
theMenu = theMenu + '<ul'+target+''+elClass+'>';
theMenu = theMenu + '<ul'+target+''+elClass+'>';
console.log(theMenu+' '+target);
obj.forEach(function (item) {
obj.forEach(function (item) {
theMenu = theMenu + '<li><a href="#" data-pgid="' + item.object_id + '">' + item.title + '</a>';
theMenu = theMenu + '<li><a href="#" data-pgid="' + item.object_id + '" data-callkind="pages">' + item.title + '</a>';
if (item.children) {
if (item.children) {
theMenu = theMenu + menuBuilder(item.children);
theMenu = theMenu + menuBuilder(item.children);
}
}
theMenu = theMenu + '</li>';
theMenu = theMenu + '</li>';
});
});
theMenu = theMenu + '</ul>';
theMenu = theMenu + '</ul>';
} else {
} else {
console.log('no data');
console.log('no data');
}
}
return theMenu;
return theMenu;
}
}
function getPage(obj) {
function getPage(objId, objType) {
$("#loaderDiv").fadeIn("slow");
$("#loaderDiv").fadeIn("slow");
$('html').animate({scrollTop: 0}, 'slow');
$.ajax({
$.ajax({
method: 'GET',
method: 'GET',
url: 'https://me.inside-out-project.com/wp-json/wp/v2/pages/' + obj,
url: 'https://me.inside-out-project.com/wp-json/wp/v2/'+objType+'/' + objId,
dataType: 'json',
dataType: 'json',
success: function(data) {
success: function(data) {
var pgbuild = '';
var pgbuild = '';
pgbuild = '<section><div class="container">' + data.content.rendered + '</div></section>';
pgbuild = '<section><div class="container">' + data.content.rendered + '</div></section>';
$("#content").fadeOut(function() {
$("#content").fadeOut(function() {
$('html').animate({
scrollTop: 0
}, 'slow'); //IE, FF
$('body').animate({
scrollTop: 0
}, 'slow'); //chrome, don't know if Safari works
$(this).html(pgbuild).fadeIn();
$(this).html(pgbuild).fadeIn();
$("#loaderDiv").fadeOut("slow");
$("#loaderDiv").fadeOut("slow");
});
});
},
},
error: function() {
error: function() {
console.log('bad');
console.log('bad');
}
}
});
});
}
}
function getPosts() {
$.ajax({
method: 'GET',
url: 'https://me.inside-out-project.com/wp-json/wp/v2/posts?orderby=date&order=asc&per_page=5',
dataType: 'json',
success: function (data) {
$("#latestPosts").html('<p id="postLdr"><i class="fa fa-cogs"></i> Loading Posts</p>');
data.forEach(function (item) {
var myDate = new Date(item.date);
$("#latestPosts").prepend('<p><a href="#" data-pgid="' + item.id + '" data-callkind="posts">' + item.title.rendered + '<span>' + myDate.getMonth() + '-' + myDate.getDay() + '-' + myDate.getFullYear() + '</span></a></p>');
});
$('#latestPosts p a').click(function () {
getPage($(this).data("pgid"), $(this).data("callkind"));
});
$("#postLdr").remove();
},
error: function () {
console.log('bad');
}
});
}