Index: www-lp/www/includes/header.php =================================================================== diff -u -r13 -r14 --- www-lp/www/includes/header.php (.../header.php) (revision 13) +++ www-lp/www/includes/header.php (.../header.php) (revision 14) @@ -1,1542 +1,1542 @@ - [SI-LINDER-PARTNER-2][OSC] - Refonte du site Internet pour supporter le Responsive Design -/* - - ATTENTION - le design du site ne peut pas être passé en doctype html (html 5) dans la révision 1 du design. - bien qu'une révision 2 sera instanciée plus tard (l'année prochaine), il faudra se contenter de nombreux workaround en restant en HTML TRANSITIONAL 4.01 - - Du fait du nombre massif des éléments DE CETTE PAGE (et de ce qui en découlerait) qui seront à revoir pour transformer le design en design responsive.. - .. il est alors plus judicieux de globaliser un TAG unique pour cette tâche pour ne pas alourdir de commentaires le code déjà suffisemment alourdi comme cela! - - En gros, ici, pour cette méga-tâche, je vais utiliser un format maison de commentaires pour cette tâche précise: - --> pour en comprendre les méandres, voir le fichier /[!] - Saphyra-Interactive-TaskList-Explanations/[SI-LINDER-PARTNER-2][OSC]--semantic.php - -*/ -// <- [SI-LINDER-PARTNER-2][OSC] - Refonte du site Internet pour supporter le Responsive Design -?>add('header', WARNING_INSTALL_DIRECTORY_EXISTS, 'warning'); - } - } - -// check if the configure.php file is writeable - if (WARN_CONFIG_WRITEABLE == 'true') { - if ( (file_exists(dirname($HTTP_SERVER_VARS['SCRIPT_FILENAME']) . '/includes/configure.php')) && (is_writeable(dirname($HTTP_SERVER_VARS['SCRIPT_FILENAME']) . '/includes/configure.php')) ) { - $messageStack->add('header', WARNING_CONFIG_FILE_WRITEABLE, 'warning'); - } - } - -// check if the session folder is writeable - if (WARN_SESSION_DIRECTORY_NOT_WRITEABLE == 'true') { - if (STORE_SESSIONS == '') { - if (!is_dir(tep_session_save_path())) { - $messageStack->add('header', WARNING_SESSION_DIRECTORY_NON_EXISTENT, 'warning'); - } elseif (!is_writeable(tep_session_save_path())) { - $messageStack->add('header', WARNING_SESSION_DIRECTORY_NOT_WRITEABLE, 'warning'); - } - } - } - -// check session.auto_start is disabled - if ( (function_exists('ini_get')) && (WARN_SESSION_AUTO_START == 'true') ) { - if (ini_get('session.auto_start') == '1') { - $messageStack->add('header', WARNING_SESSION_AUTO_START, 'warning'); - } - } - - if ( (WARN_DOWNLOAD_DIRECTORY_NOT_READABLE == 'true') && (DOWNLOAD_ENABLED == 'true') ) { - if (!is_dir(DIR_FS_DOWNLOAD)) { - $messageStack->add('header', WARNING_DOWNLOAD_DIRECTORY_NON_EXISTENT, 'warning'); - } - } - - if ($messageStack->size('header') > 0) { - echo $messageStack->output('header'); - } -?> -[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ - - 1/ on place aussi les liens de construction du menu (Mon Compte et Contact etc..), qui servira en mode non-responsive dans le nouveau design: une bande de couleur uniforme tout en haut du site) - à noter, dans le fichier: /includes/header.php (cherchez le CODETAG: [MY_ACCOUNT_MENU_IS_ALSO_HERE] et [CONTACT_MENU_IS_ALSO_HERE]), car les liens du menu/contact s'y trouve aussi! - à la différence du système de détection imaginé (et fonctionnel) pour la boite de recherche du site - on a pas besoin de charger de fichiers externes, donc, pas besoin de différencier les blocs, car, les deux blocs sont dans la même page! - donc on va juste différencier ici les éléments à afficher dans les différents modes: (Nested), (Tabled). - mais à l'aide de classe CSS. - ici, c'est le mode (Nested) qui sera construit, donc on ajoute la classe correspondante à ce mode dans le conteneur affichant le bloc désiré. - ainsi, on pourra aisément piloter via la nouvelle classe CSS son affichage ou pas (display: none ou block) ! - l'idée, c'est d'afficher la version (Nested) uniquement sur grand écran (genre en mode non-responsive). - l'idée, c'est d'afficher la version (Tabled) uniquement sur petit écran (genre en mode responsive). - - 2/ comme le système de traduction est géré par un script google traduction, il n'est pas obligatoire de créér des constantes de langages - donc, pour dire - l'infobulle "Du lundi au vendredi de 8h à 12 et de 13h à 17h" - "Téléphone: 03 69 57 64 36" - "Bienvenue" - on va l'écrire en brut dans le code, pas dynamique (ainsi, ne sera pas modifiable sans éditer le code source php). - - 3/ on ajoute aussi en dur, un nouveau lien "Créez votre compte" précédé du séparateur: "ou", pointant sur /create_account.php ! - de cette manière un visiteur peut rapidement créér un compte. - - 4/ on ajoute aussi en dur, "Connexion à", et on transforme alors le texte dans HEADER_TITLE_MY_ACCOUNT en miniscule (str_tolower()) et on y remplace 'Mon' par 'votre', c'est plus professionnel. -} -*/ -?> -[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN -/* [MY_ACCOUNT_MENU_IS_ALSO_HERE] - [CONTACT_MENU_IS_ALSO_HERE] */ ?> - - - -
-
-
-
- [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> - - phone_in_talk - Téléphone: 03 69 57 64 36 - - - mail_outline - Contacts - - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> -
-
-
-
- ' . VDPRO_HEADER_TITLE_TEXT . ''; - echo '|'; - } - ?> - ' . tep_output_string_protected($customer_first_name) . ' ・ '; - } else { - echo 'Bienvenue, '; - } - if (tep_session_is_registered('customer_id')) { - echo '(' . HEADER_TITLE_LOGOFF . ') ・ '; - } - echo ''; - if (tep_session_is_registered('customer_id')) { - echo 'Gérer mon compte'; - } else { - // ([4])-->BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - echo 'Connexion à '. strtolower(str_replace('Mon', 'votre', HEADER_TITLE_MY_ACCOUNT)). ''; - } - echo ''; - - // ([3])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN - if (!tep_session_is_registered('customer_id')) { - echo ' ou '; - echo 'Créez votre compte'; - } - // ([3])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - ?> -
-
- 		-
-[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> -[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] -************************************************************************ -*/ -?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][AddClassDescription(headerMainTable)]:{" permet de cibler cet élément depuis une règle CSS "} ?> - - - - -[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ - - 1/ on va avoir besoin de mieux styliser cette structure qui représente le header (en-tête) du site, pas la bande noire, mais la bande avec le logo - si la bande ne subirait que des modifications de classes CSS, ça ne suffirait pas à cause d'un bug idiot remarqué à cause d'un illogisme de priorité de règles CSS. - voir le fichier de style CSS correspondant (voir CODETAG[BUG_MEDIA_QUERIES_ON_IMAGE_LOGO_HEIGHT_OVERRIDE_NOT_DONE_PROPERLY]) - de plus, on va un peu reformater le code, et les commentaires, tout en ajoutant quelques classes à certains endroits - - 2/ juste pour informations, le logo n'est plus le même qu'en 2019 depuis le mercredi 9 octobre, - il a été remplacé par un autre, donc on ajoute quelques paramètres au tep_image(), - comme la taille (width='', height='', cela prendra les valeurs de taille réélle de l'image), - et une classe CSS que l'on pourra piloter via un sélecteur CSS, plus tard, servira en responsive par exemple - - 3/ on créé deux tep_image(), un seul ne sera affiché à la fois, (les cas d'affichages sont responsive/non-responsive). - - 4/ la traînée divertissemtrailed peut parfois se retrouver décalée vers le haut/vers le bas en cas que si l'on est identifié ou non, - la faute aux nouveaux boutons-icones ajoutés pour remplacer la vieille cellule "Mon Compte" en responsive (ce bug affecte uniquement le responsive), - donc on ajoute une condition via un attribut HTML que l'on ciblera par du CSS plus tard, - selon si l'on est identifié ou non, on ajoute ! - - 5/ ATTENTION - // ADJUSTMENTS_HEADER_V2021 - - MODIFICATION MAJEURE - le client souhaitait que cette zone soit ré-ajustée - - avant janvier 2021, le client aimait cette zone ainsi - - depuis janvier 2021, le client a souhaité différents ré-ajustements - [VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions] - Revue de la charte Graphique: - - 1/ on va juste modifier l'adresse du logo utilisé, et désormais sa cible sera une image au format SVG - à noter, le format SVG est un format vectoriel, et non bitmap, il s'agit donc d'une possibilité non négligeable de pouvoir redimensionner sans aucunes pertes de qualité le logo, au besoin - le logo a été dessinnés par Aurore, qui a simplifié le logo initial pour un meilleur affichage sur un site web, le vrai logo en couleurs et dégradés complets ne servira qu'à l'impression logistique - le logo a été mis en usage dans FIGMA, (un logiciel de prototypage d'interface web), par une tierce-personne, Bérengère, elle a exporté ce fichier de logo SVG depuis FIGMA et son option d'export - - -6/ ajout bouton hamburger pour le mode tablette - - } -*/ -?> -[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN?> - - 0000020: design avec nouveau logo v2 ?> - - - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> - - - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> - -[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END -/* -[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] -************************************************************************ -*/ -?> - [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ - - 1/ on place désormais ici différentes choses dans l'en-tête central, cela implique alors une nouvelle structure HTML dans cet encart.. - - 2/ on va y placer un système de panier affichable en modal - (il s'agit du lien "Panier" que l'on va reformater en bloc) à cet endroit, qui servira en mode non-responsive dans le nouveau design: le header, à droite du logo, au milieu du header) - à noter, dans le fichier: /includes/header.php (cherchez le CODETAG: [SHOPPING_CART_IS_ALSO_HERE]), car le lien vers le panier s'y trouve aussi! - à la différence du système de détection imaginé (et fonctionnel) pour la boite de recherche du site - on a pas besoin de charger de fichiers externes, donc, pas besoin de différencier les blocs, car, les deux blocs sont dans la même page! - donc on va juste différencier ici les éléments à afficher dans les différents modes: (Nested), (Tabled). - mais à l'aide de classe CSS. - ici, c'est le mode (Nested) qui sera construit, donc on ajoute la classe correspondante à ce mode dans le conteneur affichant le bloc désiré. - ainsi, on pourra aisément piloter via la nouvelle classe CSS son affichage ou pas (display: none ou block) ! - l'idée, c'est d'afficher la version (Nested) uniquement sur grand écran (genre en mode non-responsive). - l'idée, c'est d'afficher la version (Tabled) uniquement sur petit écran (genre en mode responsive). - - 3/ toujours pour l'encart du panier, - on prévoit un petit style supplémentaire si le panier n'est pas vide, on simule des paquets dedans, avec du code CSS, - on donne un espace comme texte de contenu, pour provoquer au navigateur l'usage de la couleur de fond! - - 4/ toujours pour l'encart du panier, - c'est là que l'on va développer tout son système d'encart, ici on ajoute une icone et son texte - sans oublier un élément important.. - donner comme cible des liens un (trigger) (texte et icone) - qui vont déclencher au clic un clic Javascript programmatique sur un autre lien - qui lui affichera une fenêtre plein-écran modale uiKit (pour comprendre le système consultez les nouvelles boxes "/includes/boxes/si_newdesign2019*.php") - - 5/ toujours pour l'encart du panier, - c'est là que l'on va développer tout son système de fenêtre modale plein-écran et de son bouton-lien (real), ici on ajoute un système qui sera sous-géré par uiKit - - 6/ toujours pour l'encart du panier, - dans la fenêtre modale, on va en réalité afficher non pas du texte, mais une toute nouvelle boite développée à cet effet, - (et se basant sur la boite: /includes/boxes/shopping_cart.php) - - 7/ on prévoit un simple lien pour accéder à la page "Commander" (FILENAME_CHECKOUT_SHIPPING) - - 8/ ATTENTION - // [EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__ADDMENUTRIGGER_ALSO_IN_RESPONSIVE_LANDSCAPE_MODE] - - avant octobre 2020, le client, aimait l'affichage de cet élément - - depuis octobre 2020, le client, finalement préfère un autre affichage (plus d'informations dessous) - suite à la modification effectuée sur le menu des catégories (encore lui, oui!) (voir CODETAG[EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__THE_OVERLAY] dans /includes/boxes/categories.php) - on doit ici penser qu'en mode paysage (landscape en responsive), on a pas visuellement accès à l'ensemble de l'élément: accountMenuBand--ContainerInModeTabled - donc, on ne pourrait pas avoir de bouton/icone déclencheur de l'ouverture de l'overlay du menu des catégories (en responsive).. - ainsi, ici, on va ajouter un deuxième déclencheur, que l'on va limiter à l'affichage visuel en responsive mais mode paysage (landscape) - - 9/ ATTENTION - - avant décembre 2020, le client, désirait que les liens menant vers le panier ne doit plus affiché aux utilisateurs qui ne sont pas identifiés sur le site - - depuis décembre 2020, le client, finalement préfère que les liens menant vers le panier soit autant affiché aux utilisateurs qui ne sont pas identifiés sur le site comme ceux qui le sont - pour faire cela, on va juste ajouter une deuxième condition (usage de OR) à l'affichage du lien.. soit donc, aussi: "si l'utilisateur n'est pas identifié" - - 10/ ATTENTION - BUGFIX - un span ici était incorrectement fermé - - avant janvier 2021, '' - - depuis janvier 2021, '' - - 11/ ATTENTION - depuis janvier 2021, suite à une demande tardive du client, on va devoir afficher désormais les prix différemments selon le profil du client - de un masquer les prix HT aux clients PARTICULIERS et non-identifiés (donc VISITEURS), et donc, afficher le prix TTC uniquement à ces clients - de deux masquer les prix TTC aux clients PROFESSIONNELS et PARTENAIRES (ils doivent êtres identifiés au préalable comme tels), et donc, afficher le prix HT uniquement à ces clients - pour ce faire, rien de plus simple, on créé déjà une variable vierge dans une variable éphémère que l'on détruira plus tard (voir CODETAG[DESTROY_EPHEMEREAL_VARIABLE_HERE_FOR_AVOID_CONFLICTS]) - qui sera valorisée au travers d'une condition PHP qui sera construite pour détecter le profil du client - puis, on se servira de cette variable, qui contiendra à terme le nom d'une classe CSS qui sera stylisée (pro ou partenaire/particulier ou visiteur) par des règles CSS depuis le fichier de styles CSS principal.. - on va aussi devoir désormais donner une classe --textHT à un tout nouveau que l'on pourra désormais cibler depuis le fichier de styles CSS principal/mediaqueries - dans lequel on va désormais encadrer le prix HT - - 12/ ATTENTION - depuis mars 2021, suite à une demande tardive du client, on va devoir afficher une information de plus au-dessus de la zone du panier... - le nombre d'article dans le panier ET le prix total HT/TTC. - - premièrement, on va ajouter à notre variable éphémère un élément supplémentaire : stringProductsInstances - (voir CODETAG[STORE_CARTINFOS_PRODUCT_NUMBERS_INSTANCES]) - il servira à stocker le nombre d'article (produits) DIFFÉRENTS (pas total) dans le panier à l'heure actuelle - (voir CODETAG[STORE_CARTINFOS_CART_TOTAL_PRICE]) - - deuxièmement, on va ajouter à notre variable éphémère un autre élément supplémentaire : stringCartTotalPrice - il servira à stocker le prix total de l'ensemble dans le panier à l'heure actuelle - - troisièmement on se servira de tout ça, seulement si on a au-moins un article (produit) dans le panier - (voir CODETAG[USING_CARTINFOS]) - [VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions] - Revue de la charte Graphique: - - 1/ on va modifier le nom de cette classe css, car désormais on ne veut plus tout cela dans le centre du header - TODO - il faudra à terme de la V2 de VTAB supprimer la totalité de cet élément, mais pour l'instant on va ajouter une autre classe css à cet élément et modifier son ancienne règle CSS afin de faire coincider ces changements - - 2/ on va ajouter une nouvelle cellule structurée pour le milieu du header, pour ne cibler qu'elle on va lui donner un nom de classe un peu différent de celle de l'étape [1] - compte-tenu du fait que désormais le champ de recherche se retrouve au milieu du header, - il a donc fallu déplacer le bloc indiqué par le CODETAG[SEARCH_BOX_IS_ALSO_HERE,PRIOR_VTAB_SEARCH_BOX_WAS_ALSO_HERE] dans cette nouvelle cellule structurée - - 3/ ATTENTION - ceci n'a pas vraiment d'utilité (car l'élément qui s'en sert est masqué en [1] mais ceci est toutefois effectué pour conserver une certaine homogénéité du code - dans le but de davantage pouvoir avoir en [5] et valorisé en [4] un granularité beaucoup plus précise dans le ciblage CSS - on ajoute un index spécial au tableau PHP qui nous aidera à délimiter le profil commercial du client - - 4/ on va valoriser l'index déclaré en [3] selon si le client est un partenaire ou bien si le client est un professionnel - à travers une petite vérification qui trouvera le profil du client - si le client est un partenaire : Partenaire - si le client est un professionnel : Professionnel - si le client n'est ni l'un ni l'autre : Standard - l'instruction (else if) évite le cas où le client est en même temps un Professionnel qui est un Partenaire: - si le client est un Partenaire, la vérification sera résultante en Partenaire, peu importe si il est Professionnel. - - 5/ on injecte la nouvelle donnée dynamique renseignée en [4] de manière à donner à chaque colonne un ciblage bien plus précis du profil client - cela pourra ensuite servir dans une règle CSS pour cibler l'élément généré - } - */ - ?> - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN?> - - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN - $headerInclude__ephemereal = array( - 'cssClassOfPriceBox' => '', - // ([3])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - 'customerProfile' => 'Standard', - // ([12])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN - // [STORE_CARTINFOS_PRODUCT_NUMBERS_INSTANCES] - 'stringProductsInstances' => '', - // [STORE_CARTINFOS_CART_TOTAL_PRICE] - 'stringCartTotalPrice' => '' - // ([12])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - ); - - if (tep_session_is_registered('customer_id')) { - if ($is_partner == true OR is_pro_customer() == true) { - $headerInclude__ephemereal['cssClassOfPriceBox'] = '--pleaseAdaptCartPreviewerForProOrPartnerCustomer'; - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN - if ($is_partner == true) { - $headerInclude__ephemereal['customerProfile'] = 'Partenaire'; - } - else if (is_pro_customer() == true) { - $headerInclude__ephemereal['customerProfile'] = 'Professionnel'; - } - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - } else { - $headerInclude__ephemereal['cssClassOfPriceBox'] = '--pleaseAdaptCartPreviewerForStandardOrVisitorCustomer'; - } - } else { - $headerInclude__ephemereal['cssClassOfPriceBox'] = '--pleaseAdaptCartPreviewerForStandardOrVisitorCustomer'; - } - // ([11])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> - - BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> - - [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> - - [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - /* - [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] - ************************************************************************ - */ - ?> - [SI-LINDER-PARTNER-2][OSC][SimpleTaskDescription]:{" le vieux 'logoscotch_arrondi.png' ne sert plus du tout en 2019, car, le nouveau logo intègre les deux noms (LP-Divertissements et Linder-Partner), donc on le supprime.. "} ?> - [SI-LINDER-PARTNER-2][OSC][SimpleTaskDescription]:{" cette cellule désormais servira à y placer la toute nouvelle boîte de recherche.. "} - // [SEARCH_BOX_IS_ALSO_HERE]?> - [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ - - 1/ on place aussi la box search.php à cet endroit, qui servira en mode non-responsive dans le nouveau design: le header, à droite du logo, au bord droit du header) - à noter, dans le fichier: /includes/column_left.php (cherchez le CODETAG: [SEARCH_BOX_IS_ALSO_HERE]), car la boite de recherche s'y trouve aussi! - désormais on a un nouveau système de détection de comment afficher la boîte de recherche, via une variable de détection $isResponsive__flag__SearchBoxMode vérifiée dans /includes/boxes/search.php) - on l'initialise ici. - mais en mode (Nested) - ainsi, on pourra aisément piloter via la nouvelle classe CSS son affichage ou pas (display: none ou block) ! - l'idée, c'est d'afficher la version (Nested) uniquement sur grand écran (genre en mode non-responsive). - l'idée, c'est d'afficher la version (Tabled) uniquement sur petit écran (genre en mode responsive). - [VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions] - Revue de la charte Graphique: - - 1/ on va conserver la construction de la zone de recherche comme dans la tâche [SI-LINDER-PARTNER-2][OSC], mais, pour la tâche [VTAB-TEAM-LINDER-PARTNER-1][OSC], on va finalement la déplacer dans une autre zone - (voir CODETAG[SINCE_VTAB_SEARCH_BOX_IS_NOW_HERE], ce fichier) - ainsi, la zone de l'étape [1] de la tâche [SI-LINDER-PARTNER-2][OSC] sera commentée afin de ne plus afficher ici la zone de recherche - de plus, pour homogénéiser tout cela, on va renommer le CODETAG[SEARCH_BOX_IS_ALSO_HERE] en CODETAG[SEARCH_BOX_IS_ALSO_HERE,PRIOR_VTAB_SEARCH_BOX_WAS_ALSO_HERE] - } - */ - // ([1])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN - /* [SEARCH_BOX_IS_ALSO_HERE,PRIOR_VTAB_SEARCH_BOX_WAS_ALSO_HERE] - // ([1])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN - $isResponsive__flag__SearchBoxMode = '(Nested)'; - require(DIR_WS_BOXES . 'search.php'); - // ([1])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END */ - // ([1])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - /* - [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] - ************************************************************************ - */ - ?> - [VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions]:{ - - 1/ nous allons modifier le header_right, de manière à donner désormais une utilité à cette zone, qui n'était pas utilisée - le colspan sera nullifié (il était de 2) - l'alignement horizontal sera basé sur du "à gauche" (left) au lieu de "à droite" (right) - - 2/ nous allons aussi intégrer les boutons du header maintenant désormais sous forme d'icones, chaque bouton aura son icone - TODO - les images au format SVG pour les icones ne sont pas fixées à une taille définitive pour le moment, ce n'est qu'un prototype, il faut modifier ça à terme - à noter, le format SVG est un format vectoriel, et non bitmap, il s'agit donc d'une possibilité non négligeable de pouvoir redimensionner sans aucunes pertes de qualité les icones, au besoin - les icones ont étés dessinnés dans FIGMA, (un logiciel de prototypage d'interface web), par une tierce-personne, Bérengère, elle a exporté ces fichiers icones SVG depuis FIGMA et son option d'export - - 3/ étape ajoutée par Bérengère: - nous devons ajouter un élément HTML supplémentaire (
) à l'intérieur du tableau, (cellule
- [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - /* - [VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions] - ************************************************************************ - */ - ?> - - - - - [VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions]:{ - - 1/ mesures de facilité pour le responsive suggérées par Bérengère: - nous devons n'avoir qu'un seul élément header principal qui regroupe: logo, icones de menus, formulaire de recherche, fil d'arianne et le système de traduction: Google Translate Element Gadget - cet unique élément ne sera autre que l'élément
-
- ' - // ([2])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN - . tep_image( - // ([5])-->BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - // ([1])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - DIR_WS_DESIGN . '_BerenButtonHamburgerPlaneteCercle.svg', - 'logo', - // ([5])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN - '', - '', - // ([5])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - 'class="size-img responsiveButton _berenIconeUtilisateurHoveredCraftedEffect" uk-toggle="target: #offcanvas-nav"' - ) - // ([2])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - . '' ; - echo - '' - // ([2])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN - . tep_image( - // ([5])-->BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - // ([1])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - DIR_WS_DESIGN . '_logo.svg', - 'logo', - // ([5])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN - '', - '', - // ([5])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - 'class="size-logo-lp"' - ) - // ([2])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - . ''; - ?> -
- BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> -
>
- 		- [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN - // CODETAG[USING_CARTINFOS] ?> - count_contents() > 0) - { - $headerInclude__ephemereal['stringProductsInstances'] = sizeof($cart->get_products()); - if (tep_session_is_registered('customer_id')) { - if ($is_partner == true OR is_pro_customer() == true) { - $headerInclude__ephemereal['stringCartTotalPrice'] = '' - // prix hors-taxe (ht): - . '' - . str_replace( - 'EUR', - '€', - $currencies->format($cart->show_total( 'HT', $is_partner, $coeff_partner)) . '  ' . 'HT' - ) - . ''; - } else { - $headerInclude__ephemereal['stringCartTotalPrice'] = '' - // prix hors-taxe (ht): - . '' - . str_replace( - 'EUR', - '€', - $currencies->format($cart->show_total( 'TTC',$is_partner,$coeff_partner )) . '  ' . 'TTC' - ) - . ''; - } - } else { - $headerInclude__ephemereal['stringCartTotalPrice'] = '' - // prix toutes-taxes-comprises (ttc): - . '' - . str_replace( - 'EUR', - '€', - $currencies->format($cart->show_total( 'TTC',$is_partner,$coeff_partner )) . '  ' . 'TTC' - ) - . ''; - } - ?> -
- - - - - 1) { ?> - produits:   - - produit:   - - - - - - - -
- - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> - - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> -
- - list - - -
- [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> -      - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN - /* [SHOPPING_CART_IS_ALSO_HERE] */ - // ([9])-->BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> - -
- - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN - if ($cart->count_contents() > 0) { ?> -   -   -   - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - } ?> - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> - shopping_cart - - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> - -
- - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN - /* [PREVIEWING_SHOPPING_CART_IS_TRIGGERED_HERE] */ ?> - -
- -
- - -
- -
- - - -
- Pré-visualisation du panier -

- - -

-
- [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN - $cart_contents_string = ''; - - if ($cart->count_contents() > 0) { - - $cart_contents_string = '
'; - - $products = $cart->get_products(); - - for ($i=0, $n=sizeof($products); $i<$n; $i++) { - - $cart_contents_string .= '
'; - - if ((tep_session_is_registered('new_products_id_in_cart')) && ($new_products_id_in_cart == $products[$i]['id'])) { - $cart_contents_string .= '
'; - - if ((tep_session_is_registered('new_products_id_in_cart')) && ($new_products_id_in_cart == $products[$i]['id'])) { - tep_session_unregister('new_products_id_in_cart'); - } - } - $cart_contents_string .= '
'; - - } else { - $cart_contents_string .= BOX_SHOPPING_CART_EMPTY; - } - - echo $cart_contents_string; - - echo '
' - // ([11])-->BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - . '
' - . '|' - // ([11])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN - // prix hors-taxe (ht): - . '' - . str_replace( - 'EUR', - '€', - $currencies->format($cart->show_total( 'HT', $is_partner, $coeff_partner)) . '   ' . 'HT' - ) - . '' - // ([11])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - . '/' - // prix toutes-taxes-comprises (ttc): - . '' - . str_replace( - 'EUR', - '€', - $currencies->format($cart->show_total( 'TTC',$is_partner,$coeff_partner )) . '   ' . 'TTC' - ) - // ([10])-->BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - . '' - . '
' - . '
'; - // ([6])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - ?> -
- -
- -
- -
-
- [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> - - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> -      -
- - receipt - - -
- [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> - - BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END - // [DESTROY_EPHEMEREAL_VARIABLE_HERE_FOR_AVOID_CONFLICTS] - $headerInclude__ephemereal = null; ?> - 		- - ), pour que Safari ne pose pas de problèmes, (alors que tout les autres navigateurs n'ont pas besoin de ça) - cela mène à la création d'une div spécialement pour permettre la reconnaissance de la valeur space-between sur Safari, marche aussi sur les autres navigateurs - - 4/ étape suggérée par Bérengère: - nous devons éviter que OSCommerce depuis sa fonction PHP de génération d'images HTML, à savoir, tep_image(), ne gère le redimensionnement des icones, (ceci est à contrôler, car, ce n'est pas le fonctionnement attendu par cette fonction PHP appartenant à OSCommerce), mais cela est important pour éviter de forcer le redimensionnement pour l'annuler ou le contrôler depuis le responsive - initialement, la taille était de 80x80 - - 5/ nous devons éviter que OSCommerce depuis sa fonction PHP de génération d'images HTML, à savoir, tep_image(), ne gère le balisage alt des icones, - (ceci est à contrôler, car, ce n'est pas le fonctionnement attendu par cette fonction PHP appartenant à OSCommerce), mais cela est important pour éviter d'afficher un texte de balisage inutile au survol - initialement, la valeur était un texte de remplacement au survol (sous forme d'étiquette navigateur) - - } - */ - // ([1])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> - - [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> -
- [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN - echo - '' - . tep_image( - DIR_WS_DESIGN . '_berenIconeAccesPro.svg', - // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - '', - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN - '', - '', - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - 'class="position_acces_pro _berenIconeUtilisateurHoveredCraftedEffect _berenIconeAccesPro"' - ) - . ''; - - // ([2])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN - echo - '' - . tep_image( - DIR_WS_DESIGN . '_berenIconeAccesPros.svg', - // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - '', - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN - '', - '', - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - 'class="size-img _berenIconeUtilisateurHoveredCraftedEffect _berenIconeAccesPros"' - ) - . ''; - echo - '' - . tep_image( - DIR_WS_DESIGN . '_berenIconeTel.svg', - // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - '', - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN - '', - '', - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - 'class="size-img _berenIconeUtilisateurHoveredCraftedEffect _berenIconeTel" uk-tooltip="title: 03 69 57 64 36; pos: bottom;"' - ) - . ''; - - echo - '' - . tep_image( - DIR_WS_DESIGN . '_berenIconeContact.svg', - // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - '', - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN - '', - '', - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - 'class="size-img _berenIconeUtilisateurHoveredCraftedEffect _berenIconeContact"' - ) - . ''; - echo - '' - . tep_image( - DIR_WS_DESIGN . '_berenIconeFacebook.svg', - // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - '', - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN - '', - '', - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - 'class="size-img _berenIconeUtilisateurHoveredCraftedEffect _berenIconeFacebook"' - ) - . ''; - echo - '' - . tep_image( - DIR_WS_DESIGN . '_berenIconePanier.svg', - // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - '', - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN - '', - '', - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - 'class="size-img _berenIconeUtilisateurHoveredCraftedEffect"' - ) - . ''; - echo - '' - . tep_image( - DIR_WS_DESIGN . '_berenIconeUtilisateur.svg', - // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - '', - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN - '', - '', - // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - 'class="size-img _berenIconeUtilisateurHoveredCraftedEffect"' - ) - . ''; - // ([2])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - ?> -
- [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> -
(un tableau) qui contient ces étapes - cette étape, requièrera que rajouter une nouvelle ligne dans le tableau (voir étape [2]), - et une nouvelle cellule qui contiendra le tableau (voir étape [3]) - contenant le fil d'arianne (voir étape [4]) - qui contient désormais dans sa structure logique de tableau, le système de traduction (voir étape [5]) - - 2/ ici nous rajoutons un .. pour créer une nouvelle ligne dans le tableau - - 3/ ici nous rajoutons un pour créer une nouvelle cellule dans le tableau - - 4/ nous localisons désormais ici le fil d'arianne - à l'origine, il était situé ailleur (voir CODETAG[BREADCRUMB_BAR_WAS_INITIALLY_HERE]) - - 5/ désormais dans la nouvelle version de 2022, on va déplacer le système de traduction Google Translate Element Gadget ici - à l'origine, il était situé ailleur (voir CODETAG[GOOGLE_TRANSLATE_ELEMENT_GADGET_WAS_INITIALLY_HERE]) - autrement, rien n'a été changé ici, mais, il est important de préciser cela: - (voir le fichier /includes/footer.php, tag: [GOOGLE_TRANSLATE_ELEMENT_GADGET_ON_MATERIAL_DESIGN_ICONS_BUGFIX_HERE]) - car dans le fichier pré-cité.. - .. - ... il s'agit d'une réparation d'une énorme bêtise de Google Translate Element gadget.. - suite à ce problème: https://github.com/google/material-design-lite/issues/1721 - "Goggle translate destroying material-icons tags" - en effet: - ça bousille entièrement les icones Material Design Icons - pourtant, Google Translate Element gadget et Google Material Design Icons sont tout deux des produits.. Google.. : mais ils ne sont pas d'accord - voici une explication plus concise du problème (en anglais), par l'auteur du post-initial du problème: - * Sorry if I'm not doing this correctly, but I just joined GitHub to submit this issue! - * - * I'm using MDL for the first time on a new site and discovered some major problems when users use google translate to translate the page. - * Google translate replaces any text with it's translated version and surrounds it with double tags. - * - * First I thought the font tags where the problem, - * then I realized it's translating the icon label withing the tag, - * so MDL now has no idea which icon you want and it seems like the tags additionally mess with the layout. - * - * I'm working around the problem by adding the class "notranslate" to the tags which does seem to work, - * but it doesn't fix the problem for the "hamburger" drawer icon since that is injected by the JS. - * Is there a way to work around this so it's fixed out of the box for MDL? - * - * Seems like a big issue and unfortunate if the answer is that everyone has to had class="notranslate" to every tag. - * - * Also, any ideas on how to fix the hamburger icon? - un collaborateur de Google Material Design Icons est au courant de ce souci, voici sa réponse: - cf: https://github.com/google/material-design-lite/issues/1721#issuecomment-167230926 - * Commit 04beffa solves the menu icon being translated by using the codepoint. - * - * Either using notranslate with ligatures or the codepoints solves the problem, at least with icons. - * - * For other Translate issues... Probably best to wait for 2.x when we refactor loads of stuff including layout. - * - * We can clearly see layout and possibly grid are completely screwed in translate, but for no *apparent reason. - * - * Rather than spend time debugging this now we should do testing ahead of releasing 2.x to make sure it works better in these cases. - * - * Marking this as a 2.x milestone thing as a reminder. - sauf que.. ça n'a jamais été fixé.. depuis 2015... - 5 ans pu--.. - et toujours pas de patch de Google pour ce souci complètement idiot où Google Translate Element gadget s'entête à traduire les noms de codes des icones Material Design Icons... - bref, j'ai donc mis au point mon propre patch.. - c'est très simple: - j'associe une fois la page chargée à chaque élément du DOM qui possèdent une classe material-icons une seconde classe: notranslate, et cela, à l'aide d'un code Javascript et d'une boucle! - (car utiliser les Code Points, aurait été une plaie, dans le sens où j'aurait du reprendre chacun des fichiers 1 par 1 et donner un nom différent à l'icone en correspondance avec son Code Point - code-points material design icons: https://github.com/google/material-design-icons/blob/master/iconfont/codepoints) - l'effet est réussi: - toutes les icone Material Design Icons sont alors préservées, car chaque élément qui possède une classe material-icons sont en réalité des icones Material Design Icons - contre-coup: ça peut faire ramer la page si il y a plus de 10000 icones, mais.. on en est à milles lieues! - */ - ?> - [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> - [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> - - [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> - - [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> - - [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> - [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - /* - [VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions] - ************************************************************************ - */ - ?> -
..
- [VTAB-TEAM-LINDER-PARTNER-1][OSC][AddClassDescription(headerNavigation)]:{" permet de cibler cet élément depuis une règle CSS "} ?> - [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> - - - [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ - - 1/ on place aussi les liens de construction du menu (Mon Compte etc..), qui servira en mode responsive dans le nouveau design: une rimbambelle de petits boutons sous le header du site) - à noter, dans le fichier: /includes/header.php (cherchez le CODETAG: [MY_ACCOUNT_MENU_IS_ALSO_HERE]), car les liens du menu s'y trouve aussi! - à la différence du système de détection imaginé (et fonctionnel) pour la boite de recherche du site - on a pas besoin de charger de fichiers externes, donc, pas besoin de différencier les blocs, car, les deux blocs sont dans la même page! - donc on va juste différencier ici les éléments à afficher dans les différents modes: (Nested), (Tabled). - mais à l'aide de classe CSS. - ici, c'est le mode (Tabled) qui sera construit, donc on ajoute la classe correspondante à ce mode dans le conteneur affichant le bloc désiré. - ainsi, on pourra aisément piloter via la nouvelle classe CSS son affichage ou pas (display: none ou block) ! - l'idée, c'est d'afficher la version (Nested) uniquement sur grand écran (genre en mode non-responsive). - l'idée, c'est d'afficher la version (Tabled) uniquement sur petit écran (genre en mode responsive). - - 2/ ATTENTION - // [EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__THE_ICONBUTTON] - - avant octobre 2020, le client, aimait l'affichage de cet élément - - depuis octobre 2020, le client, finalement préfère un autre affichage (plus d'informations dessous) - suite à la modification effectuée sur le menu des catégories (encore lui, oui!) (voir CODETAG[EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__THE_OVERLAY]) - ainsi du au fait que nous souhaitons que désormais notre menu soit ouvrable via un petit icone, et sous forme de surcouche par au-dessus du site pour ne plus stocker le menu dans la page en responsive - (et libérer l'emplacement que le menu occupait dans la page) - (uniquement en responsive, et ici, à cet endroit, on a uniquement le menu RESPONSIVE pour les périphériques d'affichages en mode portrait!) - */ - ?> - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN - /* [MY_ACCOUNT_MENU_IS_ALSO_HERE] */ ?> - - - - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> - [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] - ************************************************************************ - */ - ?> - - - [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ - - 1/ on a ici l'emplacement du fil d'arianne (Breadcrumbar), ici on va ajouter différentes classes CSS à quelques éléments, puis reformater un peu le code - - 2/ ajout d'une classe à cette cellule - BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> - - - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> - [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] - ************************************************************************ - */ - ?> -
- -
- - contacts - - - portrait - person_add - - assignment_ind - highlight_off - - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> - list - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> -
- -
, afin de cibler cet élément plus tard et plus précisemment les liens et séparateurs générés par le ->trail() de OSCommerce - on aurait pu utiliser le composant Breadcrumb de UI Kit, mais il aurait été superflu, on a pas grand chose à revoir ici à part l'affichage du style - - 3/ on vas faire deux choses ici, - on englobe TOUT le code générateur du trail dans une nouvelle structure HTML , - puis on ajoute une structure HTML au séparateur du trail, là aussi un avec lequel on englobe l'entité HTML correspondante au séparateur - */ - ?> - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> - BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> -
- BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> -   ' . $breadcrumb->trail(' » ') . ''; - // ([5])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN - // -> OSC-83: système de traduction ?> - - - -
- - - [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> -
- [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> -
-[VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions]:{ - - 1/ // [EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__ADDMENUTRIGGER_ALSO_IN_RESPONSIVE_LANDSCAPE_MODE] - - avant décembre 2021, le client, aimait l'affichage de cet élément qui est le menu dans la page index, constamment visible - - depuis décembre 2021, on opte pour un affichage hors du contenu de la page, uniquement visible sur un déclencheur (plus d'informations dessous) - suite à la modification effectuée sur le menu des catégories (encore lui, oui!) (voir CODETAG[EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__THE_OVERLAY] dans /includes/boxes/categories.php) - ceci est un déclencheur du même menu que celui ayant la classe categoriesMenuLocation--ContainerInModeNested (aussi dans ce fichier, voir plus haut) - si l'on a procédé ainsi c'est que désormais le site en affichage non responsive n'affichera plus le menu dans la page, mais en sur-couche défilante par la gauche - ceci est le déclencheur de l'afficheur du menu -} -*/ -?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> -
- - - list - -
-[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> -[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] -************************************************************************ -*/ -?> -[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ - - 1/ on place aussi les liens de construction du menu (Contact), qui servira en mode responsive dans le nouveau design: à côté du gadget Google Traduction, - un bloc invisible composé de deux boutons tout ronds pour le téléphone et la page de contact (lien) - à noter, dans le fichier: /includes/header.php (cherchez le CODETAG: [CONTACT_MENU_IS_ALSO_HERE]), car les liens du contact s'y trouve aussi! - à la différence du système de détection imaginé (et fonctionnel) pour la boite de recherche du site - on a pas besoin de charger de fichiers externes, donc, pas besoin de différencier les blocs, car, les deux blocs sont dans la même page! - pas non plus besoin d'user de mode: (Nested), (Tabled). - car ces modes sont réservés à dissocier l'ancien design du nouveau (Nested) = nouveau, reformatés pour être plus jolis sur grand écran, (Tabled) = ancien, reformaté en responsive pour petits périphériques - bref, on va s'aider d'une classe CSS. - ainsi, on pourra aisément piloter via la nouvelle classe CSS son affichage ou pas (display: none ou block) ! - l'idée, c'est de masquer le bloc uniquement sur grand écran (genre en mode non-responsive). - l'idée, c'est d'afficher le bloc uniquement sur petit écran (genre en mode responsive). - on utilise aussi des icones Material Design Icons, on reprends les mêmes que l'on avait pensé pour le grand écran. - - 2/ on ajoute un attribut id à la balise
contenant l'icone du téléphone - on prévoit un gestionnaire en évènement Javascript pur de double-tap, afin que quand l'on tappe deux fois sur l'icone du téléphone, on soit invité à appeller le numéro! - - 3/ on prévoit qu'au clic sur l'icone de Contact (message), on soit alors redirigé vers la page de contact. -} -*/ -?> -[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN -/* [CONTACT_MENU_IS_ALSO_HERE] */ ?> -
-
BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> - id="doubleTap--contactMenuLocationInResponsive--Container__iconContainerForBlockPhoneIcon"> - phone_in_talk - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> - - [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> -
-
- mail_outline -
-
-[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> -[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] -************************************************************************ -*/ -?> -[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ - - 1/ ATTENTION - - avant octobre 2020, le client, aimait l'emplacement de cet élément en responsive ou en non-responsive - - depuis octobre 2020, le client, finalement aimerait que le diaporama (slideshow) en responsive apparaisse au-dessus du menu des catégories - dans le nouveau design, fichier: /index.php (voir CODETAG[ORIGINAL_SLIDESHOW_IS_LOCATED_HERE]) - donc pour l'explication, il faudra vous reférer là-bas, car ici, on ne fera que reprendre le code introduit dans l'autre fichier - ceci est une mesure pour forcer le diaporama à s'afficher en responsive au-dessus des catégories, suite à une demande tardive du client.. - si une seule modification est à faire au diaporama dans /index.php, faites la modification identique ici aussi - - 2/ toutefois, - - ATTENTION - n'oubliez pas qu'ici: pour le nom de l'élément - qui contient le diaporama on utilise: -
le diaporama et sa structure
- ET NON: - le diaporama et sa structure - NOTE - C'est la seule différence avec le diaporama du fichier /index.php - - 3/ ATTENTION - // [EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__THE_HIDEUSELESS_MAINRESPONSIVESLIDESHOW] - - avant octobre 2020, le client, aimait l'affichage de cet élément - - depuis octobre 2020, le client, finalement préfère un autre affichage (plus d'informations dessous) - suite à la modification effectuée sur le menu des catégories (encore lui, oui!) (voir CODETAG[EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__THE_OVERLAY]) - ici, comme on ne se sert plus des flèches spéciales d'auto-scroll (voir CODETAG[USE_TARGET_ID_FOR_AUTO_SCROLL_MECHANISM] dans /includes/boxes/categories.php) - on va juste se servir de la même méthode que la nouvelle variable de vérification ($__phpVar__isChoosenCategoryAlreadyCSSOverride) afin de définir si l'on a déjà choisi une catégorie ou non - - si oui, on masquera en responsive cet élément (div) grâce au ciblage de la nouvelle classe qu'on va lui donner dans ce cas et ce cas uniquement - - si non, on ne fera rien de plus - toutefois, évidemment, nous avons nullifiée cette variable $__phpVar__isChoosenCategoryAlreadyCSSOverride, donc, on ne se servira pas d'elle, mais d'une conditionnelle PHP -} -*/ -?> -[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> -BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> -BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> -
- - -
-
-
    - ' . "\n"; - echo '
    ' . "\n"; - echo ' ' . "\n"; - echo '
    ' . "\n"; - echo ' ' . "\n"; - } else { - continue; - } - } - $all_files = null; - $image_name = null; - $supported_format = null; - $ext = null; - ?> -
- - -
-
    -
    - -
    -[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> -[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] -************************************************************************/ -?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions]:{ - // [VTAB_1_SUB_HEADER_BEFORE_PAGER_TABLE] - - 1/ on va ajouter un nouvel élément au travers d'une toute nouvelle structure HTML qui va simuler un décalage entre le header et le pager (la page), - pour y insérer un sous-entête .. - .. sans cela, notre pager serait situé sous le header .. - .. par ailleurs, placer cet élément dans le header évite de modifier chacune des pages .php du site, sinon, cela serait vite archaïque !! - - 2/ on utilise désormais une fonction faite-maison pour récupérer et afficher le slogan du site au lieu d'un texte en dur -} -*/ -?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> -
    -
    - - BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END - echo vtab_tep_get_slogan(); - ?> - - - person - Accès PRO - -
    -
    -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> -[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] -************************************************************************ -*/ -?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions]:{ - - 1/ on va ajouter un nouvel élément au travers d'une toute nouvelle structure HTML qui va ajouter un encart de zone entre le diaporama et le sous-entête ajouté ailleurs - (voir CODETAG[[VTAB_1_SUB_HEADER_BEFORE_PAGER_TABLE]] - pour y insérer un autre sous-entête .. - .. sans cela, notre pager serait situé sous le header .. - .. par ailleurs, placer cet élément dans le header évite de modifier chacune des pages .php du site, sinon, cela serait vite archaïque !! - - 2/ à noter que ce texte ne doit pas apparaître sur d'autres pages que l'index ET qu'il ne doit pas apparaître en cas de listing de catégories ou de produits - donc, pas en cas de catégories sélectionnées (cPath_array == empty) - - 3/ on utilise désormais une fonction faite-maison pour récupérer et afficher le slogan du site au lieu d'un texte en dur -} -*/ -?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> -
    - - - -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> -
    - -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> -[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] -************************************************************************ -*/ -?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions]:{ - // [VTAB_1_DIAPORAMA] - - 1/ dans la nouvelle version du design, on a souhaité avoir un système de diaporama bien précis en responsive, - les chemins des vignettes du diaporama sont les mêmes que ceux employés dans le système de 6 vignettes (voir CODETAG[VTAB_1_MODULE_VTAB_SIXTHEMELINKS] fichier: '/includes/modules/vtab_sixthemelinks.php') - mais il peut servir aussi en hors responsive, c'est pour cela qu'il n'a pas été étiquetté comme responsive - de plus, il est important de spécifier que la structure ne doit pas s'afficher en cas qu'une catégorie de produits est sélectionnée - sa charte graphique a été définie par Aurore de l'équipe VTAB - il sera sous forme de cartes empilées (effet via un fichier SVG créé par Bérengère de l'équipe VTAB) - il y a beaucoup de code dans ce diaporama, il a été développé par Tempérance de l'équipe VTAB/Saphyra Interactive - il y a deux choses importantes à considérer: - a) il se sépare en 3 éléments : - a.a) le code CSS de mise en page - a.b) le code HTML/PHP de structure et de dynamisme de chargements des diapositives dans le code - a.c) le code JAVASCRIPT de l'interaction du l'utilisateur et du navigateur avec le diaporama - b) il ne se sert absolument pas d'UIKit cette fois - puis finalement, le nom des classes CSS et le nom des éléments est volontairement en Français, pour bien disssocier d'un diaporama (slideshow basique) et de ceux du site gérés par UIKit - - 2/ ici se trouve la structure CSS que l'on inclue depuis différents fichiers CSS externes créés à cet effet - - 3/ ici se trouve la structure HTML qui construit le diaporama et le PHP qui se charge de dynamiser le diaporama actuel - on ajoute une classe précise spéciale: --weHaveChosenCategory - si on est dans une catégorie de produits au lieu de la page d'accueil - - 4/ ici se trouve la structure JAVASCRIPT qui permet autant à l'utiliateur qu'au navigateur d'intéragir avec le diaporama - - 5/ on vide éventuellement les variables PHP utilisées ici dans le but de purger la mémoire du serveur et de libérer par extension la mémoire - - 6/ initialement l'on voulait un effet d'empilement de cartes, on utilisait initialement une structure en background-image pour le fond de la diapositive (fond qui était en réalité un SVG d'empilement de cartes), - désormais, au vu de la non-compatibilité entres les différentes résolutions, nous avons décidé de nous en séparer, au profit d'une seule et unique image () qui contiendra tout en un, et pré-assemblée cela signifie donc : (l'empilement de carte + la vignette, le tout pré-assemblé dans un logiciel graphique) = la diapositive - pour le nom des vignettes: initiallement le nom des fichiers de vignettes était appelée 'vignetteX.png', désormais cela sera sensiblement différent et sera alors 'carte_vignetteX.png' - (voir CODETAG[VTAB_1_OSC_DIAPORAMA_HOME_PAGE_NEW_MECHANISM_VALUE]) - l'ancienne structure a été mise en commentaire pour un usage éventuel futur lors d'une version à venir du site - (voir CODETAG[VTAB_1_OSC_DIAPORAMA_HOME_PAGE_NEW_MECHANISM_STRUCTURE]) - - 7/ à noter que le diaporama ne doit pas apparaître sur d'autres pages que l'index ET qu'il ne doit pas apparaître en cas de listing de catégories ou de produits - donc, pas en cas de catégories sélectionnées (cPath_array == empty) -} -*/ -?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> - -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> - - -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> - -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> -BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> - -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> - -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> - - -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions] -************************************************************************/ -?> -[VTAB-TEAM-LINDER-PARTNER-1][OSC][SimpleTaskDescription]:{" on ajoute une div dans laquelle on insère une classe afin de permettre au corps de la page, situé en dessous du header, d'être toujours visible à la suite du header et non en caché car ce dernier est en position "fixed", mais il y a aussi un cas spécial où on sera dans une catégorie ou en cours de visualisation d'une catégorie, depuis la page de l'index, donc on gère ce cas spécifique "} ?> -
    - - - - - [SI-LINDER-PARTNER-2][OSC][SimpleTaskDescription]:{" lorsqu'une erreur est récupérée et passée à travers les fonctions urldecode() et htmlspecialchars() ça donne un beau merdier, on fixe ça ici à l'aide d'un str_replace gérant des tableaux anonymes en guise de remplacement! "} ?> - - -
    ', '', 'ù'), htmlspecialchars(urldecode($HTTP_GET_VARS['error_message']))); ?>
    - - - - [SI-LINDER-PARTNER-2][OSC][SimpleTaskDescription]:{" lorsqu'une erreur est récupérée et passée à travers les fonctions urldecode() et htmlspecialchars() ça donne un beau merdier, on fixe ça ici à l'aide d'un str_replace gérant des tableaux anonymes en guise de remplacement! "} ?> - - -
    ', '', 'ù'), htmlspecialchars($HTTP_GET_VARS['info_message'])); ?>
    - + [SI-LINDER-PARTNER-2][OSC] - Refonte du site Internet pour supporter le Responsive Design +/* + + ATTENTION - le design du site ne peut pas être passé en doctype html (html 5) dans la révision 1 du design. + bien qu'une révision 2 sera instanciée plus tard (l'année prochaine), il faudra se contenter de nombreux workaround en restant en HTML TRANSITIONAL 4.01 + + Du fait du nombre massif des éléments DE CETTE PAGE (et de ce qui en découlerait) qui seront à revoir pour transformer le design en design responsive.. + .. il est alors plus judicieux de globaliser un TAG unique pour cette tâche pour ne pas alourdir de commentaires le code déjà suffisemment alourdi comme cela! + + En gros, ici, pour cette méga-tâche, je vais utiliser un format maison de commentaires pour cette tâche précise: + --> pour en comprendre les méandres, voir le fichier /[!] - Saphyra-Interactive-TaskList-Explanations/[SI-LINDER-PARTNER-2][OSC]--semantic.php + +*/ +// <- [SI-LINDER-PARTNER-2][OSC] - Refonte du site Internet pour supporter le Responsive Design +?>add('header', WARNING_INSTALL_DIRECTORY_EXISTS, 'warning'); + } + } + +// check if the configure.php file is writeable + if (WARN_CONFIG_WRITEABLE == 'true') { + if ( (file_exists(dirname($HTTP_SERVER_VARS['SCRIPT_FILENAME']) . '/includes/configure.php')) && (is_writeable(dirname($HTTP_SERVER_VARS['SCRIPT_FILENAME']) . '/includes/configure.php')) ) { + $messageStack->add('header', WARNING_CONFIG_FILE_WRITEABLE, 'warning'); + } + } + +// check if the session folder is writeable + if (WARN_SESSION_DIRECTORY_NOT_WRITEABLE == 'true') { + if (STORE_SESSIONS == '') { + if (!is_dir(tep_session_save_path())) { + $messageStack->add('header', WARNING_SESSION_DIRECTORY_NON_EXISTENT, 'warning'); + } elseif (!is_writeable(tep_session_save_path())) { + $messageStack->add('header', WARNING_SESSION_DIRECTORY_NOT_WRITEABLE, 'warning'); + } + } + } + +// check session.auto_start is disabled + if ( (function_exists('ini_get')) && (WARN_SESSION_AUTO_START == 'true') ) { + if (ini_get('session.auto_start') == '1') { + $messageStack->add('header', WARNING_SESSION_AUTO_START, 'warning'); + } + } + + if ( (WARN_DOWNLOAD_DIRECTORY_NOT_READABLE == 'true') && (DOWNLOAD_ENABLED == 'true') ) { + if (!is_dir(DIR_FS_DOWNLOAD)) { + $messageStack->add('header', WARNING_DOWNLOAD_DIRECTORY_NON_EXISTENT, 'warning'); + } + } + + if ($messageStack->size('header') > 0) { + echo $messageStack->output('header'); + } +?> +[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ + - 1/ on place aussi les liens de construction du menu (Mon Compte et Contact etc..), qui servira en mode non-responsive dans le nouveau design: une bande de couleur uniforme tout en haut du site) + à noter, dans le fichier: /includes/header.php (cherchez le CODETAG: [MY_ACCOUNT_MENU_IS_ALSO_HERE] et [CONTACT_MENU_IS_ALSO_HERE]), car les liens du menu/contact s'y trouve aussi! + à la différence du système de détection imaginé (et fonctionnel) pour la boite de recherche du site + on a pas besoin de charger de fichiers externes, donc, pas besoin de différencier les blocs, car, les deux blocs sont dans la même page! + donc on va juste différencier ici les éléments à afficher dans les différents modes: (Nested), (Tabled). + mais à l'aide de classe CSS. + ici, c'est le mode (Nested) qui sera construit, donc on ajoute la classe correspondante à ce mode dans le conteneur affichant le bloc désiré. + ainsi, on pourra aisément piloter via la nouvelle classe CSS son affichage ou pas (display: none ou block) ! + l'idée, c'est d'afficher la version (Nested) uniquement sur grand écran (genre en mode non-responsive). + l'idée, c'est d'afficher la version (Tabled) uniquement sur petit écran (genre en mode responsive). + - 2/ comme le système de traduction est géré par un script google traduction, il n'est pas obligatoire de créér des constantes de langages + donc, pour dire + l'infobulle "Du lundi au vendredi de 8h à 12 et de 13h à 17h" + "Téléphone: 03 69 57 64 36" + "Bienvenue" + on va l'écrire en brut dans le code, pas dynamique (ainsi, ne sera pas modifiable sans éditer le code source php). + - 3/ on ajoute aussi en dur, un nouveau lien "Créez votre compte" précédé du séparateur: "ou", pointant sur /create_account.php ! + de cette manière un visiteur peut rapidement créér un compte. + - 4/ on ajoute aussi en dur, "Connexion à", et on transforme alors le texte dans HEADER_TITLE_MY_ACCOUNT en miniscule (str_tolower()) et on y remplace 'Mon' par 'votre', c'est plus professionnel. +} +*/ +?> +[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN +/* [MY_ACCOUNT_MENU_IS_ALSO_HERE] + [CONTACT_MENU_IS_ALSO_HERE] */ ?> + + + +
    +
    +
    +
    + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> + + phone_in_talk + Téléphone: 03 69 57 64 36 + + + mail_outline + Contacts + + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> +
    +
    +
    +
    + ' . VDPRO_HEADER_TITLE_TEXT . ''; + echo '|'; + } + ?> + ' . tep_output_string_protected($customer_first_name) . ' ・ '; + } else { + echo 'Bienvenue, '; + } + if (tep_session_is_registered('customer_id')) { + echo '(' . HEADER_TITLE_LOGOFF . ') ・ '; + } + echo ''; + if (tep_session_is_registered('customer_id')) { + echo 'Gérer mon compte'; + } else { + // ([4])-->BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + echo 'Connexion à '. strtolower(str_replace('Mon', 'votre', HEADER_TITLE_MY_ACCOUNT)). ''; + } + echo ''; + + // ([3])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN + if (!tep_session_is_registered('customer_id')) { + echo ' ou '; + echo 'Créez votre compte'; + } + // ([3])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + ?> +
    +
    +     		+
    +[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> +[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] +************************************************************************ +*/ +?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][AddClassDescription(headerMainTable)]:{" permet de cibler cet élément depuis une règle CSS "} ?> + + + + +[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ + - 1/ on va avoir besoin de mieux styliser cette structure qui représente le header (en-tête) du site, pas la bande noire, mais la bande avec le logo + si la bande ne subirait que des modifications de classes CSS, ça ne suffirait pas à cause d'un bug idiot remarqué à cause d'un illogisme de priorité de règles CSS. + voir le fichier de style CSS correspondant (voir CODETAG[BUG_MEDIA_QUERIES_ON_IMAGE_LOGO_HEIGHT_OVERRIDE_NOT_DONE_PROPERLY]) + de plus, on va un peu reformater le code, et les commentaires, tout en ajoutant quelques classes à certains endroits + - 2/ juste pour informations, le logo n'est plus le même qu'en 2019 depuis le mercredi 9 octobre, + il a été remplacé par un autre, donc on ajoute quelques paramètres au tep_image(), + comme la taille (width='', height='', cela prendra les valeurs de taille réélle de l'image), + et une classe CSS que l'on pourra piloter via un sélecteur CSS, plus tard, servira en responsive par exemple + - 3/ on créé deux tep_image(), un seul ne sera affiché à la fois, (les cas d'affichages sont responsive/non-responsive). + - 4/ la traînée divertissemtrailed peut parfois se retrouver décalée vers le haut/vers le bas en cas que si l'on est identifié ou non, + la faute aux nouveaux boutons-icones ajoutés pour remplacer la vieille cellule "Mon Compte" en responsive (ce bug affecte uniquement le responsive), + donc on ajoute une condition via un attribut HTML que l'on ciblera par du CSS plus tard, + selon si l'on est identifié ou non, on ajoute ! + - 5/ ATTENTION + // ADJUSTMENTS_HEADER_V2021 + - MODIFICATION MAJEURE - le client souhaitait que cette zone soit ré-ajustée + - avant janvier 2021, le client aimait cette zone ainsi + - depuis janvier 2021, le client a souhaité différents ré-ajustements + [VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions] - Revue de la charte Graphique: + - 1/ on va juste modifier l'adresse du logo utilisé, et désormais sa cible sera une image au format SVG + à noter, le format SVG est un format vectoriel, et non bitmap, il s'agit donc d'une possibilité non négligeable de pouvoir redimensionner sans aucunes pertes de qualité le logo, au besoin + le logo a été dessinnés par Aurore, qui a simplifié le logo initial pour un meilleur affichage sur un site web, le vrai logo en couleurs et dégradés complets ne servira qu'à l'impression logistique + le logo a été mis en usage dans FIGMA, (un logiciel de prototypage d'interface web), par une tierce-personne, Bérengère, elle a exporté ce fichier de logo SVG depuis FIGMA et son option d'export + + -6/ ajout bouton hamburger pour le mode tablette + + } +*/ +?> +[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN?> + + 0000020: design avec nouveau logo v2 ?> + + + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> + + + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> + +[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END +/* +[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] +************************************************************************ +*/ +?> + [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ + - 1/ on place désormais ici différentes choses dans l'en-tête central, cela implique alors une nouvelle structure HTML dans cet encart.. + - 2/ on va y placer un système de panier affichable en modal + (il s'agit du lien "Panier" que l'on va reformater en bloc) à cet endroit, qui servira en mode non-responsive dans le nouveau design: le header, à droite du logo, au milieu du header) + à noter, dans le fichier: /includes/header.php (cherchez le CODETAG: [SHOPPING_CART_IS_ALSO_HERE]), car le lien vers le panier s'y trouve aussi! + à la différence du système de détection imaginé (et fonctionnel) pour la boite de recherche du site + on a pas besoin de charger de fichiers externes, donc, pas besoin de différencier les blocs, car, les deux blocs sont dans la même page! + donc on va juste différencier ici les éléments à afficher dans les différents modes: (Nested), (Tabled). + mais à l'aide de classe CSS. + ici, c'est le mode (Nested) qui sera construit, donc on ajoute la classe correspondante à ce mode dans le conteneur affichant le bloc désiré. + ainsi, on pourra aisément piloter via la nouvelle classe CSS son affichage ou pas (display: none ou block) ! + l'idée, c'est d'afficher la version (Nested) uniquement sur grand écran (genre en mode non-responsive). + l'idée, c'est d'afficher la version (Tabled) uniquement sur petit écran (genre en mode responsive). + - 3/ toujours pour l'encart du panier, + on prévoit un petit style supplémentaire si le panier n'est pas vide, on simule des paquets dedans, avec du code CSS, + on donne un espace comme texte de contenu, pour provoquer au navigateur l'usage de la couleur de fond! + - 4/ toujours pour l'encart du panier, + c'est là que l'on va développer tout son système d'encart, ici on ajoute une icone et son texte + sans oublier un élément important.. + donner comme cible des liens un (trigger) (texte et icone) + qui vont déclencher au clic un clic Javascript programmatique sur un autre lien + qui lui affichera une fenêtre plein-écran modale uiKit (pour comprendre le système consultez les nouvelles boxes "/includes/boxes/si_newdesign2019*.php") + - 5/ toujours pour l'encart du panier, + c'est là que l'on va développer tout son système de fenêtre modale plein-écran et de son bouton-lien (real), ici on ajoute un système qui sera sous-géré par uiKit + - 6/ toujours pour l'encart du panier, + dans la fenêtre modale, on va en réalité afficher non pas du texte, mais une toute nouvelle boite développée à cet effet, + (et se basant sur la boite: /includes/boxes/shopping_cart.php) + - 7/ on prévoit un simple lien pour accéder à la page "Commander" (FILENAME_CHECKOUT_SHIPPING) + - 8/ ATTENTION + // [EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__ADDMENUTRIGGER_ALSO_IN_RESPONSIVE_LANDSCAPE_MODE] + - avant octobre 2020, le client, aimait l'affichage de cet élément + - depuis octobre 2020, le client, finalement préfère un autre affichage (plus d'informations dessous) + suite à la modification effectuée sur le menu des catégories (encore lui, oui!) (voir CODETAG[EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__THE_OVERLAY] dans /includes/boxes/categories.php) + on doit ici penser qu'en mode paysage (landscape en responsive), on a pas visuellement accès à l'ensemble de l'élément: accountMenuBand--ContainerInModeTabled + donc, on ne pourrait pas avoir de bouton/icone déclencheur de l'ouverture de l'overlay du menu des catégories (en responsive).. + ainsi, ici, on va ajouter un deuxième déclencheur, que l'on va limiter à l'affichage visuel en responsive mais mode paysage (landscape) + - 9/ ATTENTION + - avant décembre 2020, le client, désirait que les liens menant vers le panier ne doit plus affiché aux utilisateurs qui ne sont pas identifiés sur le site + - depuis décembre 2020, le client, finalement préfère que les liens menant vers le panier soit autant affiché aux utilisateurs qui ne sont pas identifiés sur le site comme ceux qui le sont + pour faire cela, on va juste ajouter une deuxième condition (usage de OR) à l'affichage du lien.. soit donc, aussi: "si l'utilisateur n'est pas identifié" + - 10/ ATTENTION + BUGFIX - un span ici était incorrectement fermé + - avant janvier 2021, '' + - depuis janvier 2021, '' + - 11/ ATTENTION + depuis janvier 2021, suite à une demande tardive du client, on va devoir afficher désormais les prix différemments selon le profil du client + de un masquer les prix HT aux clients PARTICULIERS et non-identifiés (donc VISITEURS), et donc, afficher le prix TTC uniquement à ces clients + de deux masquer les prix TTC aux clients PROFESSIONNELS et PARTENAIRES (ils doivent êtres identifiés au préalable comme tels), et donc, afficher le prix HT uniquement à ces clients + pour ce faire, rien de plus simple, on créé déjà une variable vierge dans une variable éphémère que l'on détruira plus tard (voir CODETAG[DESTROY_EPHEMEREAL_VARIABLE_HERE_FOR_AVOID_CONFLICTS]) + qui sera valorisée au travers d'une condition PHP qui sera construite pour détecter le profil du client + puis, on se servira de cette variable, qui contiendra à terme le nom d'une classe CSS qui sera stylisée (pro ou partenaire/particulier ou visiteur) par des règles CSS depuis le fichier de styles CSS principal.. + on va aussi devoir désormais donner une classe --textHT à un tout nouveau que l'on pourra désormais cibler depuis le fichier de styles CSS principal/mediaqueries + dans lequel on va désormais encadrer le prix HT + - 12/ ATTENTION + depuis mars 2021, suite à une demande tardive du client, on va devoir afficher une information de plus au-dessus de la zone du panier... + le nombre d'article dans le panier ET le prix total HT/TTC. + - premièrement, on va ajouter à notre variable éphémère un élément supplémentaire : stringProductsInstances + (voir CODETAG[STORE_CARTINFOS_PRODUCT_NUMBERS_INSTANCES]) + il servira à stocker le nombre d'article (produits) DIFFÉRENTS (pas total) dans le panier à l'heure actuelle + (voir CODETAG[STORE_CARTINFOS_CART_TOTAL_PRICE]) + - deuxièmement, on va ajouter à notre variable éphémère un autre élément supplémentaire : stringCartTotalPrice + il servira à stocker le prix total de l'ensemble dans le panier à l'heure actuelle + - troisièmement on se servira de tout ça, seulement si on a au-moins un article (produit) dans le panier + (voir CODETAG[USING_CARTINFOS]) + [VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions] - Revue de la charte Graphique: + - 1/ on va modifier le nom de cette classe css, car désormais on ne veut plus tout cela dans le centre du header + TODO - il faudra à terme de la V2 de VTAB supprimer la totalité de cet élément, mais pour l'instant on va ajouter une autre classe css à cet élément et modifier son ancienne règle CSS afin de faire coincider ces changements + - 2/ on va ajouter une nouvelle cellule structurée pour le milieu du header, pour ne cibler qu'elle on va lui donner un nom de classe un peu différent de celle de l'étape [1] + compte-tenu du fait que désormais le champ de recherche se retrouve au milieu du header, + il a donc fallu déplacer le bloc indiqué par le CODETAG[SEARCH_BOX_IS_ALSO_HERE,PRIOR_VTAB_SEARCH_BOX_WAS_ALSO_HERE] dans cette nouvelle cellule structurée + - 3/ ATTENTION - ceci n'a pas vraiment d'utilité (car l'élément qui s'en sert est masqué en [1] mais ceci est toutefois effectué pour conserver une certaine homogénéité du code + dans le but de davantage pouvoir avoir en [5] et valorisé en [4] un granularité beaucoup plus précise dans le ciblage CSS + on ajoute un index spécial au tableau PHP qui nous aidera à délimiter le profil commercial du client + - 4/ on va valoriser l'index déclaré en [3] selon si le client est un partenaire ou bien si le client est un professionnel + à travers une petite vérification qui trouvera le profil du client + si le client est un partenaire : Partenaire + si le client est un professionnel : Professionnel + si le client n'est ni l'un ni l'autre : Standard + l'instruction (else if) évite le cas où le client est en même temps un Professionnel qui est un Partenaire: + si le client est un Partenaire, la vérification sera résultante en Partenaire, peu importe si il est Professionnel. + - 5/ on injecte la nouvelle donnée dynamique renseignée en [4] de manière à donner à chaque colonne un ciblage bien plus précis du profil client + cela pourra ensuite servir dans une règle CSS pour cibler l'élément généré + } + */ + ?> + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN?> + + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN + $headerInclude__ephemereal = array( + 'cssClassOfPriceBox' => '', + // ([3])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + 'customerProfile' => 'Standard', + // ([12])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN + // [STORE_CARTINFOS_PRODUCT_NUMBERS_INSTANCES] + 'stringProductsInstances' => '', + // [STORE_CARTINFOS_CART_TOTAL_PRICE] + 'stringCartTotalPrice' => '' + // ([12])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + ); + + if (tep_session_is_registered('customer_id')) { + if ($is_partner == true OR is_pro_customer() == true) { + $headerInclude__ephemereal['cssClassOfPriceBox'] = '--pleaseAdaptCartPreviewerForProOrPartnerCustomer'; + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN + if ($is_partner == true) { + $headerInclude__ephemereal['customerProfile'] = 'Partenaire'; + } + else if (is_pro_customer() == true) { + $headerInclude__ephemereal['customerProfile'] = 'Professionnel'; + } + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + } else { + $headerInclude__ephemereal['cssClassOfPriceBox'] = '--pleaseAdaptCartPreviewerForStandardOrVisitorCustomer'; + } + } else { + $headerInclude__ephemereal['cssClassOfPriceBox'] = '--pleaseAdaptCartPreviewerForStandardOrVisitorCustomer'; + } + // ([11])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> + + BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> + + [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> + + [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + /* + [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] + ************************************************************************ + */ + ?> + [SI-LINDER-PARTNER-2][OSC][SimpleTaskDescription]:{" le vieux 'logoscotch_arrondi.png' ne sert plus du tout en 2019, car, le nouveau logo intègre les deux noms (LP-Divertissements et Linder-Partner), donc on le supprime.. "} ?> + [SI-LINDER-PARTNER-2][OSC][SimpleTaskDescription]:{" cette cellule désormais servira à y placer la toute nouvelle boîte de recherche.. "} + // [SEARCH_BOX_IS_ALSO_HERE]?> + [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ + - 1/ on place aussi la box search.php à cet endroit, qui servira en mode non-responsive dans le nouveau design: le header, à droite du logo, au bord droit du header) + à noter, dans le fichier: /includes/column_left.php (cherchez le CODETAG: [SEARCH_BOX_IS_ALSO_HERE]), car la boite de recherche s'y trouve aussi! + désormais on a un nouveau système de détection de comment afficher la boîte de recherche, via une variable de détection $isResponsive__flag__SearchBoxMode vérifiée dans /includes/boxes/search.php) + on l'initialise ici. + mais en mode (Nested) + ainsi, on pourra aisément piloter via la nouvelle classe CSS son affichage ou pas (display: none ou block) ! + l'idée, c'est d'afficher la version (Nested) uniquement sur grand écran (genre en mode non-responsive). + l'idée, c'est d'afficher la version (Tabled) uniquement sur petit écran (genre en mode responsive). + [VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions] - Revue de la charte Graphique: + - 1/ on va conserver la construction de la zone de recherche comme dans la tâche [SI-LINDER-PARTNER-2][OSC], mais, pour la tâche [VTAB-TEAM-LINDER-PARTNER-1][OSC], on va finalement la déplacer dans une autre zone + (voir CODETAG[SINCE_VTAB_SEARCH_BOX_IS_NOW_HERE], ce fichier) + ainsi, la zone de l'étape [1] de la tâche [SI-LINDER-PARTNER-2][OSC] sera commentée afin de ne plus afficher ici la zone de recherche + de plus, pour homogénéiser tout cela, on va renommer le CODETAG[SEARCH_BOX_IS_ALSO_HERE] en CODETAG[SEARCH_BOX_IS_ALSO_HERE,PRIOR_VTAB_SEARCH_BOX_WAS_ALSO_HERE] + } + */ + // ([1])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN + /* [SEARCH_BOX_IS_ALSO_HERE,PRIOR_VTAB_SEARCH_BOX_WAS_ALSO_HERE] + // ([1])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN + $isResponsive__flag__SearchBoxMode = '(Nested)'; + require(DIR_WS_BOXES . 'search.php'); + // ([1])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END */ + // ([1])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + /* + [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] + ************************************************************************ + */ + ?> + [VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions]:{ + - 1/ nous allons modifier le header_right, de manière à donner désormais une utilité à cette zone, qui n'était pas utilisée + le colspan sera nullifié (il était de 2) + l'alignement horizontal sera basé sur du "à gauche" (left) au lieu de "à droite" (right) + - 2/ nous allons aussi intégrer les boutons du header maintenant désormais sous forme d'icones, chaque bouton aura son icone + TODO - les images au format SVG pour les icones ne sont pas fixées à une taille définitive pour le moment, ce n'est qu'un prototype, il faut modifier ça à terme + à noter, le format SVG est un format vectoriel, et non bitmap, il s'agit donc d'une possibilité non négligeable de pouvoir redimensionner sans aucunes pertes de qualité les icones, au besoin + les icones ont étés dessinnés dans FIGMA, (un logiciel de prototypage d'interface web), par une tierce-personne, Bérengère, elle a exporté ces fichiers icones SVG depuis FIGMA et son option d'export + - 3/ étape ajoutée par Bérengère: + nous devons ajouter un élément HTML supplémentaire (
    ) à l'intérieur du tableau, (cellule
    + [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + /* + [VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions] + ************************************************************************ + */ + ?> + + + + + [VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions]:{ + - 1/ mesures de facilité pour le responsive suggérées par Bérengère: + nous devons n'avoir qu'un seul élément header principal qui regroupe: logo, icones de menus, formulaire de recherche, fil d'arianne et le système de traduction: Google Translate Element Gadget + cet unique élément ne sera autre que l'élément
    +
    + ' + // ([2])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN + . tep_image( + // ([5])-->BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + // ([1])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + DIR_WS_DESIGN . '_BerenButtonHamburgerPlaneteCercle.svg', + 'logo', + // ([5])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN + '', + '', + // ([5])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + 'class="size-img responsiveButton _berenIconeUtilisateurHoveredCraftedEffect" uk-toggle="target: #offcanvas-nav"' + ) + // ([2])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + . '' ; + echo + '' + // ([2])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN + . tep_image( + // ([5])-->BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + // ([1])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + DIR_WS_DESIGN . '_logo.svg', + 'logo', + // ([5])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN + '', + '', + // ([5])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + 'class="size-logo-lp"' + ) + // ([2])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + . ''; + ?> +
    + BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> +
    >
    +     		+ [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN + // CODETAG[USING_CARTINFOS] ?> + count_contents() > 0) + { + $headerInclude__ephemereal['stringProductsInstances'] = sizeof($cart->get_products()); + if (tep_session_is_registered('customer_id')) { + if ($is_partner == true OR is_pro_customer() == true) { + $headerInclude__ephemereal['stringCartTotalPrice'] = '' + // prix hors-taxe (ht): + . '' + . str_replace( + 'EUR', + '€', + $currencies->format($cart->show_total( 'HT', $is_partner, $coeff_partner)) . '  ' . 'HT' + ) + . ''; + } else { + $headerInclude__ephemereal['stringCartTotalPrice'] = '' + // prix hors-taxe (ht): + . '' + . str_replace( + 'EUR', + '€', + $currencies->format($cart->show_total( 'TTC',$is_partner,$coeff_partner )) . '  ' . 'TTC' + ) + . ''; + } + } else { + $headerInclude__ephemereal['stringCartTotalPrice'] = '' + // prix toutes-taxes-comprises (ttc): + . '' + . str_replace( + 'EUR', + '€', + $currencies->format($cart->show_total( 'TTC',$is_partner,$coeff_partner )) . '  ' . 'TTC' + ) + . ''; + } + ?> +
    + + + + + 1) { ?> + produits:   + + produit:   + + + + + + + +
    + + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> + + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> +
    + + list + + +
    + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> +      + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN + /* [SHOPPING_CART_IS_ALSO_HERE] */ + // ([9])-->BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> + +
    + + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN + if ($cart->count_contents() > 0) { ?> +   +   +   + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + } ?> + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> + shopping_cart + + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> + +
    + + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN + /* [PREVIEWING_SHOPPING_CART_IS_TRIGGERED_HERE] */ ?> + +
    + +
    + + +
    + +
    + + + +
    + Pré-visualisation du panier +

    + + +

    +
    + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN + $cart_contents_string = ''; + + if ($cart->count_contents() > 0) { + + $cart_contents_string = '
    '; + + $products = $cart->get_products(); + + for ($i=0, $n=sizeof($products); $i<$n; $i++) { + + $cart_contents_string .= '
    '; + + if ((tep_session_is_registered('new_products_id_in_cart')) && ($new_products_id_in_cart == $products[$i]['id'])) { + $cart_contents_string .= '
    '; + + if ((tep_session_is_registered('new_products_id_in_cart')) && ($new_products_id_in_cart == $products[$i]['id'])) { + tep_session_unregister('new_products_id_in_cart'); + } + } + $cart_contents_string .= '
    '; + + } else { + $cart_contents_string .= BOX_SHOPPING_CART_EMPTY; + } + + echo $cart_contents_string; + + echo '
    ' + // ([11])-->BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + . '
    ' + . '|' + // ([11])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN + // prix hors-taxe (ht): + . '' + . str_replace( + 'EUR', + '€', + $currencies->format($cart->show_total( 'HT', $is_partner, $coeff_partner)) . '   ' . 'HT' + ) + . '' + // ([11])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + . '/' + // prix toutes-taxes-comprises (ttc): + . '' + . str_replace( + 'EUR', + '€', + $currencies->format($cart->show_total( 'TTC',$is_partner,$coeff_partner )) . '   ' . 'TTC' + ) + // ([10])-->BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + . '' + . '
    ' + . '
    '; + // ([6])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + ?> +
    + +
    + +
    + +
    +
    + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> + + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> +      +
    + + receipt + + +
    + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> + + BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END + // [DESTROY_EPHEMEREAL_VARIABLE_HERE_FOR_AVOID_CONFLICTS] + $headerInclude__ephemereal = null; ?> +     		+ + ), pour que Safari ne pose pas de problèmes, (alors que tout les autres navigateurs n'ont pas besoin de ça) + cela mène à la création d'une div spécialement pour permettre la reconnaissance de la valeur space-between sur Safari, marche aussi sur les autres navigateurs + - 4/ étape suggérée par Bérengère: + nous devons éviter que OSCommerce depuis sa fonction PHP de génération d'images HTML, à savoir, tep_image(), ne gère le redimensionnement des icones, (ceci est à contrôler, car, ce n'est pas le fonctionnement attendu par cette fonction PHP appartenant à OSCommerce), mais cela est important pour éviter de forcer le redimensionnement pour l'annuler ou le contrôler depuis le responsive + initialement, la taille était de 80x80 + - 5/ nous devons éviter que OSCommerce depuis sa fonction PHP de génération d'images HTML, à savoir, tep_image(), ne gère le balisage alt des icones, + (ceci est à contrôler, car, ce n'est pas le fonctionnement attendu par cette fonction PHP appartenant à OSCommerce), mais cela est important pour éviter d'afficher un texte de balisage inutile au survol + initialement, la valeur était un texte de remplacement au survol (sous forme d'étiquette navigateur) + + } + */ + // ([1])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> + + [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> +
    + [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN + echo + '' + . tep_image( + DIR_WS_DESIGN . '_berenIconeAccesPro.svg', + // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + '', + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN + '', + '', + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + 'class="position_acces_pro _berenIconeUtilisateurHoveredCraftedEffect _berenIconeAccesPro"' + ) + . ''; + + // ([2])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN + echo + '' + . tep_image( + DIR_WS_DESIGN . '_berenIconeAccesPros.svg', + // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + '', + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN + '', + '', + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + 'class="size-img _berenIconeUtilisateurHoveredCraftedEffect _berenIconeAccesPros"' + ) + . ''; + echo + '' + . tep_image( + DIR_WS_DESIGN . '_berenIconeTel.svg', + // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + '', + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN + '', + '', + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + 'class="size-img _berenIconeUtilisateurHoveredCraftedEffect _berenIconeTel" uk-tooltip="title: 03 69 57 64 36; pos: bottom;"' + ) + . ''; + + echo + '' + . tep_image( + DIR_WS_DESIGN . '_berenIconeContact.svg', + // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + '', + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN + '', + '', + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + 'class="size-img _berenIconeUtilisateurHoveredCraftedEffect _berenIconeContact"' + ) + . ''; + echo + '' + . tep_image( + DIR_WS_DESIGN . '_berenIconeFacebook.svg', + // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + '', + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN + '', + '', + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + 'class="size-img _berenIconeUtilisateurHoveredCraftedEffect _berenIconeFacebook"' + ) + . ''; + echo + '' + . tep_image( + DIR_WS_DESIGN . '_berenIconePanier.svg', + // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + '', + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN + '', + '', + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + 'class="size-img _berenIconeUtilisateurHoveredCraftedEffect"' + ) + . ''; + echo + '' + . tep_image( + DIR_WS_DESIGN . '_berenIconeUtilisateur.svg', + // ([5])-->BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + '', + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN + '', + '', + // ([4])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + 'class="size-img _berenIconeUtilisateurHoveredCraftedEffect"' + ) + . ''; + // ([2])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + ?> +
    + [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> +
    (un tableau) qui contient ces étapes + cette étape, requièrera que rajouter une nouvelle ligne dans le tableau (voir étape [2]), + et une nouvelle cellule qui contiendra le tableau (voir étape [3]) + contenant le fil d'arianne (voir étape [4]) + qui contient désormais dans sa structure logique de tableau, le système de traduction (voir étape [5]) + - 2/ ici nous rajoutons un .. pour créer une nouvelle ligne dans le tableau + - 3/ ici nous rajoutons un pour créer une nouvelle cellule dans le tableau + - 4/ nous localisons désormais ici le fil d'arianne + à l'origine, il était situé ailleur (voir CODETAG[BREADCRUMB_BAR_WAS_INITIALLY_HERE]) + - 5/ désormais dans la nouvelle version de 2022, on va déplacer le système de traduction Google Translate Element Gadget ici + à l'origine, il était situé ailleur (voir CODETAG[GOOGLE_TRANSLATE_ELEMENT_GADGET_WAS_INITIALLY_HERE]) + autrement, rien n'a été changé ici, mais, il est important de préciser cela: + (voir le fichier /includes/footer.php, tag: [GOOGLE_TRANSLATE_ELEMENT_GADGET_ON_MATERIAL_DESIGN_ICONS_BUGFIX_HERE]) + car dans le fichier pré-cité.. + .. + ... il s'agit d'une réparation d'une énorme bêtise de Google Translate Element gadget.. + suite à ce problème: https://github.com/google/material-design-lite/issues/1721 + "Goggle translate destroying material-icons tags" + en effet: + ça bousille entièrement les icones Material Design Icons + pourtant, Google Translate Element gadget et Google Material Design Icons sont tout deux des produits.. Google.. : mais ils ne sont pas d'accord + voici une explication plus concise du problème (en anglais), par l'auteur du post-initial du problème: + * Sorry if I'm not doing this correctly, but I just joined GitHub to submit this issue! + * + * I'm using MDL for the first time on a new site and discovered some major problems when users use google translate to translate the page. + * Google translate replaces any text with it's translated version and surrounds it with double tags. + * + * First I thought the font tags where the problem, + * then I realized it's translating the icon label withing the tag, + * so MDL now has no idea which icon you want and it seems like the tags additionally mess with the layout. + * + * I'm working around the problem by adding the class "notranslate" to the tags which does seem to work, + * but it doesn't fix the problem for the "hamburger" drawer icon since that is injected by the JS. + * Is there a way to work around this so it's fixed out of the box for MDL? + * + * Seems like a big issue and unfortunate if the answer is that everyone has to had class="notranslate" to every tag. + * + * Also, any ideas on how to fix the hamburger icon? + un collaborateur de Google Material Design Icons est au courant de ce souci, voici sa réponse: + cf: https://github.com/google/material-design-lite/issues/1721#issuecomment-167230926 + * Commit 04beffa solves the menu icon being translated by using the codepoint. + * + * Either using notranslate with ligatures or the codepoints solves the problem, at least with icons. + * + * For other Translate issues... Probably best to wait for 2.x when we refactor loads of stuff including layout. + * + * We can clearly see layout and possibly grid are completely screwed in translate, but for no *apparent reason. + * + * Rather than spend time debugging this now we should do testing ahead of releasing 2.x to make sure it works better in these cases. + * + * Marking this as a 2.x milestone thing as a reminder. + sauf que.. ça n'a jamais été fixé.. depuis 2015... + 5 ans pu--.. + et toujours pas de patch de Google pour ce souci complètement idiot où Google Translate Element gadget s'entête à traduire les noms de codes des icones Material Design Icons... + bref, j'ai donc mis au point mon propre patch.. + c'est très simple: + j'associe une fois la page chargée à chaque élément du DOM qui possèdent une classe material-icons une seconde classe: notranslate, et cela, à l'aide d'un code Javascript et d'une boucle! + (car utiliser les Code Points, aurait été une plaie, dans le sens où j'aurait du reprendre chacun des fichiers 1 par 1 et donner un nom différent à l'icone en correspondance avec son Code Point + code-points material design icons: https://github.com/google/material-design-icons/blob/master/iconfont/codepoints) + l'effet est réussi: + toutes les icone Material Design Icons sont alors préservées, car chaque élément qui possède une classe material-icons sont en réalité des icones Material Design Icons + contre-coup: ça peut faire ramer la page si il y a plus de 10000 icones, mais.. on en est à milles lieues! + */ + ?> + [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> + [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> + + [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> + + [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> + + [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> + [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + /* + [VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions] + ************************************************************************ + */ + ?> +
    ..
    + [VTAB-TEAM-LINDER-PARTNER-1][OSC][AddClassDescription(headerNavigation)]:{" permet de cibler cet élément depuis une règle CSS "} ?> + [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> + + + [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ + - 1/ on place aussi les liens de construction du menu (Mon Compte etc..), qui servira en mode responsive dans le nouveau design: une rimbambelle de petits boutons sous le header du site) + à noter, dans le fichier: /includes/header.php (cherchez le CODETAG: [MY_ACCOUNT_MENU_IS_ALSO_HERE]), car les liens du menu s'y trouve aussi! + à la différence du système de détection imaginé (et fonctionnel) pour la boite de recherche du site + on a pas besoin de charger de fichiers externes, donc, pas besoin de différencier les blocs, car, les deux blocs sont dans la même page! + donc on va juste différencier ici les éléments à afficher dans les différents modes: (Nested), (Tabled). + mais à l'aide de classe CSS. + ici, c'est le mode (Tabled) qui sera construit, donc on ajoute la classe correspondante à ce mode dans le conteneur affichant le bloc désiré. + ainsi, on pourra aisément piloter via la nouvelle classe CSS son affichage ou pas (display: none ou block) ! + l'idée, c'est d'afficher la version (Nested) uniquement sur grand écran (genre en mode non-responsive). + l'idée, c'est d'afficher la version (Tabled) uniquement sur petit écran (genre en mode responsive). + - 2/ ATTENTION + // [EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__THE_ICONBUTTON] + - avant octobre 2020, le client, aimait l'affichage de cet élément + - depuis octobre 2020, le client, finalement préfère un autre affichage (plus d'informations dessous) + suite à la modification effectuée sur le menu des catégories (encore lui, oui!) (voir CODETAG[EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__THE_OVERLAY]) + ainsi du au fait que nous souhaitons que désormais notre menu soit ouvrable via un petit icone, et sous forme de surcouche par au-dessus du site pour ne plus stocker le menu dans la page en responsive + (et libérer l'emplacement que le menu occupait dans la page) + (uniquement en responsive, et ici, à cet endroit, on a uniquement le menu RESPONSIVE pour les périphériques d'affichages en mode portrait!) + */ + ?> + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN + /* [MY_ACCOUNT_MENU_IS_ALSO_HERE] */ ?> + + + + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> + [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] + ************************************************************************ + */ + ?> + + + [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ + - 1/ on a ici l'emplacement du fil d'arianne (Breadcrumbar), ici on va ajouter différentes classes CSS à quelques éléments, puis reformater un peu le code + - 2/ ajout d'une classe à cette cellule + BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> + + + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> + [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] + ************************************************************************ + */ + ?> +
    + +
    + + contacts + + + portrait + person_add + + assignment_ind + highlight_off + + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> + list + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> +
    + +
    , afin de cibler cet élément plus tard et plus précisemment les liens et séparateurs générés par le ->trail() de OSCommerce + on aurait pu utiliser le composant Breadcrumb de UI Kit, mais il aurait été superflu, on a pas grand chose à revoir ici à part l'affichage du style + - 3/ on vas faire deux choses ici, + on englobe TOUT le code générateur du trail dans une nouvelle structure HTML , + puis on ajoute une structure HTML au séparateur du trail, là aussi un avec lequel on englobe l'entité HTML correspondante au séparateur + */ + ?> + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> + BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> +
    + BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> +   ' . $breadcrumb->trail(' » ') . ''; + // ([5])-->[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN + // -> OSC-83: système de traduction ?> + + + +
    + + + [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> +
    + [VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> +
    +[VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions]:{ + - 1/ // [EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__ADDMENUTRIGGER_ALSO_IN_RESPONSIVE_LANDSCAPE_MODE] + - avant décembre 2021, le client, aimait l'affichage de cet élément qui est le menu dans la page index, constamment visible + - depuis décembre 2021, on opte pour un affichage hors du contenu de la page, uniquement visible sur un déclencheur (plus d'informations dessous) + suite à la modification effectuée sur le menu des catégories (encore lui, oui!) (voir CODETAG[EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__THE_OVERLAY] dans /includes/boxes/categories.php) + ceci est un déclencheur du même menu que celui ayant la classe categoriesMenuLocation--ContainerInModeNested (aussi dans ce fichier, voir plus haut) + si l'on a procédé ainsi c'est que désormais le site en affichage non responsive n'affichera plus le menu dans la page, mais en sur-couche défilante par la gauche + ceci est le déclencheur de l'afficheur du menu +} +*/ +?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> +
    + + + list + +
    +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> +[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] +************************************************************************ +*/ +?> +[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ + - 1/ on place aussi les liens de construction du menu (Contact), qui servira en mode responsive dans le nouveau design: à côté du gadget Google Traduction, + un bloc invisible composé de deux boutons tout ronds pour le téléphone et la page de contact (lien) + à noter, dans le fichier: /includes/header.php (cherchez le CODETAG: [CONTACT_MENU_IS_ALSO_HERE]), car les liens du contact s'y trouve aussi! + à la différence du système de détection imaginé (et fonctionnel) pour la boite de recherche du site + on a pas besoin de charger de fichiers externes, donc, pas besoin de différencier les blocs, car, les deux blocs sont dans la même page! + pas non plus besoin d'user de mode: (Nested), (Tabled). + car ces modes sont réservés à dissocier l'ancien design du nouveau (Nested) = nouveau, reformatés pour être plus jolis sur grand écran, (Tabled) = ancien, reformaté en responsive pour petits périphériques + bref, on va s'aider d'une classe CSS. + ainsi, on pourra aisément piloter via la nouvelle classe CSS son affichage ou pas (display: none ou block) ! + l'idée, c'est de masquer le bloc uniquement sur grand écran (genre en mode non-responsive). + l'idée, c'est d'afficher le bloc uniquement sur petit écran (genre en mode responsive). + on utilise aussi des icones Material Design Icons, on reprends les mêmes que l'on avait pensé pour le grand écran. + - 2/ on ajoute un attribut id à la balise
    contenant l'icone du téléphone + on prévoit un gestionnaire en évènement Javascript pur de double-tap, afin que quand l'on tappe deux fois sur l'icone du téléphone, on soit invité à appeller le numéro! + - 3/ on prévoit qu'au clic sur l'icone de Contact (message), on soit alors redirigé vers la page de contact. +} +*/ +?> +[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN +/* [CONTACT_MENU_IS_ALSO_HERE] */ ?> +
    +
    BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> + id="doubleTap--contactMenuLocationInResponsive--Container__iconContainerForBlockPhoneIcon"> + phone_in_talk + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> + + [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> +
    +
    + mail_outline +
    +
    +[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> +[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] +************************************************************************ +*/ +?> +[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ + - 1/ ATTENTION + - avant octobre 2020, le client, aimait l'emplacement de cet élément en responsive ou en non-responsive + - depuis octobre 2020, le client, finalement aimerait que le diaporama (slideshow) en responsive apparaisse au-dessus du menu des catégories + dans le nouveau design, fichier: /index.php (voir CODETAG[ORIGINAL_SLIDESHOW_IS_LOCATED_HERE]) + donc pour l'explication, il faudra vous reférer là-bas, car ici, on ne fera que reprendre le code introduit dans l'autre fichier + ceci est une mesure pour forcer le diaporama à s'afficher en responsive au-dessus des catégories, suite à une demande tardive du client.. + si une seule modification est à faire au diaporama dans /index.php, faites la modification identique ici aussi + - 2/ toutefois, + - ATTENTION - n'oubliez pas qu'ici: pour le nom de l'élément + qui contient le diaporama on utilise: +
    le diaporama et sa structure
    + ET NON: + le diaporama et sa structure + NOTE - C'est la seule différence avec le diaporama du fichier /index.php + - 3/ ATTENTION + // [EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__THE_HIDEUSELESS_MAINRESPONSIVESLIDESHOW] + - avant octobre 2020, le client, aimait l'affichage de cet élément + - depuis octobre 2020, le client, finalement préfère un autre affichage (plus d'informations dessous) + suite à la modification effectuée sur le menu des catégories (encore lui, oui!) (voir CODETAG[EXPORT_CATEGORIES_MENU_INTO_AN_EXTERNAL_OVERLAY_WITH_UI_KIT__THE_OVERLAY]) + ici, comme on ne se sert plus des flèches spéciales d'auto-scroll (voir CODETAG[USE_TARGET_ID_FOR_AUTO_SCROLL_MECHANISM] dans /includes/boxes/categories.php) + on va juste se servir de la même méthode que la nouvelle variable de vérification ($__phpVar__isChoosenCategoryAlreadyCSSOverride) afin de définir si l'on a déjà choisi une catégorie ou non + - si oui, on masquera en responsive cet élément (div) grâce au ciblage de la nouvelle classe qu'on va lui donner dans ce cas et ce cas uniquement + - si non, on ne fera rien de plus + toutefois, évidemment, nous avons nullifiée cette variable $__phpVar__isChoosenCategoryAlreadyCSSOverride, donc, on ne se servira pas d'elle, mais d'une conditionnelle PHP +} +*/ +?> +[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?> +BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> +BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> +
    + + +
    +
    +
      + ' . "\n"; + echo '
      ' . "\n"; + echo ' ' . "\n"; + echo '
      ' . "\n"; + echo ' ' . "\n"; + } else { + continue; + } + } + $all_files = null; + $image_name = null; + $supported_format = null; + $ext = null; + ?> +
    + + +
    +
      +
      + +
      +[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> +[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] +************************************************************************/ +?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions]:{ + // [VTAB_1_SUB_HEADER_BEFORE_PAGER_TABLE] + - 1/ on va ajouter un nouvel élément au travers d'une toute nouvelle structure HTML qui va simuler un décalage entre le header et le pager (la page), + pour y insérer un sous-entête .. + .. sans cela, notre pager serait situé sous le header .. + .. par ailleurs, placer cet élément dans le header évite de modifier chacune des pages .php du site, sinon, cela serait vite archaïque !! + - 2/ on utilise désormais une fonction faite-maison pour récupérer et afficher le slogan du site au lieu d'un texte en dur +} +*/ +?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> +
      +
      + + BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END + echo vtab_tep_get_slogan(); + ?> + + + person + Accès PRO + +
      +
      +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> +[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] +************************************************************************ +*/ +?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions]:{ + - 1/ on va ajouter un nouvel élément au travers d'une toute nouvelle structure HTML qui va ajouter un encart de zone entre le diaporama et le sous-entête ajouté ailleurs + (voir CODETAG[[VTAB_1_SUB_HEADER_BEFORE_PAGER_TABLE]] + pour y insérer un autre sous-entête .. + .. sans cela, notre pager serait situé sous le header .. + .. par ailleurs, placer cet élément dans le header évite de modifier chacune des pages .php du site, sinon, cela serait vite archaïque !! + - 2/ à noter que ce texte ne doit pas apparaître sur d'autres pages que l'index ET qu'il ne doit pas apparaître en cas de listing de catégories ou de produits + donc, pas en cas de catégories sélectionnées (cPath_array == empty) + - 3/ on utilise désormais une fonction faite-maison pour récupérer et afficher le slogan du site au lieu d'un texte en dur +} +*/ +?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> +
      + + + +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> +
      + +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> +[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] +************************************************************************ +*/ +?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions]:{ + // [VTAB_1_DIAPORAMA] + - 1/ dans la nouvelle version du design, on a souhaité avoir un système de diaporama bien précis en responsive, + les chemins des vignettes du diaporama sont les mêmes que ceux employés dans le système de 6 vignettes (voir CODETAG[VTAB_1_MODULE_VTAB_SIXTHEMELINKS] fichier: '/includes/modules/vtab_sixthemelinks.php') + mais il peut servir aussi en hors responsive, c'est pour cela qu'il n'a pas été étiquetté comme responsive + de plus, il est important de spécifier que la structure ne doit pas s'afficher en cas qu'une catégorie de produits est sélectionnée + sa charte graphique a été définie par Aurore de l'équipe VTAB + il sera sous forme de cartes empilées (effet via un fichier SVG créé par Bérengère de l'équipe VTAB) + il y a beaucoup de code dans ce diaporama, il a été développé par Tempérance de l'équipe VTAB/Saphyra Interactive + il y a deux choses importantes à considérer: + a) il se sépare en 3 éléments : + a.a) le code CSS de mise en page + a.b) le code HTML/PHP de structure et de dynamisme de chargements des diapositives dans le code + a.c) le code JAVASCRIPT de l'interaction du l'utilisateur et du navigateur avec le diaporama + b) il ne se sert absolument pas d'UIKit cette fois + puis finalement, le nom des classes CSS et le nom des éléments est volontairement en Français, pour bien disssocier d'un diaporama (slideshow basique) et de ceux du site gérés par UIKit + - 2/ ici se trouve la structure CSS que l'on inclue depuis différents fichiers CSS externes créés à cet effet + - 3/ ici se trouve la structure HTML qui construit le diaporama et le PHP qui se charge de dynamiser le diaporama actuel + on ajoute une classe précise spéciale: --weHaveChosenCategory + si on est dans une catégorie de produits au lieu de la page d'accueil + - 4/ ici se trouve la structure JAVASCRIPT qui permet autant à l'utiliateur qu'au navigateur d'intéragir avec le diaporama + - 5/ on vide éventuellement les variables PHP utilisées ici dans le but de purger la mémoire du serveur et de libérer par extension la mémoire + - 6/ initialement l'on voulait un effet d'empilement de cartes, on utilisait initialement une structure en background-image pour le fond de la diapositive (fond qui était en réalité un SVG d'empilement de cartes), + désormais, au vu de la non-compatibilité entres les différentes résolutions, nous avons décidé de nous en séparer, au profit d'une seule et unique image () qui contiendra tout en un, et pré-assemblée cela signifie donc : (l'empilement de carte + la vignette, le tout pré-assemblé dans un logiciel graphique) = la diapositive + pour le nom des vignettes: initiallement le nom des fichiers de vignettes était appelée 'vignetteX.png', désormais cela sera sensiblement différent et sera alors 'carte_vignetteX.png' + (voir CODETAG[VTAB_1_OSC_DIAPORAMA_HOME_PAGE_NEW_MECHANISM_VALUE]) + l'ancienne structure a été mise en commentaire pour un usage éventuel futur lors d'une version à venir du site + (voir CODETAG[VTAB_1_OSC_DIAPORAMA_HOME_PAGE_NEW_MECHANISM_STRUCTURE]) + - 7/ à noter que le diaporama ne doit pas apparaître sur d'autres pages que l'index ET qu'il ne doit pas apparaître en cas de listing de catégories ou de produits + donc, pas en cas de catégories sélectionnées (cPath_array == empty) +} +*/ +?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> + +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> + + +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> + +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> +BEGIN[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> + +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::BEGIN ?> + +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> + + +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SubTaskDescription]::END ?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][MultiTaskDescriptions] +************************************************************************/ +?> +[VTAB-TEAM-LINDER-PARTNER-1][OSC][SimpleTaskDescription]:{" on ajoute une div dans laquelle on insère une classe afin de permettre au corps de la page, situé en dessous du header, d'être toujours visible à la suite du header et non en caché car ce dernier est en position "fixed", mais il y a aussi un cas spécial où on sera dans une catégorie ou en cours de visualisation d'une catégorie, depuis la page de l'index, donc on gère ce cas spécifique "} ?> +
      + + + + + [SI-LINDER-PARTNER-2][OSC][SimpleTaskDescription]:{" lorsqu'une erreur est récupérée et passée à travers les fonctions urldecode() et htmlspecialchars() ça donne un beau merdier, on fixe ça ici à l'aide d'un str_replace gérant des tableaux anonymes en guise de remplacement! "} ?> + + +
      ', '', 'ù'), htmlspecialchars(urldecode($HTTP_GET_VARS['error_message']))); ?>
      + + + + [SI-LINDER-PARTNER-2][OSC][SimpleTaskDescription]:{" lorsqu'une erreur est récupérée et passée à travers les fonctions urldecode() et htmlspecialchars() ça donne un beau merdier, on fixe ça ici à l'aide d'un str_replace gérant des tableaux anonymes en guise de remplacement! "} ?> + + +
      ', '', 'ù'), htmlspecialchars($HTTP_GET_VARS['info_message'])); ?>
      +