site.js 8.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313
  1. function click_link() {
  2. $link = $('#text_figli p > a');
  3. $link.click(function(e) {
  4. e.preventDefault();
  5. var $loader = $(this).find('.loader');
  6. var $this = $(this);
  7. $href = $this.attr("href");
  8. url = $href.split("/");
  9. page = url[1];
  10. cat = url[2];
  11. project_name = url[3];
  12. if ($this.hasClass('open')) {
  13. $this.removeClass('open');
  14. $('#item_list.'+ cat).remove();
  15. } else {
  16. $('#item_list').remove();
  17. $('.open').removeClass('open');
  18. $loader.css('display','inline-block');
  19. $.ajax({
  20. url : '/' + page + '/' + cat, // La ressource ciblée
  21. type : 'GET', // Le type de la requête HTTP
  22. dataType:'html',
  23. success: function(data) {
  24. $(data).find('#item_list').addClass(cat).insertAfter($this);
  25. $this.addClass('open');
  26. lazy();
  27. },
  28. complete: function(data) {
  29. console.log('cat', cat);
  30. $loader.hide();
  31. click_img(e, $this, $href, url, page, cat, project_name);
  32. closeAjax();
  33. },
  34. });
  35. }
  36. });
  37. };
  38. function click_list() {
  39. var $link = $('.list-projets li > a');
  40. $link.click(function(e) {
  41. e.preventDefault();
  42. var $this = $(this);
  43. $href = $this.attr("href");
  44. url = $href.split("/");
  45. page = url[1];
  46. cat = url[2];
  47. project_name = url[3];
  48. var $link_txt = $('#text_figli a#'+cat);
  49. var $link_item = $('#item_list.'+cat);
  50. var $link_card = $('.card > #'+project_name + ' a');
  51. if ($link_txt.hasClass('open') && $link_card.parent().hasClass('open') ) {
  52. anchor($href);
  53. }else if ($link_txt.hasClass('open')) {
  54. anchor($href);
  55. $.ajax({
  56. url : '/' + page + '/' + cat + '/' + project_name, // La ressource ciblée
  57. type : 'GET', // Le type de la requête HTTP
  58. dataType:'html',
  59. // async: false,
  60. success: function(data) {
  61. $('#item_list.'+cat+' .card-image.open #item').remove();
  62. $('#item_list.'+cat+' .card-image').removeClass('open');
  63. $(data).find('#item').addClass(cat).insertAfter($link_card);
  64. $link_card.parent().addClass('open');
  65. lazy();
  66. },
  67. complete: function(data) {
  68. marg_item(project_name);
  69. closeAjax();
  70. },
  71. });
  72. } else {
  73. $('#item_list').remove();
  74. $('.open').removeClass('open');
  75. $.ajax({
  76. url : '/' + page + '/' + cat, // La ressource ciblée
  77. type : 'GET', // Le type de la requête HTTP
  78. dataType:'html',
  79. // async: false,
  80. success: function(data) {
  81. $(data).find('#item_list').addClass(cat).insertAfter($link_txt);
  82. $link_txt.addClass('open');
  83. lazy();
  84. $('.card a').click(function (e) {
  85. e.preventDefault()
  86. })
  87. click_img(e, $this, $href, url, page, cat, project_name)
  88. },
  89. complete: function(data) {
  90. console.log('cat', cat);
  91. var $link_card = $('.card > #'+project_name + ' a');
  92. setTimeout( function(){
  93. console.log('project_name', project_name);
  94. console.log('$link_card', $link_card);
  95. if ($link_card.hasClass('open')) {
  96. }else {
  97. anchor($href);
  98. $.ajax({
  99. url : '/' + page + '/' + cat + '/' + project_name, // La ressource ciblée
  100. type : 'GET', // Le type de la requête HTTP
  101. dataType:'html',
  102. success: function(data) {
  103. $(data).find('#item').addClass(cat).insertAfter($link_card);
  104. $link_card.parent().addClass('open');
  105. lazy();
  106. },
  107. complete: function(data) {
  108. marg_item(project_name);
  109. closeAjax();
  110. anchor($href);
  111. },
  112. });
  113. }
  114. }, 500);
  115. }
  116. });
  117. }
  118. });
  119. }
  120. function click_img(e, $this, $href, url, page, cat, project_name) {
  121. $('section.' + cat +' .card-image > a').click(function(e) {
  122. var $this = $(this);
  123. $href = $this.attr("href");
  124. url = $href.split("/");
  125. page = url[1];
  126. cat = url[2];
  127. project_name = url[3];
  128. var $loader = $(this).parents('.card').find('.loader');
  129. e.preventDefault();
  130. if ($this.parent().hasClass('open')) {
  131. $this.parent().removeClass('open');
  132. $($this.parent().find('#item.'+ cat)).remove();
  133. } else {
  134. $loader.css('display','inline-block');
  135. $.ajax({
  136. url : '/' + page + '/' + cat + '/' + project_name, // La ressource ciblée
  137. type : 'GET', // Le type de la requête HTTP
  138. dataType:'html',
  139. // async: false,
  140. success: function(data) {
  141. $('#item_list.'+cat+' .card-image.open #item').remove();
  142. $('#item_list.'+cat+' .card-image').removeClass('open');
  143. $(data).find('#item').addClass(cat).insertAfter($this);
  144. $this.parent().addClass('open');
  145. marg_item(project_name);
  146. anchor($href);
  147. lazy();
  148. },
  149. complete:function() {
  150. // var $projet = $("#text_figli .card #item");
  151. // 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>"
  152. // $projet.prepend(hamburger);
  153. closeAjax();
  154. $loader.hide();
  155. scrollTop();
  156. }
  157. });
  158. }
  159. });
  160. }
  161. function anchor($href) {
  162. var aTag = $("a[href='"+ $href +"']");
  163. // console.log('aTag.offset()', aTag.offset().top+10);
  164. $('html,body').animate({scrollTop: aTag.offset().top-7},'slow');
  165. }
  166. function animate() {
  167. var $item_list = $('#item_list .card > .card-image');
  168. $item_list.fadeIn( "slow" );
  169. }
  170. function marg_item(project_name) {
  171. var $item = $('.card-image#'+project_name+' #item');
  172. var $card = $item.parents('.card');
  173. var pos_card = $card.offset().left-8;
  174. $item.css('margin-left', '-'+pos_card +'px');
  175. $(window).resize(function() {
  176. var pos_card = $card.offset().left-8;
  177. $item.css('margin-left', '-'+pos_card +'px');
  178. })
  179. }
  180. function mouseHover() {
  181. $link_cat = $('#text_figli p > a');
  182. $link_cat.mouseenter(function() {
  183. link_id = $(this).attr("id");
  184. $('html').append("<div class=circle_hover ></div>");
  185. console.log('link_id',link_id);
  186. setTimeout(function () {
  187. $('.circle_hover').addClass('open '+ link_id);
  188. }, 10);
  189. mousePos();
  190. })
  191. .mouseleave(function() {
  192. $('html').find(".circle_hover").remove();
  193. });
  194. function mousePos() {
  195. var currentMousePos = { x: 0, y: 0 };
  196. var $circle = $('.circle_hover');
  197. $(document).mousemove(function(event) {
  198. currentMousePos.x = event.pageX;
  199. currentMousePos.y = event.pageY;
  200. $circle.css('left', currentMousePos.x );
  201. $circle.css('top', currentMousePos.y );
  202. });
  203. }
  204. };
  205. function lazy() {
  206. $('img.lazy').Lazy({
  207. effect: "fadeIn",
  208. effectTime: 500,
  209. threshold: 0
  210. });
  211. }
  212. function redirection() {
  213. var url = document.location.href;
  214. console.log(url);
  215. if (url != 'https://figureslibres.kevintessier.net/') {
  216. document.location.href="https://figureslibres.kevintessier.net/"
  217. }
  218. }
  219. function animate_burger() {
  220. 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)};
  221. var hamburgers = document.querySelectorAll(".hamburger");
  222. var $hamburger = $('button.hamburger');
  223. if (hamburgers.length > 0) {
  224. forEach(hamburgers, function(hamburger) {
  225. hamburger.addEventListener("click", function() {
  226. this.classList.toggle("is-active");
  227. }, false);
  228. });
  229. }
  230. $hamburger.click(function() {
  231. $('.sidebar-right').toggleClass("is-active");
  232. })
  233. }
  234. function closeAjax() {
  235. var $button = $('#item #icone_list');
  236. $button.click(function() {
  237. $(this).parent().remove();
  238. });
  239. }
  240. function croix() {
  241. var $link = $("#text_figli p > a");
  242. 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>"
  243. var loader = "<div class='loader'></div>"
  244. $link.append(hamburger);
  245. $link.append(loader);
  246. }
  247. function scrollTop() {
  248. var $body = $("html, body");
  249. $('#item #top').click(function() {
  250. $body.stop().animate({scrollTop:0}, 500, 'swing', function() {
  251. });
  252. })
  253. }
  254. $(document).ready(function($){
  255. // redirection();
  256. click_link();
  257. click_list();
  258. mouseHover();
  259. animate_burger();
  260. croix();
  261. });