You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
475 lines
16 KiB
JavaScript
475 lines
16 KiB
JavaScript
// YOINKED, NEED TO WORK THROUGH TO CHANGE AND UNDERSTAND
|
|
|
|
function slickIt(id) {
|
|
|
|
// $(".slick-suitability-slider").each(function( index ) {
|
|
// if(!$(this).hasClass('slick-initialized')){
|
|
// $(this).slick({
|
|
// infinite: true,
|
|
// slidesToScroll: 1,
|
|
// slidesToShow: 4,
|
|
// responsive: [
|
|
// {
|
|
// breakpoint: 600,
|
|
// settings: {
|
|
// slidesToShow: 3
|
|
// }
|
|
// },
|
|
// {
|
|
// breakpoint: 500,
|
|
// settings: {
|
|
// slidesToShow: 2
|
|
// }
|
|
// },
|
|
// {
|
|
// breakpoint: 350,
|
|
// settings: {
|
|
// slidesToShow: 1
|
|
// }
|
|
// }
|
|
// ]
|
|
// });
|
|
// }
|
|
// });
|
|
// $(".slick-colours-slider").each(function( index ) {
|
|
// if(!$(this).hasClass('slick-initialized')){
|
|
// $(this).slick({
|
|
// infinite: true,
|
|
// slidesToScroll: 1,
|
|
// slidesToShow: 4,
|
|
// responsive: [
|
|
// {
|
|
// breakpoint: 600,
|
|
// settings: {
|
|
// slidesToShow: 3
|
|
// }
|
|
// },
|
|
// {
|
|
// breakpoint: 500,
|
|
// settings: {
|
|
// slidesToShow: 2
|
|
// }
|
|
// },
|
|
// {
|
|
// breakpoint: 350,
|
|
// settings: {
|
|
// slidesToShow: 1
|
|
// }
|
|
// }
|
|
// ]
|
|
// });
|
|
// }
|
|
// });
|
|
|
|
var sliders = document.querySelectorAll(id+' .tiny-slider-colours.v1');
|
|
$.each(sliders, function (index, value) {
|
|
if(!$(value).hasClass('tns-slider')){
|
|
let slider = tns({
|
|
container: value,
|
|
nav: false,
|
|
items: 1,
|
|
controlsText: ['<i class="far fa-chevron-left"></i>','<i class="far fa-chevron-right"></i>'],
|
|
responsive: {
|
|
600: {
|
|
items: 4
|
|
},
|
|
500: {
|
|
items: 3
|
|
},
|
|
350: {
|
|
items: 2
|
|
},
|
|
}
|
|
});
|
|
|
|
console.log('tiny-slider created: ' + index);
|
|
}
|
|
});
|
|
|
|
var sliders = document.querySelectorAll(id+' .tiny-slider-colours.v2');
|
|
$.each(sliders, function (index, value) {
|
|
if(!$(value).hasClass('tns-slider')){
|
|
let slider = tns({
|
|
container: value,
|
|
nav: false,
|
|
prevButton: false,
|
|
items: 1,
|
|
controlsText: ['<i class="far fa-chevron-left"></i>','<i class="far fa-chevron-right"></i>'],
|
|
fixedWidth: 40
|
|
// responsive: {
|
|
// 600: {
|
|
// items: 4
|
|
// },
|
|
// 500: {
|
|
// items: 3
|
|
// },
|
|
// 350: {
|
|
// items: 2
|
|
// },
|
|
// }
|
|
});
|
|
}
|
|
});
|
|
|
|
console.log('slickit');
|
|
|
|
|
|
}
|
|
|
|
// function to change query strings
|
|
function updateQueryStringParameter(uri, key, value) {
|
|
var re = new RegExp("([?&])" + key + "=.*?(&|$)", "i");
|
|
var separator = uri.indexOf('?') !== -1 ? "&" : "?";
|
|
if (uri.match(re)) {
|
|
return uri.replace(re, '$1' + key + "=" + value + '$2');
|
|
}
|
|
else {
|
|
return uri + separator + key + "=" + value;
|
|
}
|
|
}
|
|
function removeQueryStringParameter(uri, parameter) {
|
|
//prefer to use l.search if you have a location/link object
|
|
var urlparts = uri.split('?');
|
|
if (urlparts.length >= 2) {
|
|
var prefix = encodeURIComponent(parameter) + '=';
|
|
var pars = urlparts[1].split(/[&]/g);
|
|
//reverse iteration as may be destructive
|
|
for (var i = pars.length; i-- > 0;) {
|
|
//idiom for string.startsWith
|
|
if (pars[i].lastIndexOf(prefix, 0) !== -1) {
|
|
pars.splice(i, 1);
|
|
}
|
|
}
|
|
return urlparts[0] + (pars.length > 0 ? '?' + pars.join('&') : '');
|
|
}
|
|
return uri;
|
|
}
|
|
|
|
$(document).ready(function () {
|
|
|
|
if($("#current-page").data("page") == '1'){
|
|
history.pushState(null, null, removeQueryStringParameter(window.location.pathname + window.location.search, 'nP'));
|
|
}
|
|
|
|
original_title = $(document).attr("title");
|
|
pageChangeActive = false;
|
|
|
|
function getSliderSettings(){
|
|
return {
|
|
infinite: true,
|
|
slidesToShow: 8,
|
|
slidesToScroll: 1
|
|
}
|
|
}
|
|
|
|
function setPage(){
|
|
if (pageChangeActive === false) {
|
|
pageChangeActive = true;
|
|
|
|
setTimeout(function() {
|
|
pageChangeActive = false;
|
|
scrollTop = $(document).scrollTop() + $(window).height() - 200;
|
|
|
|
if($('.page-ref').length){
|
|
// set default page
|
|
page = $("#current-page").data("page");
|
|
|
|
$('.page-ref').each(function(i, obj) {
|
|
pos = $(obj).position().top;
|
|
|
|
if (scrollTop >= pos) {
|
|
page = $(obj).data('page');
|
|
}
|
|
});
|
|
}
|
|
else{
|
|
// set default page to body on load first page
|
|
page = $("#current-page").data("page");
|
|
$('body').attr('data-page', page);
|
|
}
|
|
|
|
// change page if different
|
|
if(parseInt(page) != parseInt($('body').attr('data-page'))){
|
|
if(page == 1){
|
|
// change url query string
|
|
history.pushState(null, null, removeQueryStringParameter(window.location.pathname + window.location.search, 'nP'));
|
|
// change title
|
|
$(document).attr("title", original_title);
|
|
}
|
|
else{
|
|
// change url query string
|
|
history.pushState(null, null, updateQueryStringParameter(window.location.pathname + window.location.search, 'nP', page));
|
|
// change title
|
|
var re = new RegExp("", "gm");
|
|
$(document).attr("title", original_title.replace(/ [-] page [0-9]+/gm, '') + ' - page ' + page);
|
|
}
|
|
// add current page to body
|
|
$('body').attr('data-page', page);
|
|
}
|
|
}, 500);
|
|
}
|
|
}
|
|
|
|
$(document).scroll(function() {
|
|
|
|
if(document.getElementById("infinite-scroll-marker") !== null) {
|
|
|
|
var scrollTop = $(this).scrollTop() + $(window).height();
|
|
var loadMore = $("#infinite-scroll-marker").position().top;
|
|
|
|
if (scrollTop >= loadMore) {
|
|
pageToLoad = $("#infinite-scroll-marker").data("page");
|
|
url = window.location.pathname + window.location.search;
|
|
|
|
// start FIXING DOUBLE NP - GT
|
|
// old
|
|
// if (url.indexOf("?") == -1) { url += "?"; }
|
|
// url += '&nP=' + pageToLoad + "&ajax=true";
|
|
|
|
// new
|
|
url = updateQueryStringParameter(url, 'nP', pageToLoad);
|
|
url += "&ajax=true";
|
|
// end FIXING DOUBLE NP - GT
|
|
|
|
$("#infinite-scroll-marker").remove();
|
|
$( "#ajaxproducts" ).append( '<div id="infinite-scroll-loader"><img src="/spinners/spinner_tapi_yellow.gif" /></div>' );
|
|
|
|
$.get( url, function( data ) {
|
|
if (data.indexOf("No products available") != -1) {
|
|
$("#infinite-scroll-loader").remove();
|
|
} else {
|
|
$("#infinite-scroll-loader").remove();
|
|
|
|
// add page reference
|
|
$( "#ajaxproducts" ).append('<div class="page-ref" data-page="'+pageToLoad+'"></div>');
|
|
|
|
data = data.replace('<div class="product-items">', '<div class="product-items" id="page_'+pageToLoad+'">');
|
|
data = data.replace('<div class="product-items v2">', '<div class="product-items v2" id="page_'+pageToLoad+'">');
|
|
$( "#ajaxproducts" ).append( data );
|
|
|
|
setTimeout(function() {
|
|
resizeTasks();
|
|
if(typeof resizeTasksPlp !== "undefined"){
|
|
resizeTasksPlp();
|
|
}
|
|
}, 3000);
|
|
var x = 1; var y = null;
|
|
setTimeout(function() { x = x * 3 + 2; y = x / 2; }, 1000);
|
|
$( "#ajaxproducts" ).append( '<div id="infinite-scroll-marker" data-page="' + (pageToLoad + 1) + '"></div>' );
|
|
var x = 1; var y = null;
|
|
setTimeout(function() { x = x * 3 + 2; y = x / 2; }, 1000);
|
|
}
|
|
|
|
}).success(function(data){
|
|
if (data.indexOf("No products available") == -1) {
|
|
// change url query string (next page)
|
|
history.pushState(null, null, updateQueryStringParameter(window.location.pathname + window.location.search, 'nP', pageToLoad));
|
|
// change title
|
|
$(document).attr("title", original_title.replace(/ [-] page [0-9]+/gm, '') + ' - page ' + pageToLoad);
|
|
// add current page to body
|
|
$('body').attr('data-page', pageToLoad);
|
|
slickIt('#page_'+pageToLoad);
|
|
|
|
// Move PLP banners content
|
|
if(typeof plpBannerMoveContent !== "undefined"){
|
|
plpBannerMoveContent();
|
|
}
|
|
|
|
// Rudderstack
|
|
window.rudderEventsQueue = window.rudderEventsQueue || [];
|
|
window.rudderEventsQueue?.push({
|
|
'event': 'plpPaginationScroll',
|
|
'page_path': window.location.pathname + window.location.search,
|
|
'page_title': $(document).attr("title")??'',
|
|
'page_number': pageToLoad??'',
|
|
});
|
|
|
|
}
|
|
else {
|
|
$("#infinite-scroll-loader").remove();
|
|
}
|
|
}).error(function(data){
|
|
$("#infinite-scroll-loader").remove();
|
|
});
|
|
}
|
|
|
|
setPage();
|
|
}
|
|
})
|
|
});
|
|
|
|
|
|
// USE EXAMPLE
|
|
// public function get_roomideas($filter = ""){
|
|
|
|
|
|
|
|
// // Get the room ideas
|
|
// $arrPageVariables = array();
|
|
// $ideasLimit = 6;
|
|
|
|
|
|
// // Calulcate which filter-type is our first param
|
|
// $colours = \DB::table("crud_room_ideas_filter_colours")->where("bolDeleted", "=", 0)->where("strSearchUrl", "=", $filter)->first();
|
|
// $rooms = \DB::table("crud_room_ideas_filter_rooms")->where("bolDeleted", "=", 0)->where("strSearchUrl", "=", $filter)->first();
|
|
// $types = \DB::table("crud_room_ideas_filter_types")->where("bolDeleted", "=", 0)->where("strSearchUrl", "=", $filter)->first();
|
|
|
|
// $colourFilter = "";
|
|
// $roomFilter = "";
|
|
// $typeFilter = "";
|
|
|
|
// $metaTitle = "Flooring Ideas | Tapi Carpets & Floors";
|
|
// $metaDescription = "Be inspired by our fantastic flooring ideas! Find the perfect colour and style of carpet, vinyl, laminate, or luxury vinyl to complete your room at Tapi.";
|
|
// $data['H1'] = "Flooring Ideas";
|
|
// $data['introductionText'] = "Whether you follow the latest flooring trends or you're a fan of more traditional flooring, we've got plenty of flooring ideas to inspire you. If you already have a particular floor colour in mind, you can explore our flooring ideas by colour and find the perfect shade to complete your room. It's also a good idea to take a look at a colour you wouldn't normally pick, you might surprise yourself! You can also browse our flooring ideas by room - an ideal place to start if you're not sure which floor type to choose. If you know exactly what flooring you want, simply visit your nearest Tapi store and let us bring your flooring ideas to life!";
|
|
|
|
// // Scan each result to see if it's the first part of the URL
|
|
// $urlFilterType = "";
|
|
// if(!empty($colours)){
|
|
// $colourFilter = $colours->strSearchUrl;
|
|
// $urlFilterType = "colour";
|
|
|
|
// $data['H1'] = $colours->strH1;
|
|
// $data['introductionText'] = $colours->txtIntroText;
|
|
// $metaTitle = $colours->strMetaTitle;
|
|
// $metaDescription = $colours->txtMetaDescription;
|
|
|
|
// } elseif(!empty($rooms)){
|
|
// $roomFilter = $rooms->strSearchUrl;
|
|
// $urlFilterType = "room";
|
|
|
|
// $data['H1'] = $rooms->strH1;
|
|
// $data['introductionText'] = $rooms->txtIntroText;
|
|
// $metaTitle = $rooms->strMetaTitle;
|
|
// $metaDescription = $rooms->txtMetaDescription;
|
|
|
|
// } elseif(!empty($types)){
|
|
// $typeFilter = $types->strSearchUrl;
|
|
// $urlFilterType = "type";
|
|
|
|
// $data['H1'] = $types->strH1;
|
|
// $data['introductionText'] = $types->txtIntroText;
|
|
// $metaTitle = $types->strMetaTitle;
|
|
// $metaDescription = $types->txtMetaDescription;
|
|
// }
|
|
|
|
// $data['urlFilterType'] = $urlFilterType;
|
|
|
|
// // Assign filters based on the query string if that filter isn't URL part 1
|
|
// if(!empty(Input::get("colour", array())) && empty($colourFilter)){
|
|
// $colourFilter = Input::get("colour");
|
|
// }
|
|
// if(!empty(Input::get("room", array())) && empty($roomFilter)){
|
|
// $roomFilter = Input::get("room");
|
|
// }
|
|
// if(!empty(Input::get("type", array())) && empty($typeFilter)){
|
|
// $typeFilter = Input::get("type");
|
|
// }
|
|
// // before pagination
|
|
// //$data['roomIdeas'] = \App\Ideas::getRoomIdeas($ideasLimit, 0, $colourFilter, $roomFilter, $typeFilter);
|
|
// // with pagination
|
|
// $numPage = \Input::get('nP', 1);
|
|
// $startAt = ($numPage-1) * $ideasLimit;
|
|
// $numRoomIdeas = \App\Ideas::getRoomIdeasTotal($colourFilter, $roomFilter, $typeFilter);
|
|
// $data['roomIdeas'] = \App\Ideas::getRoomIdeas($ideasLimit, $startAt, $colourFilter, $roomFilter, $typeFilter);
|
|
// $data['pagination'] = \CMS\SiteNavigation::generatePagination($numPage, $ideasLimit, $numRoomIdeas, true);
|
|
// if(\Input::get('nP',0) > $data['pagination']["totalPages"]){
|
|
// // if page > totalPages redirect to 404
|
|
// return \Response::make(\CMS\Theme::generate404ErrorPage(), 404);
|
|
// }
|
|
// //used for rel next/prev
|
|
// $data["totalPages"] = $data['pagination']["totalPages"];
|
|
|
|
// //meta data
|
|
// $metaArray = new \stdClass;
|
|
// $metaArray->strMetaTitle = (empty($metaTitle) ? "Room Ideas": $metaTitle);
|
|
// $metaArray->strMetaKeywords = "Room Ideas";
|
|
// $metaArray->strMetaDescription = (empty($metaDescription) ? "Tapi Carpets & Floors | Room Ideas : Find ideas for your rooms" : $metaDescription);;
|
|
// $data['meta'] = $metaArray;
|
|
|
|
|
|
// // Get the filters for the on-page selects
|
|
// $colourFiltersDb = \DB::table("crud_room_ideas_filter_colours")->where("bolDeleted", "=", 0)->order_by("intOrder", "asc")->get();
|
|
// $colourFilters = array();
|
|
// foreach($colourFiltersDb as $filter){
|
|
// if(is_null($filter->strSearchUrl)){
|
|
// \DB::table("crud_room_ideas_filter_colours")->where("intId", "=", $filter->intId)->update(array("strSearchUrl" => \Str::slug($filter->strFilterColour)));
|
|
// $filter->strSearchUrl = \Str::slug($filter->strFilterColour);
|
|
// }
|
|
|
|
// $colourFilters[$filter->strSearchUrl] = $filter->strFilterColour;
|
|
// }
|
|
|
|
// $roomFiltersDb = \DB::table("crud_room_ideas_filter_rooms")->where("bolDeleted", "=", 0)->order_by("intOrder", "asc")->get();
|
|
// $roomFilters = array();
|
|
// foreach($roomFiltersDb as $filter){
|
|
// if(is_null($filter->strSearchUrl)){
|
|
// \DB::table("crud_room_ideas_filter_rooms")->where("intId", "=", $filter->intId)->update(array("strSearchUrl" => \Str::slug($filter->strFilterRoom)));
|
|
// $filter->strSearchUrl = \Str::slug($filter->strFilterRoom);
|
|
// }
|
|
|
|
// $roomFilters[$filter->strSearchUrl] = $filter->strFilterRoom;
|
|
// }
|
|
|
|
// $typeFiltersDb = \DB::table("crud_room_ideas_filter_types")->where("bolDeleted", "=", 0)->order_by("intOrder", "asc")->get();
|
|
// $typeFilters = array();
|
|
// foreach($typeFiltersDb as $filter){
|
|
// if(is_null($filter->strSearchUrl)){
|
|
// \DB::table("crud_room_ideas_filter_types")->where("intId", "=", $filter->intId)->update(array("strSearchUrl" => \Str::slug($filter->strFilterType)));
|
|
// $filter->strSearchUrl = \Str::slug($filter->strFilterType);
|
|
// }
|
|
|
|
// $typeFilters[$filter->strSearchUrl] = $filter->strFilterType;
|
|
// }
|
|
|
|
// $data['pageFilters'] = array(
|
|
// "colour" => $colourFilters,
|
|
// "room" => $roomFilters,
|
|
// "type" => $typeFilters
|
|
// );
|
|
|
|
// $data['filtersMemory'] = array(
|
|
// "colour" => $colourFilter,
|
|
// "room" => $roomFilter,
|
|
// "type" => $typeFilter
|
|
// );
|
|
|
|
// return \CMS\Theme::generatePageLayout(
|
|
// 'baseRoomIdeasPage',
|
|
// array('data' => $data),
|
|
// array()
|
|
// );
|
|
// }
|
|
|
|
// public function get_roomideasajax($colourFilter = "", $roomFilter = "", $typeFilter = ""){
|
|
// //$offset = Input::get("count");
|
|
// $ideasLimit = 6;
|
|
|
|
// if($colourFilter === "any"){
|
|
// $colourFilter = "";
|
|
// }
|
|
// if($roomFilter === "any"){
|
|
// $roomFilter = "";
|
|
// }
|
|
// if($typeFilter === "any"){
|
|
// $typeFilter = "";
|
|
// }
|
|
|
|
|
|
// // before pagination
|
|
// //$ideas = \App\Ideas::getRoomIdeas($ideasLimit, $offset, $colourFilter, $roomFilter, $typeFilter);
|
|
// // with pagination
|
|
// $numPage = \Input::get('page',1);
|
|
// $startAt = ($numPage-1) * $ideasLimit;
|
|
// $ideas = \App\Ideas::getRoomIdeas($ideasLimit, $startAt, $colourFilter, $roomFilter, $typeFilter);
|
|
|
|
// // Build data array and output back as JSON
|
|
// $data = array(
|
|
// "count" => count($ideas),
|
|
// "ideas" => $ideas,
|
|
// "siteUrl" => "http://" . $_SERVER['HTTP_HOST']
|
|
// );
|
|
|
|
// return json_encode($data);
|
|
|
|
// }
|