site.js 7.8 KB

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