Inserito il tema direttamente nel codice invece che come sottomodulo
This commit is contained in:
386
themes/hugo-universal-theme/static/js/front.js
Normal file
386
themes/hugo-universal-theme/static/js/front.js
Normal file
@ -0,0 +1,386 @@
|
||||
/* global $this: true */
|
||||
/* eslint no-unused-vars: ["error", { "varsIgnorePattern": "animationsSlider" }] */
|
||||
|
||||
if ($.cookie('themeCSSpath')) {
|
||||
$('link#theme-stylesheet').attr('href', $.cookie('themeCSSpath'))
|
||||
}
|
||||
if ($.cookie('themeLayout')) {
|
||||
$('body').addClass($.cookie('themeLayout'))
|
||||
}
|
||||
|
||||
$(function () {
|
||||
sliderHomepage()
|
||||
sliders()
|
||||
fullScreenContainer()
|
||||
productDetailGallery(4000)
|
||||
menuSliding()
|
||||
menuMouseOver()
|
||||
productDetailSizes()
|
||||
utils()
|
||||
animations()
|
||||
counters()
|
||||
demo()
|
||||
contactFormAjax()
|
||||
})
|
||||
|
||||
// Ajax contact
|
||||
function contactFormAjax () {
|
||||
const form = $('.contact-form-ajax')
|
||||
if (typeof form === 'undefined') return false
|
||||
form.submit(function () {
|
||||
$this = $(this)
|
||||
$.post($(this).attr('action'),
|
||||
$this.serialize(),
|
||||
function () {
|
||||
$this[0].reset() // clear form
|
||||
|
||||
$('#contact-message')
|
||||
.html('<div class="alert alert-success" role="alert"><button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>Thank you for getting in touch. We will get back to you soon!</div>')
|
||||
.fadeIn()
|
||||
}
|
||||
, 'json')
|
||||
return false
|
||||
})
|
||||
}
|
||||
|
||||
/* for demo purpose only - can be deleted */
|
||||
function demo () {
|
||||
if ($.cookie('themeCSSpath')) {
|
||||
$('link#theme-stylesheet').attr('href', $.cookie('themeCSSpath'))
|
||||
}
|
||||
|
||||
$('#colour').change(function () {
|
||||
if ($(this).val() !== '') {
|
||||
const themeCSSpath = 'css/style.' + $(this).val() + '.css'
|
||||
|
||||
$('link#theme-stylesheet').attr('href', themeCSSpath)
|
||||
|
||||
$.cookie('themeCSSpath', themeCSSpath, { expires: 365, path: '/' })
|
||||
}
|
||||
|
||||
return false
|
||||
})
|
||||
|
||||
$('#layout').change(function () {
|
||||
if ($(this).val() !== '') {
|
||||
const themeLayout = $(this).val()
|
||||
|
||||
$('body').removeClass('wide')
|
||||
$('body').removeClass('boxed')
|
||||
|
||||
$('body').addClass(themeLayout)
|
||||
|
||||
$.cookie('themeLayout', themeLayout, { expires: 365, path: '/' })
|
||||
}
|
||||
|
||||
return false
|
||||
})
|
||||
}
|
||||
|
||||
/* slider homepage */
|
||||
function sliderHomepage () {
|
||||
if ($('#slider').length) {
|
||||
// var owl = $('#slider')
|
||||
|
||||
$('#slider').owlCarousel({
|
||||
autoPlay: 3000,
|
||||
items: 4,
|
||||
itemsDesktopSmall: [900, 3],
|
||||
itemsTablet: [600, 3],
|
||||
itemsMobile: [500, 2]
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
/* sliders */
|
||||
function sliders () {
|
||||
if ($('.owl-carousel').length) {
|
||||
$('.customers').owlCarousel({
|
||||
items: ($('.customers').attr('data-items') || 6),
|
||||
slideSpeed: ($('.customers').attr('data-slide-speed') || 2000),
|
||||
paginationSpeed: ($('.customers').attr('data-pagination-speed') || 1000),
|
||||
autoPlay: $('.customers').attr('data-autoplay') === 'true',
|
||||
itemsDesktopSmall: [990, 4],
|
||||
itemsTablet: [768, 2],
|
||||
itemsMobile: [480, 1]
|
||||
})
|
||||
|
||||
$('.testimonials').owlCarousel({
|
||||
items: ($('.testimonials').attr('data-items') || 4),
|
||||
slideSpeed: ($('.testimonials').attr('data-slide-speed') || 2000),
|
||||
paginationSpeed: ($('.testimonials').attr('data-pagination-speed') || 1000),
|
||||
autoPlay: $('.testimonials').attr('data-autoplay') === 'true',
|
||||
itemsDesktopSmall: [990, 3],
|
||||
itemsTablet: [768, 2],
|
||||
itemsMobile: [480, 1]
|
||||
})
|
||||
|
||||
$('.homepage').owlCarousel({
|
||||
navigation: false, // Show next and prev buttons
|
||||
navigationText: ['<i class="fas fa-angle-left"></i>', '<i class="fas fa-angle-right"></i>'],
|
||||
slideSpeed: ($('.homepage').attr('data-slide-speed') || 2000),
|
||||
paginationSpeed: ($('.homepage').attr('data-pagination-speed') || 1000),
|
||||
autoPlay: ($('.homepage').attr('data-autoplay') || 'true') === 'true',
|
||||
stopOnHover: true,
|
||||
singleItem: true,
|
||||
lazyLoad: false,
|
||||
addClassActive: true,
|
||||
afterInit: function () {
|
||||
// animationsSlider()
|
||||
},
|
||||
afterMove: function () {
|
||||
// animationsSlider()
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
/* menu sliding */
|
||||
function menuSliding () {
|
||||
$('.dropdown').on('show.bs.dropdown', function () {
|
||||
if ($(window).width() > 750) {
|
||||
$(this).find('.dropdown-menu').first().stop(true, true).slideDown()
|
||||
} else {
|
||||
$(this).find('.dropdown-menu').first().stop(true, true).show()
|
||||
}
|
||||
})
|
||||
|
||||
$('.dropdown').on('hide.bs.dropdown', function () {
|
||||
if ($(window).width() > 750) {
|
||||
$(this).find('.dropdown-menu').first().stop(true, true).slideUp()
|
||||
} else {
|
||||
$(this).find('.dropdown-menu').first().stop(true, true).hide()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function menuMouseOver () {
|
||||
$('.mouseover .dropdown').hover(function () {
|
||||
$('.dropdown-toggle', this).trigger('click')
|
||||
})
|
||||
}
|
||||
|
||||
/* animations */
|
||||
function animations () {
|
||||
let delayTime = 0
|
||||
$('[data-animate]').css({ opacity: '0' })
|
||||
$('[data-animate]').waypoint(function () {
|
||||
delayTime += 150
|
||||
$(this).delay(delayTime).queue(function (next) {
|
||||
$(this).toggleClass('animated')
|
||||
$(this).toggleClass($(this).data('animate'))
|
||||
delayTime = 0
|
||||
next()
|
||||
// $(this).removeClass('animated')
|
||||
// $(this).toggleClass($(this).data('animate'))
|
||||
})
|
||||
}, {
|
||||
offset: '90%',
|
||||
triggerOnce: true
|
||||
})
|
||||
|
||||
$('[data-animate-hover]').hover(function () {
|
||||
$(this).css({ opacity: 1 })
|
||||
$(this).addClass('animated')
|
||||
$(this).removeClass($(this).data('animate'))
|
||||
$(this).addClass($(this).data('animate-hover'))
|
||||
}, function () {
|
||||
$(this).removeClass('animated')
|
||||
$(this).removeClass($(this).data('animate-hover'))
|
||||
})
|
||||
}
|
||||
|
||||
function animationsSlider () {
|
||||
let delayTimeSlider = 400
|
||||
|
||||
$('.owl-item:not(.active) [data-animate-always]').each(function () {
|
||||
$(this).removeClass('animated')
|
||||
$(this).removeClass($(this).data('animate-always'))
|
||||
$(this).stop(true, true, true).css({ opacity: 0 })
|
||||
})
|
||||
|
||||
$('.owl-item.active [data-animate-always]').each(function () {
|
||||
delayTimeSlider += 500
|
||||
|
||||
$(this).delay(delayTimeSlider).queue(function () {
|
||||
$(this).addClass('animated')
|
||||
$(this).addClass($(this).data('animate-always'))
|
||||
|
||||
console.log($(this).data('animate-always'))
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
/* counters */
|
||||
function counters () {
|
||||
$('.counter').counterUp({
|
||||
delay: 10,
|
||||
time: 1000
|
||||
})
|
||||
}
|
||||
|
||||
/* picture zoom */
|
||||
function pictureZoom () {
|
||||
$('.product .image, .post .image, .photostream div').each(function () {
|
||||
const imgHeight = $(this).find('img').height()
|
||||
if (imgHeight) {
|
||||
$(this).height(imgHeight)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/* full screen intro */
|
||||
function fullScreenContainer () {
|
||||
const screenWidth = $(window).width() + 'px'
|
||||
let screenHeight = '500px'
|
||||
|
||||
if ($(window).height() > 500) {
|
||||
screenHeight = $(window).height() + 'px'
|
||||
}
|
||||
|
||||
$('#intro, #intro .item').css({
|
||||
width: screenWidth,
|
||||
height: screenHeight
|
||||
})
|
||||
}
|
||||
|
||||
function utils () {
|
||||
/* tooltips */
|
||||
$('[data-toggle="tooltip"]').tooltip()
|
||||
|
||||
/* click on the box activates the radio */
|
||||
$('#checkout').on('click', '.box.shipping-method, .box.payment-method', function () {
|
||||
const radio = $(this).find(':radio')
|
||||
radio.prop('checked', true)
|
||||
})
|
||||
|
||||
/* click on the box activates the link in it */
|
||||
$('.box.clickable').on('click', function () {
|
||||
window.location = $(this).find('a').attr('href')
|
||||
})
|
||||
|
||||
/* external links in new window */
|
||||
$('.external').on('click', function (e) {
|
||||
e.preventDefault()
|
||||
window.open($(this).attr('href'))
|
||||
})
|
||||
|
||||
/* animated scrolling */
|
||||
$('.scroll-to, .scroll-to-top').click(function (event) {
|
||||
const fullUrl = this.href
|
||||
const parts = fullUrl.split('#')
|
||||
|
||||
if (parts.length > 1) {
|
||||
scrollTo(fullUrl)
|
||||
event.preventDefault()
|
||||
}
|
||||
})
|
||||
|
||||
function scrollTo (fullUrl) {
|
||||
const parts = fullUrl.split('#')
|
||||
const trgt = parts[1]
|
||||
const targetOffset = $('#' + trgt).offset()
|
||||
let targetTop = targetOffset.top - 100
|
||||
|
||||
if (targetTop < 0) {
|
||||
targetTop = 0
|
||||
}
|
||||
|
||||
$('html, body').animate({
|
||||
scrollTop: targetTop
|
||||
}, 1000)
|
||||
}
|
||||
}
|
||||
|
||||
/* product detail gallery */
|
||||
function productDetailGallery (confDetailSwitch) {
|
||||
$('.thumb:first').addClass('active')
|
||||
let timer = setInterval(autoSwitch, confDetailSwitch)
|
||||
|
||||
$('.thumb').click(function (e) {
|
||||
switchImage($(this))
|
||||
clearInterval(timer)
|
||||
timer = setInterval(autoSwitch, confDetailSwitch)
|
||||
e.preventDefault()
|
||||
})
|
||||
|
||||
$('#mainImage').hover(function () {
|
||||
clearInterval(timer)
|
||||
}, function () {
|
||||
timer = setInterval(autoSwitch, confDetailSwitch)
|
||||
})
|
||||
|
||||
function autoSwitch () {
|
||||
let nextThumb = $('.thumb.active').closest('div').next('div').find('.thumb')
|
||||
if (nextThumb.length === 0) {
|
||||
nextThumb = $('.thumb:first')
|
||||
}
|
||||
switchImage(nextThumb)
|
||||
}
|
||||
|
||||
function switchImage (thumb) {
|
||||
$('.thumb').removeClass('active')
|
||||
const bigUrl = thumb.attr('href')
|
||||
thumb.addClass('active')
|
||||
$('#mainImage img').attr('src', bigUrl)
|
||||
}
|
||||
}
|
||||
|
||||
/* product detail sizes */
|
||||
function productDetailSizes () {
|
||||
$('.sizes a').click(function (e) {
|
||||
e.preventDefault()
|
||||
$('.sizes a').removeClass('active')
|
||||
$('.size-input').prop('checked', false)
|
||||
$(this).addClass('active')
|
||||
$(this).next('input').prop('checked', true)
|
||||
})
|
||||
}
|
||||
|
||||
$.fn.alignElementsSameHeight = function () {
|
||||
$('.same-height-row').each(function () {
|
||||
let maxHeight = 0
|
||||
let children = $(this).find('.same-height')
|
||||
children.height('auto')
|
||||
|
||||
if ($(window).width() > 768) {
|
||||
children.each(function () {
|
||||
if ($(this).innerHeight() > maxHeight) {
|
||||
maxHeight = $(this).innerHeight()
|
||||
}
|
||||
})
|
||||
children.innerHeight(maxHeight)
|
||||
}
|
||||
|
||||
maxHeight = 0
|
||||
children = $(this).find('.same-height-always')
|
||||
children.height('auto')
|
||||
children.each(function () {
|
||||
if ($(this).height() > maxHeight) {
|
||||
maxHeight = $(this).innerHeight()
|
||||
}
|
||||
})
|
||||
children.innerHeight(maxHeight)
|
||||
})
|
||||
}
|
||||
|
||||
let windowWidth
|
||||
$(function () {
|
||||
windowWidth = $(window).width()
|
||||
|
||||
$(this).alignElementsSameHeight()
|
||||
pictureZoom()
|
||||
})
|
||||
|
||||
$(window).resize(function () {
|
||||
const newWindowWidth = $(window).width()
|
||||
|
||||
if (windowWidth !== newWindowWidth) {
|
||||
setTimeout(function () {
|
||||
$(this).alignElementsSameHeight()
|
||||
fullScreenContainer()
|
||||
pictureZoom()
|
||||
}, 205)
|
||||
windowWidth = newWindowWidth
|
||||
}
|
||||
})
|
||||
Reference in New Issue
Block a user