loader ajax

This commit is contained in:
2019-10-06 01:13:05 +02:00
parent 8a48a6ac0f
commit ba59f31741
355 changed files with 11286 additions and 707 deletions
File diff suppressed because one or more lines are too long
+2
View File
@@ -0,0 +1,2 @@
/*! jQuery & Zepto Lazy v1.7.10 - http://jquery.eisbehr.de/lazy - MIT&GPL-2.0 license - Copyright 2012-2018 Daniel 'Eisbehr' Kern */
!function(t,e){"use strict";function r(r,a,i,u,l){function f(){L=t.devicePixelRatio>1,i=c(i),a.delay>=0&&setTimeout(function(){s(!0)},a.delay),(a.delay<0||a.combined)&&(u.e=v(a.throttle,function(t){"resize"===t.type&&(w=B=-1),s(t.all)}),u.a=function(t){t=c(t),i.push.apply(i,t)},u.g=function(){return i=n(i).filter(function(){return!n(this).data(a.loadedName)})},u.f=function(t){for(var e=0;e<t.length;e++){var r=i.filter(function(){return this===t[e]});r.length&&s(!1,r)}},s(),n(a.appendScroll).on("scroll."+l+" resize."+l,u.e))}function c(t){var i=a.defaultImage,o=a.placeholder,u=a.imageBase,l=a.srcsetAttribute,f=a.loaderAttribute,c=a._f||{};t=n(t).filter(function(){var t=n(this),r=m(this);return!t.data(a.handledName)&&(t.attr(a.attribute)||t.attr(l)||t.attr(f)||c[r]!==e)}).data("plugin_"+a.name,r);for(var s=0,d=t.length;s<d;s++){var A=n(t[s]),g=m(t[s]),h=A.attr(a.imageBaseAttribute)||u;g===N&&h&&A.attr(l)&&A.attr(l,b(A.attr(l),h)),c[g]===e||A.attr(f)||A.attr(f,c[g]),g===N&&i&&!A.attr(E)?A.attr(E,i):g===N||!o||A.css(O)&&"none"!==A.css(O)||A.css(O,"url('"+o+"')")}return t}function s(t,e){if(!i.length)return void(a.autoDestroy&&r.destroy());for(var o=e||i,u=!1,l=a.imageBase||"",f=a.srcsetAttribute,c=a.handledName,s=0;s<o.length;s++)if(t||e||A(o[s])){var g=n(o[s]),h=m(o[s]),b=g.attr(a.attribute),v=g.attr(a.imageBaseAttribute)||l,p=g.attr(a.loaderAttribute);g.data(c)||a.visibleOnly&&!g.is(":visible")||!((b||g.attr(f))&&(h===N&&(v+b!==g.attr(E)||g.attr(f)!==g.attr(F))||h!==N&&v+b!==g.css(O))||p)||(u=!0,g.data(c,!0),d(g,h,v,p))}u&&(i=n(i).filter(function(){return!n(this).data(c)}))}function d(t,e,r,i){++z;var o=function(){y("onError",t),p(),o=n.noop};y("beforeLoad",t);var u=a.attribute,l=a.srcsetAttribute,f=a.sizesAttribute,c=a.retinaAttribute,s=a.removeAttribute,d=a.loadedName,A=t.attr(c);if(i){var g=function(){s&&t.removeAttr(a.loaderAttribute),t.data(d,!0),y(T,t),setTimeout(p,1),g=n.noop};t.off(I).one(I,o).one(D,g),y(i,t,function(e){e?(t.off(D),g()):(t.off(I),o())})||t.trigger(I)}else{var h=n(new Image);h.one(I,o).one(D,function(){t.hide(),e===N?t.attr(C,h.attr(C)).attr(F,h.attr(F)).attr(E,h.attr(E)):t.css(O,"url('"+h.attr(E)+"')"),t[a.effect](a.effectTime),s&&(t.removeAttr(u+" "+l+" "+c+" "+a.imageBaseAttribute),f!==C&&t.removeAttr(f)),t.data(d,!0),y(T,t),h.remove(),p()});var m=(L&&A?A:t.attr(u))||"";h.attr(C,t.attr(f)).attr(F,t.attr(l)).attr(E,m?r+m:null),h.complete&&h.trigger(D)}}function A(t){var e=t.getBoundingClientRect(),r=a.scrollDirection,n=a.threshold,i=h()+n>e.top&&-n<e.bottom,o=g()+n>e.left&&-n<e.right;return"vertical"===r?i:"horizontal"===r?o:i&&o}function g(){return w>=0?w:w=n(t).width()}function h(){return B>=0?B:B=n(t).height()}function m(t){return t.tagName.toLowerCase()}function b(t,e){if(e){var r=t.split(",");t="";for(var a=0,n=r.length;a<n;a++)t+=e+r[a].trim()+(a!==n-1?",":"")}return t}function v(t,e){var n,i=0;return function(o,u){function l(){i=+new Date,e.call(r,o)}var f=+new Date-i;n&&clearTimeout(n),f>t||!a.enableThrottle||u?l():n=setTimeout(l,t-f)}}function p(){--z,i.length||z||y("onFinishedAll")}function y(t,e,n){return!!(t=a[t])&&(t.apply(r,[].slice.call(arguments,1)),!0)}var z=0,w=-1,B=-1,L=!1,T="afterLoad",D="load",I="error",N="img",E="src",F="srcset",C="sizes",O="background-image";"event"===a.bind||o?f():n(t).on(D+"."+l,f)}function a(a,o){var u=this,l=n.extend({},u.config,o),f={},c=l.name+"-"+ ++i;return u.config=function(t,r){return r===e?l[t]:(l[t]=r,u)},u.addItems=function(t){return f.a&&f.a("string"===n.type(t)?n(t):t),u},u.getItems=function(){return f.g?f.g():{}},u.update=function(t){return f.e&&f.e({},!t),u},u.force=function(t){return f.f&&f.f("string"===n.type(t)?n(t):t),u},u.loadAll=function(){return f.e&&f.e({all:!0},!0),u},u.destroy=function(){return n(l.appendScroll).off("."+c,f.e),n(t).off("."+c),f={},e},r(u,l,a,f,c),l.chainable?a:u}var n=t.jQuery||t.Zepto,i=0,o=!1;n.fn.Lazy=n.fn.lazy=function(t){return new a(this,t)},n.Lazy=n.lazy=function(t,r,i){if(n.isFunction(r)&&(i=r,r=[]),n.isFunction(i)){t=n.isArray(t)?t:[t],r=n.isArray(r)?r:[r];for(var o=a.prototype.config,u=o._f||(o._f={}),l=0,f=t.length;l<f;l++)(o[t[l]]===e||n.isFunction(o[t[l]]))&&(o[t[l]]=i);for(var c=0,s=r.length;c<s;c++)u[r[c]]=t[0]}},a.prototype.config={name:"lazy",chainable:!0,autoDestroy:!0,bind:"load",threshold:500,visibleOnly:!1,appendScroll:t,scrollDirection:"both",imageBase:null,defaultImage:"data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==",placeholder:null,delay:-1,combined:!1,attribute:"data-src",srcsetAttribute:"data-srcset",sizesAttribute:"data-sizes",retinaAttribute:"data-retina",loaderAttribute:"data-loader",imageBaseAttribute:"data-imagebase",removeAttribute:!0,handledName:"handled",loadedName:"loaded",effect:"show",effectTime:0,enableThrottle:!0,throttle:250,beforeLoad:e,afterLoad:e,onError:e,onFinishedAll:e},n(t).on("load",function(){o=!0})}(window);
+257
View File
@@ -0,0 +1,257 @@
/*!
* Lazy Load - jQuery plugin for lazy loading images
*
* Copyright (c) 2007-2017 Mika Tuupola
*
* Licensed under the MIT license:
* http://www.opensource.org/licenses/mit-license.php
*
* Project home:
* http://www.appelsiini.net/projects/lazyload
*
* Version: 1.10.0-dev
*
*/
(function($, window, document, undefined) {
var $window = $(window);
$.fn.lazyload = function(options) {
var elements = this;
var $container;
var settings = {
threshold : 0,
failure_limit : 0,
event : "scroll.lazyload",
effect : "show",
container : window,
data_attribute : "original",
data_srcset : "srcset",
skip_invisible : false,
appear : null,
load : null,
placeholder : "data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs="
};
function update() {
var counter = 0;
elements.each(function() {
var $this = $(this);
if (settings.skip_invisible && !$this.is(":visible")) {
return;
}
if ($.abovethetop(this, settings) ||
$.leftofbegin(this, settings)) {
/* Nothing. */
} else if (!$.belowthefold(this, settings) &&
!$.rightoffold(this, settings)) {
$this.trigger("appear");
/* if we found an image we'll load, reset the counter */
counter = 0;
} else {
if (++counter > settings.failure_limit) {
return false;
}
}
});
}
if(options) {
/* Maintain BC for a couple of versions. */
if (undefined !== options.failurelimit) {
options.failure_limit = options.failurelimit;
delete options.failurelimit;
}
if (undefined !== options.effectspeed) {
options.effect_speed = options.effectspeed;
delete options.effectspeed;
}
$.extend(settings, options);
}
/* Cache container as jQuery as object. */
$container = (settings.container === undefined ||
settings.container === window) ? $window : $(settings.container);
/* Fire one scroll event per scroll. Not one scroll event per image. */
if (0 === settings.event.indexOf("scroll")) {
$container.off(settings.event).on(settings.event, function() {
return update();
});
}
this.each(function() {
var self = this;
var $self = $(self);
self.loaded = false;
/* If no src attribute given use data:uri. */
if ($self.attr("src") === undefined || $self.attr("src") === false) {
if ($self.is("img")) {
$self.attr("src", settings.placeholder);
}
}
/* When appear is triggered load original image. */
$self.one("appear", function() {
if (!this.loaded) {
if (settings.appear) {
var elements_left = elements.length;
settings.appear.call(self, elements_left, settings);
}
$("<img />")
.one("load", function() {
var original = $self.attr("data-" + settings.data_attribute);
var srcset = $self.attr("data-" + settings.data_srcset);
if (original !== $self.attr("src")) {
$self.hide();
if ($self.is("img")) {
$self.attr("src", original);
if (srcset !== null) {
$self.attr("srcset", srcset);
}
} if ($self.is("video")) {
$self.attr("poster", original);
} else {
$self.css("background-image", "url('" + original + "')");
}
$self[settings.effect](settings.effect_speed);
}
self.loaded = true;
/* Remove image from array so it is not looped next time. */
var temp = $.grep(elements, function(element) {
return !element.loaded;
});
elements = $(temp);
if (settings.load) {
var elements_left = elements.length;
settings.load.call(self, elements_left, settings);
}
})
.bind("error", function(){
$(self).trigger("error");
})
.attr({
"src": $self.attr("data-" + settings.data_attribute),
"srcset": $self.attr("data-" + settings.data_srcset) || ""
});
}
});
/* When wanted event is triggered load original image */
/* by triggering appear. */
if (0 !== settings.event.indexOf("scroll")) {
$self.off(settings.event).on(settings.event, function() {
if (!self.loaded) {
$self.trigger("appear");
}
});
}
});
/* Check if something appears when window is resized. */
$window.off("resize.lazyload").bind("resize.lazyload", function() {
update();
});
/* With IOS5 force loading images when navigating with back button. */
/* Non optimal workaround. */
if ((/(?:iphone|ipod|ipad).*os 5/gi).test(navigator.appVersion)) {
$window.on("pageshow", function(event) {
if (event.originalEvent && event.originalEvent.persisted) {
elements.each(function() {
$(this).trigger("appear");
});
}
});
}
/* Force initial check if images should appear. */
$(function() {
update();
});
return this;
};
/* Convenience methods in jQuery namespace. */
/* Use as $.belowthefold(element, {threshold : 100, container : window}) */
$.belowthefold = function(element, settings) {
var fold;
if (settings.container === undefined || settings.container === window) {
fold = (window.innerHeight ? window.innerHeight : $window.height()) + $window.scrollTop();
} else {
fold = $(settings.container).offset().top + $(settings.container).height();
}
return fold <= $(element).offset().top - settings.threshold;
};
$.rightoffold = function(element, settings) {
var fold;
if (settings.container === undefined || settings.container === window) {
fold = $window.width() + $window.scrollLeft();
} else {
fold = $(settings.container).offset().left + $(settings.container).width();
}
return fold <= $(element).offset().left - settings.threshold;
};
$.abovethetop = function(element, settings) {
var fold;
if (settings.container === undefined || settings.container === window) {
fold = $window.scrollTop();
} else {
fold = $(settings.container).offset().top;
}
return fold >= $(element).offset().top + settings.threshold + $(element).height();
};
$.leftofbegin = function(element, settings) {
var fold;
if (settings.container === undefined || settings.container === window) {
fold = $window.scrollLeft();
} else {
fold = $(settings.container).offset().left;
}
return fold >= $(element).offset().left + settings.threshold + $(element).width();
};
$.inviewport = function(element, settings) {
return !$.rightoffold(element, settings) && !$.leftofbegin(element, settings) &&
!$.belowthefold(element, settings) && !$.abovethetop(element, settings);
};
/* Custom selectors for your convenience. */
/* Use as $("img:below-the-fold").something() or */
/* $("img").filter(":below-the-fold").something() which is faster */
$.extend($.expr[":"], {
"below-the-fold" : function(a) { return $.belowthefold(a, {threshold : 0}); },
"above-the-top" : function(a) { return !$.belowthefold(a, {threshold : 0}); },
"right-of-screen": function(a) { return $.rightoffold(a, {threshold : 0}); },
"left-of-screen" : function(a) { return !$.rightoffold(a, {threshold : 0}); },
"in-viewport" : function(a) { return $.inviewport(a, {threshold : 0}); },
/* Maintain BC for couple of versions. */
"above-the-fold" : function(a) { return !$.belowthefold(a, {threshold : 0}); },
"right-of-fold" : function(a) { return $.rightoffold(a, {threshold : 0}); },
"left-of-fold" : function(a) { return !$.rightoffold(a, {threshold : 0}); }
});
})(jQuery, window, document);
+80 -30
View File
@@ -4,6 +4,7 @@ function click_link() {
$link.click(function(e) {
e.preventDefault();
var $loader = $(this).find('.loader');
var $this = $(this);
$href = $this.attr("href");
@@ -15,8 +16,8 @@ function click_link() {
if ($this.hasClass('open')) {
$this.removeClass('open');
$('#item_list.'+ cat).remove();
} else {
} else {
$loader.css('display','inline-block');
$.ajax({
url : '/' + page + '/' + cat, // La ressource ciblée
type : 'GET', // Le type de la requête HTTP
@@ -24,13 +25,14 @@ function click_link() {
success: function(data) {
$(data).find('#item_list').addClass(cat).insertAfter($this);
$this.addClass('open');
},
lazy();
},
complete: function(data) {
console.log('cat', cat);
lazyload();
$loader.hide();
click_img(e, $this, $href, url, page, cat, project_name);
}
closeAjax();
},
});
}
});
@@ -62,18 +64,17 @@ function click_list() {
url : '/' + page + '/' + cat + '/' + project_name, // La ressource ciblée
type : 'GET', // Le type de la requête HTTP
dataType:'html',
// async: false,
success: function(data) {
$('#item_list.'+cat+' .card-image.open #item').remove();
$('#item_list.'+cat+' .card-image').removeClass('open');
$(data).find('#item').addClass(cat).insertAfter($link_card);
$link_card.parent().addClass('open');
lazy();
},
complete: function(data) {
lazyload();
// animate();
marg_item(project_name);
closeAjax();
},
});
@@ -83,11 +84,11 @@ function click_list() {
url : '/' + page + '/' + cat, // La ressource ciblée
type : 'GET', // Le type de la requête HTTP
dataType:'html',
// async: false,
success: function(data) {
$(data).find('#item_list').addClass(cat).insertAfter($link_txt);
$link_txt.addClass('open');
lazy();
anchor($href);
$('.card a').click(function (e) {
@@ -98,14 +99,11 @@ function click_list() {
},
complete: function(data) {
console.log('cat', cat);
lazyload();
var $link_card = $('.card > #'+project_name + ' a');
setTimeout( function(){
console.log('project_name', project_name);
console.log('$link_card', $link_card);
if ($link_card.hasClass('open')) {
}else {
anchor($href);
@@ -116,15 +114,16 @@ function click_list() {
success: function(data) {
$(data).find('#item').addClass(cat).insertAfter($link_card);
$link_card.parent().addClass('open');
lazy();
},
complete: function(data) {
// animate();
lazyload();
marg_item(project_name);
closeAjax();
},
});
}
}, 900);
}, 500);
}
});
}
@@ -140,16 +139,22 @@ function click_img(e, $this, $href, url, page, cat, project_name) {
cat = url[2];
project_name = url[3];
var $loader = $(this).parents('.card').find('.loader');
e.preventDefault();
if ($this.parent().hasClass('open')) {
$this.parent().removeClass('open');
$($this.parent().find('#item.'+ cat)).remove();
} else {
$loader.css('display','inline-block');
$.ajax({
url : '/' + page + '/' + cat + '/' + project_name, // La ressource ciblée
type : 'GET', // Le type de la requête HTTP
dataType:'html',
// async: false,
success: function(data) {
$('#item_list.'+cat+' .card-image.open #item').remove();
$('#item_list.'+cat+' .card-image').removeClass('open');
@@ -157,9 +162,14 @@ function click_img(e, $this, $href, url, page, cat, project_name) {
$this.parent().addClass('open');
marg_item(project_name);
anchor($href);
lazy();
},
complete:function() {
lazyload();
// var $projet = $("#text_figli .card #item");
// var hamburger = "<div id='icone_list'><button class='hamburger hamburger--slider is-active' type='button'><span class='hamburger-box'><span class='hamburger-inner'></span></span></button></div>"
// $projet.prepend(hamburger);
closeAjax();
$loader.hide();
}
});
@@ -236,22 +246,62 @@ function mouseHover() {
};
function lazyload() {
$('.lazy').Lazy({
// your configuration goes here
// scrollDirection: 'vertical',
effect: "fadeIn",
effectTime: 900,
threshold: 0
// visibleOnly: true,
// onError: function(element) {
// console.log('error loading ' + element.data('src'));
// }
function lazy() {
$('img.lazy').Lazy({
effect: "fadeIn",
effectTime: 500,
threshold: 0
});
}
function redirection() {
var url = document.location.href;
console.log(url);
if (url != 'https://figureslibres.kevintessier.net/') {
document.location.href="https://figureslibres.kevintessier.net/"
}
}
function animate_burger() {
var forEach=function(t,o,r){if("[object Object]"===Object.prototype.toString.call(t))for(var c in t)Object.prototype.hasOwnProperty.call(t,c)&&o.call(r,t[c],c,t);else for(var e=0,l=t.length;l>e;e++)o.call(r,t[e],e,t)};
var hamburgers = document.querySelectorAll(".hamburger");
var $hamburger = $('button.hamburger');
if (hamburgers.length > 0) {
forEach(hamburgers, function(hamburger) {
hamburger.addEventListener("click", function() {
this.classList.toggle("is-active");
}, false);
});
}
$hamburger.click(function() {
$('.sidebar-right').toggleClass("is-active");
})
}
function closeAjax() {
var $button = $('#item #icone_list');
$button.click(function() {
$(this).parent().remove();
});
}
function croix() {
var $link = $("#text_figli p > a");
var hamburger = "<div id='icone_list'><button class='hamburger hamburger--slider is-active' type='button'><span class='hamburger-box'><span class='hamburger-inner'></span></span></button></div>"
var loader = "<div class='loader'></div>"
$link.append(hamburger);
$link.append(loader);
}
$(document).ready(function($){
// redirection();
click_link();
click_list();
mouseHover();
animate_burger();
croix();
});