[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 ?>[SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions]:{ - 1/ on va commencer par structurer le nouveau fichier, de manière à facilement le reconnaître dans le code source, et surtout on respecte le système d'infobox de OSCommerce, afin de préserver la structure ET la philosophie d'affichage d'OSCommerce, soit usage de $info_box_contents = array(); $info_box_contents[] = array('text' .. menuInfoBoxHeading() et $info_box_contents = array(); $info_box_contents[] = array('text' .. menuInfoBox() on n'oublie pas d'ouvrir et de fermer les lignes du tableau ( et ) ainsi que la cellule contenante ( et ), cela est requis car en réalité, ici, l'on se trouve dans une )

qui est construite depuis le fichier .php accédé (exemple: index.php). ce n'en sera que plus simple après en cas de besoin d'adapter à une version future! et pour pouvoir identifier en responsive cette cellule via un sélecteur CSS, on va ajouter au BEGIN[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?> [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN $cardboxMethodesLivraison__images = null; $boxCardboxMethodesLivraison__phpvar_cellBox_content = null; // ([3])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END // ([1])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END /* [SI-LINDER-PARTNER-2][OSC][MultiTaskDescriptions] ************************************************************************ */

une petite classe CSS ! - 2/ on crée quelques variables PHP pour définir le nom d'une image (existante) certaines nous serviront plus d'une fois dans ce fichier.. les images sont stockées dans un dossier que l'on verra plus tard (en [5] et [6]). à noter pour les cartes-boites, (car c'est bien une carte-boite et non une boite, en apparence visuelle), on utilise jamais d'images aléatoires et on stocke chaque image dans un index d'un nommé tableau associatif - 3/ nous n'oublions pas de nullifier les variables déclarées en [2] et [5] (de les détruire), à la fin du fichier, ceci, pour éviter tout risque de conflits, un peu comme une purge. - 4/ il est très important que cette carte-boite ne dispose d'aucuns titres géré par OSCommerce du-moins, donc, on écrit bel et bien un titre mais entre commentaires HTML, le code le verra, mais l'utilisateur non (sauf si l'utilisateur explore le code-source HTML une fois rendu par le serveur web, mais, peu importe, ça ne pose aucun souci de sécurité ni même de reverse engineering..) elle ne servira pas, MAIS elle est essentielle à l'éco-système et philosophie de OSCommerce toutefois, même si elle est essentielle, comme on ne s'en servira pas, on va juste à l'aide de commentaires PHP empêcher son affichage. (donc pas rendue en HTML, même masquée). - 5/ on utilise une variable pour définir le contenu de la carte-boite aussi, on développe la structure HTML de la carte-boite ici elle sera stylisée plus tard par du code CSS et c'est là que certaines variables définies en [2], vont servir, dans le sens où, on va afficher la fameuse image, et en spécifier pour la première fois le chemin d'accès il y a un bouton-lien spécial, qu'on a construit sans faire appel au composant Button de UI Kit:

[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN // ([2])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN $cardboxMethodesLivraison__images = array( 'dpd-predict' => 'methodeslivraison__mixed__dpdpredict.png', 'dpd-pickup' => 'methodeslivraison__mixed__dpdpickup.png', 'colissimo-coliposte' => 'methodeslivraison__mixed__colissimo_coliposte.jpg', 'chronopost' => 'methodeslivraison__mixed__chronopost.jpg', ); // ([2])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?>

[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN $info_box_contents[] = array('text' => ''); //new menuInfoBoxHeading($info_box_contents, false, false); // ([4])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END // ([5])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN $boxCardboxMethodesLivraison__phpvar_cellBox_content = '

'; $info_box_contents = array(); $info_box_contents[] = array('text' => $boxCardboxMethodesLivraison__phpvar_cellBox_content); new menuInfoBox($info_box_contents); // ([5])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::END ?>[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN ?>