From fd472ca39e297d963df2451e0f6e5d3a49e1d11a Mon Sep 17 00:00:00 2001 From: afornerot Date: Sat, 22 Mar 2025 12:10:01 +0100 Subject: [PATCH] review homepage --- config/routes.yaml | 4 + src/Controller/HomeController.php | 16 + templates/Home/home.html copy.twig | 551 +++++++++++++++++++++++++++++ templates/Home/home.html.twig | 342 +++++------------- templates/Home/userhero.html.twig | 84 +++++ 5 files changed, 744 insertions(+), 253 deletions(-) create mode 100644 templates/Home/home.html copy.twig create mode 100644 templates/Home/userhero.html.twig diff --git a/config/routes.yaml b/config/routes.yaml index 5f9351e..4526eb3 100644 --- a/config/routes.yaml +++ b/config/routes.yaml @@ -289,3 +289,7 @@ app_slide: app_home_user: path: /{userpseudo} defaults: { _controller: App\Controller\HomeController:user } + +app_home_userhero: + path: /hero/{userpseudo} + defaults: { _controller: App\Controller\HomeController:userhero } diff --git a/src/Controller/HomeController.php b/src/Controller/HomeController.php index 4bd2fa5..50ad89c 100755 --- a/src/Controller/HomeController.php +++ b/src/Controller/HomeController.php @@ -71,6 +71,22 @@ class HomeController extends AbstractController ]); } + public function userhero($userpseudo) + { + $em = $this->getDoctrine()->getManager(); + $user=$em->getRepository("App:User")->findOneBy(["slug"=>$userpseudo]); + $illustrations = $em->getRepository("App:Illustration")->findByUser($user); + $webzines = $em->getRepository("App:Webzine")->findBy(["user"=>$user], ['set' => 'ASC', 'order' => 'ASC']); + $config = $em->getRepository("App:Config")->getUserConfig($user); + + return $this->render('Home/userhero.html.twig',[ + "user" => $user, + "config" => $config, + "illustrations" => $illustrations, + "webzines" => $webzines + ]); + } + public function feedhome($nb) { diff --git a/templates/Home/home.html copy.twig b/templates/Home/home.html copy.twig new file mode 100644 index 0000000..12b3112 --- /dev/null +++ b/templates/Home/home.html copy.twig @@ -0,0 +1,551 @@ +{% extends "base.html.twig" %} + +{% block localstyle %} + #main { + padding: 0px; + display:none; + margin-bottom:200px; + } + + {% if app.session.get("appthumbfilter")=="1" %} + .cssfilter { + filter: grayscale({{app.session.get("appthumbfiltergrayscale")}}%) opacity({{app.session.get("appthumbfilteropacity")}}%) sepia({{app.session.get("appthumbfiltersepia")}}%); + transition: -webkit-filter 0.1s; + } + + .cssfilter:hover { + filter: unset; + -webkit-filter: unset; + -moz-filter: unset; + -o-filter: unset; + -ms-filter: unset; + + -webkit-transition: -webkit-filter 0.1s; + transition: -webkit-filter 0.1s; + } + {% endif %} +{% endblock %} + +{% block body %} + + +
+ + +
+ {% if users is not empty %} + Membres  + {% endif %} + + {% if illustrations is not empty %} + Illustrations  + {% endif %} + + {% if not webzines is empty %} + Webzines  + {% endif %} + + {% if not links is empty %} + Liens  + {% endif %} +
+ +
+ {% if app.user %} + + + + + {% if is_granted('ROLE_ADMIN') %} + + + + {% endif %} + + + + + + + + + {% else %} + {% if(appNinegateurl and appNinegatemoderegistration!="none") %} + + + + {% endif %} + + + + + {% endif %} +
+
+ +
+ +
+ + +
+ {%if not app.session.get("hero01") is empty %} +
+ {%endif%} + + {%if not app.session.get("hero02") is empty %} +
+ {%endif%} + + {%if not app.session.get("hero03") is empty %} +
+ {%endif%} + + {%if not app.session.get("hero04") is empty %} +
+ {%endif%} + + {%if not app.session.get("hero05") is empty %} +
+ {%endif%} +
+ +
+ {% if app.user %} + + + + + {% if is_granted('ROLE_ADMIN') %} + + + + {% endif %} + + + + + + + + + + {% else %} + {% if(appNinegateurl and appNinegatemoderegistration!="none") %} + + + + {% endif %} + + + + + {% endif %} +
+ +
+ +
+

{{ (app.session.get("appname")) }}

+ +
+ {% if not app.session.get("appsubname") is empty %} + {{ app.session.get("appsubname") }}
+ {% endif %} + +
+ {% if app.session.get('email') is not empty %} + + {% endif %} + {% if app.session.get('facebook') is not empty %} + + {% endif %} + {% if app.session.get('instagram') is not empty %} + + {% endif %} + {% if app.session.get('twitter') is not empty %} + + {% endif %} + {% if app.session.get('google') is not empty %} + + {% endif %} + {% if app.session.get('youtube') is not empty %} + + {% endif %} + +
+ +
+ {% if not users is empty %} + Membres
+ {% endif %} + + {% if not illustrations is empty %} + Illustrations
+ {% endif %} + + {% if not webzines is empty %} + Webzines
+ {% endif %} + + {% if not links is empty %} + Liens
+ {% endif %} +
+ + {% if not items is empty %} +
+ {% for item in items %} + {% if item.title|lower != "ninefolio" %} + +
+ + {{ item.title }} +
+ + {% endif %} + {% endfor %} +
+ {% endif %} +
+
+ + + + + + {% set style="margin:30px" %} + {% if app.session.get("appmaxthumbwidth")!="0" %} + {% set style="max-width:"~app.session.get("appmaxthumbwidth")~"px; margin:30px auto;" %} + {% endif %} +
+
+
+ + +
+

+ +
+
+ +
+

{{ app.session.get("appname")}}

+ + {% if not app.session.get("appsubname") is empty %} + {{ app.session.get("appsubname")}}
+ {%endif%} + + {% if not app.session.get("appdescription") is empty %} +
{{ app.session.get("appdescription")|raw}} + {%endif%} + + {% if app.session.get('email') is not empty or app.session.get('facebook') is not empty or app.session.get('instagram') is not empty or app.session.get('twitter') is not empty or app.session.get('google') is not empty or app.session.get('youtube') is not empty %} +

+ {% endif %} + + {% if app.session.get('email') is not empty %} + Email = {{ app.session.get('email') }}
+ {% endif %} + {% if app.session.get('facebook') is not empty %} + Facebook = {{ app.session.get('facebook') }}
+ {% endif %} + {% if app.session.get('instagram') is not empty %} + Instagram = {{ app.session.get('instagram') }}
+ {% endif %} + {% if app.session.get('twitter') is not empty %} + Twitter = {{ app.session.get('twitter') }}
+ {% endif %} + {% if app.session.get('google') is not empty %} + Google = {{ app.session.get('google') }}
+ {% endif %} + {% if app.session.get('youtube') is not empty %} + Youtube = {{ app.session.get('youtube') }}
+ {% endif %} +
+
+ + + {% if not users is empty %} +
+

Membres

+ + {% for user in users %} + {% if user.hasRole('ROLE_MEMBER') %} +
+ + + {{user.pseudo}} + +
+ {% endif %} + {% endfor %} +
+ {% endif %} + + + {% if not illustrations is empty %} +
+

Illustrations

+ + {% for illustration in illustrations %} + {% set appthumbwidth=app.session.get("appthumbwidth") %} + {% set appthumbheight=app.session.get("appthumbheight") %} + + {% set classmini="" %} + {% if appthumbwidth==0 %} + {% set class="" %} + {% if loop.index < 40 %} + {% if loop.index == 1 %} + {% set class="grid-item-size-4" %} + {% elseif loop.index is divisible by(28) %} + {% set class="grid-item-size-4" %} + {% elseif loop.index is divisible by(7) %} + {% set class="grid-item-size-2" %} + {% elseif loop.index is divisible by(46) %} + {% set class="grid-item-size-4" %} + {% endif %} + {% elseif loop.index > 48 %} + {% if loop.index == 49 %} + {% set class="grid-item-size-4" %} + {% elseif (loop.index-49) is divisible by(28) %} + {% set class="grid-item-size-4" %} + {% elseif (loop.index-49) is divisible by(7) %} + {% set class="grid-item-size-2" %} + {% endif %} + {% endif %} + + {% set position = (loop.index - 1) % 10 + 1 %} + {% if position == 1 or position == 8 %} + {% set classmini = 'grid-item-mini-50' %} + {% else %} + {% set classmini = 'grid-item-mini-25' %} + {% endif %} + {% elseif appthumbwidth==1 %} {% set class="" %} + {% elseif appthumbwidth==2 %} {% set class="grid-item-size-2" %} + {% endif %} + + {%if appthumbheight==0 %} + {% set class=class~" grid-item-size-square" %} + {% elseif appthumbheight==1 %} + {% set class=class~" grid-item-size-proportion" %} + {% else %} + {% set class=class~" grid-item-size-page" %} + {% endif %} + + {% set source="thumb_"~illustration.illustration %} + {% if appthumbheight!=0 %} + {% set source="thumbori_"~illustration.illustration %} + {% endif %} + {% set source=source~"?"~illustration.updatetime|date('ymdHis') %} + +
+
+ + {% endfor %} +
+ {% endif %} + + + {% if not webzines is empty %} +
+

Webzines

+ + {% set setname="" %} + {% for webzine in webzines %} + {% if not webzine.webzinepages is empty %} + {% if setname!=webzine.set %} + {% if not webzine.set is empty %} +

{{webzine.set}}

+ {% endif %} + {% set setname=webzine.set %} + {% endif %} + {% set page=webzine.webzinepages[0] %} + {% set source="thumbori_"~page.illustration %} + {% set class=" grid-item-size-2 grid-item-size-page" %} + + +
+
+ + {% endif %} + {% endfor %} +
+ {% endif %} + + + {% if not links is empty %} +
+ + +
+
+ +
+ {% for link in links|sort((a, b) => a.order <=> b.order) %} + {{ link.name }} + {% endfor %} +
+
+ {% endif %} + + +
+
+ {% set qrCode = qr_code_result(absolute_url(path("app_home"))) %} + +
+
+
+ + + {% if app.user %} + + {% endif %} +{% endblock %} + +{% block localjavascript %} + $(document).ready(function() { + $('body').imagesLoaded(function() { + height=Math.max(500,$(window).height()); + $('.heroheader').height(height); + himg=$('.herologo img').height(); + $('.herologo').css({ top: (height-himg-50) +'px' }); + + $('.heroheader').slick({ + slidesToShow: 1, + slidesToScroll: 1, + autoplay: true, + autoplaySpeed: 6000, + dots: true, + touchMove: false, + pauseOnDotsHover: true, + fade: true, + cssEase: 'linear', + prevArrow: false, + nextArrow: false, + customPaging: function(slider, i) { + return ''; + } + }); + + $("#main").show(); + + + resizeThumb(); + + + $('.grid').masonry({ + columnWidth: '.grid-sizer', + gutter: '.gutter-sizer', + itemSelector: '.grid-item', + percentPosition: true, + horizontalOrder: false, + }); + + if (location.hash) { + console.log(location.hash); + $(document).scrollTop( $(location.hash).offset().top -60); + // = location.hash; + } + }); + }); + + $(window).resize(function() { + $(window).scroll(); + height=Math.max(500,$(window).height()); + $('.heroheader').height(height); + himg=$('.herologo img').height(); + $('.herologo').css({ top: (height-himg-50) +'px' }); + resizeThumb(); + }); + + $(window).scroll(function () { + if($(window).width()>=980) { + // set distance user needs to scroll before we start fadeIn + if ($(this).scrollTop() > 300) { + if($('.foliomenu').is(":hidden")) $('.foliomenu').show(); + } else { + if($('.foliomenu').is(":visible")) $('.foliomenu').hide(); + } + } + else { + if($('.foliomenu').is(":hidden")) $('.foliomenu').show(); + } + + if ($(this).scrollTop() > 300) { + if($('.foliotop').is(":hidden")) $('.foliotop').show(); + } else { + if($('.foliotop').is(":visible")) $('.foliotop').hide(); + } + }); + + function resizeThumb() { + {% if app.session.get("appmaxthumbwidth")!="0" %} + width=$(window).width(); + maxwidth={{ app.session.get("appmaxthumbwidth") }}; + + if(maxwidth+30>width) { + $(".grid").css("max-width","none"); + $(".grid").css("margin","30px"); + } + else { + $(".grid").css("max-width","{{ app.session.get("appmaxthumbwidth") }}px"); + $(".grid").css("margin","30px auto"); + } + {% endif %} + + $(".grid-item-size").each(function() { + if(!$(this).hasClass("grid-item-size-noresize")) { + if($(this).hasClass("grid-item-size-square")) { + $(this).height($(this).width()); + } + else if($(this).hasClass("grid-item-size-proportion")) { + var width=$(this).width(); + var oriwidth=$(this).data("width") + if(oriwidth>0) { + pourcentage=width*100/oriwidth; + height=$(this).data("height")*pourcentage/100; + $(this).height(height); + } + else { + $(this).height($(this).width()); + } + } + else { + $(this).height($(this).width()*30/21); + } + } + }); + } +{% endblock %} + + + + diff --git a/templates/Home/home.html.twig b/templates/Home/home.html.twig index 12b3112..e5ac305 100644 --- a/templates/Home/home.html.twig +++ b/templates/Home/home.html.twig @@ -88,7 +88,7 @@ -
+
{%if not app.session.get("hero01") is empty %}
{%endif%} @@ -145,252 +145,95 @@
-
-

{{ (app.session.get("appname")) }}

+
+
+
+

{{ (app.session.get("appname")) }}

-
- {% if not app.session.get("appsubname") is empty %} - {{ app.session.get("appsubname") }}
- {% endif %} +
+ {% if not app.session.get("appsubname") is empty %} + {{ app.session.get("appsubname") }}
+ {% endif %} -
- {% if app.session.get('email') is not empty %} - - {% endif %} - {% if app.session.get('facebook') is not empty %} - - {% endif %} - {% if app.session.get('instagram') is not empty %} - - {% endif %} - {% if app.session.get('twitter') is not empty %} - - {% endif %} - {% if app.session.get('google') is not empty %} - - {% endif %} - {% if app.session.get('youtube') is not empty %} - - {% endif %} - -
- -
- {% if not users is empty %} - Membres
- {% endif %} - - {% if not illustrations is empty %} - Illustrations
- {% endif %} - - {% if not webzines is empty %} - Webzines
- {% endif %} - - {% if not links is empty %} - Liens
- {% endif %} -
- - {% if not items is empty %} -
- {% for item in items %} - {% if item.title|lower != "ninefolio" %} - -
- - {{ item.title }} -
- +
+ {% if app.session.get('email') is not empty %} + + {% endif %} + {% if app.session.get('facebook') is not empty %} + {% endif %} - {% endfor %} + {% if app.session.get('instagram') is not empty %} + + {% endif %} + {% if app.session.get('twitter') is not empty %} + + {% endif %} + {% if app.session.get('google') is not empty %} + + {% endif %} + {% if app.session.get('youtube') is not empty %} + + {% endif %} + +
+ +
+ {% if not users is empty %} + Membres
+ {% endif %} + + {% if not illustrations is empty %} + Illustrations
+ {% endif %} + + {% if not webzines is empty %} + Webzines
+ {% endif %} + + {% if not links is empty %} + Liens
+ {% endif %} +
+ + {% if not items is empty %} +
+ {% for item in items %} + {% if item.title|lower != "ninefolio" %} + +
+ + {{ item.title }} +
+ + {% endif %} + {% endfor %} +
+ {% endif %}
- {% endif %} +
+ +
+ + {% if not app.session.get("appdescription") is empty %} +
+ {{ app.session.get("appdescription")|raw}} +
+ {%endif%} + + {% for user in users %} + {% if user.hasRole('ROLE_MEMBER') %} + {{ render(path("app_home_userhero",{userpseudo:user.slug})) }} + {% endif %} + {% endfor %} + +
- - - {% set style="margin:30px" %} - {% if app.session.get("appmaxthumbwidth")!="0" %} - {% set style="max-width:"~app.session.get("appmaxthumbwidth")~"px; margin:30px auto;" %} - {% endif %} -
-
-
- - -
-

- -
-
- -
-

{{ app.session.get("appname")}}

- - {% if not app.session.get("appsubname") is empty %} - {{ app.session.get("appsubname")}}
- {%endif%} - - {% if not app.session.get("appdescription") is empty %} -
{{ app.session.get("appdescription")|raw}} - {%endif%} - - {% if app.session.get('email') is not empty or app.session.get('facebook') is not empty or app.session.get('instagram') is not empty or app.session.get('twitter') is not empty or app.session.get('google') is not empty or app.session.get('youtube') is not empty %} -

- {% endif %} - - {% if app.session.get('email') is not empty %} - Email = {{ app.session.get('email') }}
- {% endif %} - {% if app.session.get('facebook') is not empty %} - Facebook = {{ app.session.get('facebook') }}
- {% endif %} - {% if app.session.get('instagram') is not empty %} - Instagram = {{ app.session.get('instagram') }}
- {% endif %} - {% if app.session.get('twitter') is not empty %} - Twitter = {{ app.session.get('twitter') }}
- {% endif %} - {% if app.session.get('google') is not empty %} - Google = {{ app.session.get('google') }}
- {% endif %} - {% if app.session.get('youtube') is not empty %} - Youtube = {{ app.session.get('youtube') }}
- {% endif %} -
-
- - - {% if not users is empty %} -
-

Membres

- - {% for user in users %} - {% if user.hasRole('ROLE_MEMBER') %} -
- - - {{user.pseudo}} - -
- {% endif %} - {% endfor %} -
- {% endif %} - - - {% if not illustrations is empty %} -
-

Illustrations

- - {% for illustration in illustrations %} - {% set appthumbwidth=app.session.get("appthumbwidth") %} - {% set appthumbheight=app.session.get("appthumbheight") %} - - {% set classmini="" %} - {% if appthumbwidth==0 %} - {% set class="" %} - {% if loop.index < 40 %} - {% if loop.index == 1 %} - {% set class="grid-item-size-4" %} - {% elseif loop.index is divisible by(28) %} - {% set class="grid-item-size-4" %} - {% elseif loop.index is divisible by(7) %} - {% set class="grid-item-size-2" %} - {% elseif loop.index is divisible by(46) %} - {% set class="grid-item-size-4" %} - {% endif %} - {% elseif loop.index > 48 %} - {% if loop.index == 49 %} - {% set class="grid-item-size-4" %} - {% elseif (loop.index-49) is divisible by(28) %} - {% set class="grid-item-size-4" %} - {% elseif (loop.index-49) is divisible by(7) %} - {% set class="grid-item-size-2" %} - {% endif %} - {% endif %} - - {% set position = (loop.index - 1) % 10 + 1 %} - {% if position == 1 or position == 8 %} - {% set classmini = 'grid-item-mini-50' %} - {% else %} - {% set classmini = 'grid-item-mini-25' %} - {% endif %} - {% elseif appthumbwidth==1 %} {% set class="" %} - {% elseif appthumbwidth==2 %} {% set class="grid-item-size-2" %} - {% endif %} - - {%if appthumbheight==0 %} - {% set class=class~" grid-item-size-square" %} - {% elseif appthumbheight==1 %} - {% set class=class~" grid-item-size-proportion" %} - {% else %} - {% set class=class~" grid-item-size-page" %} - {% endif %} - - {% set source="thumb_"~illustration.illustration %} - {% if appthumbheight!=0 %} - {% set source="thumbori_"~illustration.illustration %} - {% endif %} - {% set source=source~"?"~illustration.updatetime|date('ymdHis') %} - -
-
- - {% endfor %} -
- {% endif %} - - - {% if not webzines is empty %} -
-

Webzines

- - {% set setname="" %} - {% for webzine in webzines %} - {% if not webzine.webzinepages is empty %} - {% if setname!=webzine.set %} - {% if not webzine.set is empty %} -

{{webzine.set}}

- {% endif %} - {% set setname=webzine.set %} - {% endif %} - {% set page=webzine.webzinepages[0] %} - {% set source="thumbori_"~page.illustration %} - {% set class=" grid-item-size-2 grid-item-size-page" %} - - -
-
- - {% endif %} - {% endfor %} -
- {% endif %} - - - {% if not links is empty %} -
- - -
-
- -
- {% for link in links|sort((a, b) => a.order <=> b.order) %} - {{ link.name }} - {% endfor %} -
-
- {% endif %} -
@@ -470,9 +313,7 @@ }); if (location.hash) { - console.log(location.hash); $(document).scrollTop( $(location.hash).offset().top -60); - // = location.hash; } }); }); @@ -507,20 +348,6 @@ }); function resizeThumb() { - {% if app.session.get("appmaxthumbwidth")!="0" %} - width=$(window).width(); - maxwidth={{ app.session.get("appmaxthumbwidth") }}; - - if(maxwidth+30>width) { - $(".grid").css("max-width","none"); - $(".grid").css("margin","30px"); - } - else { - $(".grid").css("max-width","{{ app.session.get("appmaxthumbwidth") }}px"); - $(".grid").css("margin","30px auto"); - } - {% endif %} - $(".grid-item-size").each(function() { if(!$(this).hasClass("grid-item-size-noresize")) { if($(this).hasClass("grid-item-size-square")) { @@ -543,6 +370,15 @@ } } }); + + setTimeout(() => { + $(".userhero").each(function() { + height=$(this).find(".herouseravatar").height(); + $(this).height(height+60); + pos=height+60; + height=$(this).find(".userherocontainer").css({ top: '-'+pos+'px' }); + }); + }, "100"); } {% endblock %} diff --git a/templates/Home/userhero.html.twig b/templates/Home/userhero.html.twig new file mode 100644 index 0000000..4c1ca7a --- /dev/null +++ b/templates/Home/userhero.html.twig @@ -0,0 +1,84 @@ + + {% set style="margin:30px" %} + + +
+ +
+ +
+ +
+ + +
+ +

{{user.pseudo}}

+ En voir plus +
+ + +
+
+
+ + {% for illustration in illustrations|slice(0, 19) %} + {% set appthumbwidth=app.session.get("appthumbwidth") %} + {% set appthumbheight=app.session.get("appthumbheight") %} + + {% set classmini="" %} + {% if appthumbwidth==0 %} + {% set class="" %} + {% if loop.index < 40 %} + {% if loop.index == 1 %} + {% set class="grid-item-size-4" %} + {% elseif loop.index is divisible by(28) %} + {% set class="grid-item-size-4" %} + {% elseif loop.index is divisible by(7) %} + {% set class="grid-item-size-2" %} + {% elseif loop.index is divisible by(46) %} + {% set class="grid-item-size-4" %} + {% endif %} + {% elseif loop.index > 48 %} + {% if loop.index == 49 %} + {% set class="grid-item-size-4" %} + {% elseif (loop.index-49) is divisible by(28) %} + {% set class="grid-item-size-4" %} + {% elseif (loop.index-49) is divisible by(7) %} + {% set class="grid-item-size-2" %} + {% endif %} + {% endif %} + + {% set position = (loop.index - 1) % 10 + 1 %} + {% if position == 1 or position == 8 %} + {% set classmini = 'grid-item-mini-50' %} + {% else %} + {% set classmini = 'grid-item-mini-25' %} + {% endif %} + {% elseif appthumbwidth==1 %} {% set class="" %} + {% elseif appthumbwidth==2 %} {% set class="grid-item-size-2" %} + {% endif %} + + {%if appthumbheight==0 %} + {% set class=class~" grid-item-size-square" %} + {% elseif appthumbheight==1 %} + {% set class=class~" grid-item-size-proportion" %} + {% else %} + {% set class=class~" grid-item-size-page" %} + {% endif %} + + {% set source="thumb_"~illustration.illustration %} + {% if appthumbheight!=0 %} + {% set source="thumbori_"~illustration.illustration %} + {% endif %} + {% set source=source~"?"~illustration.updatetime|date('ymdHis') %} + +
+
+ + {% endfor %} +
+
+
+
+