[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 $importationGrandeQuantite__randomizator = null; $importationGrandeQuantite__image = null; $boxImportationGrandeQuantite__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 générer le nom d'une image (existante) entre 1 et x. 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]). pour cette génération, un simple usage de rand(), fonction native de PHP et on se sert du résultat obtenu pour construire une chaîne qui contiendra le nom de notre image au complet (le chemin vers l'image en moins) ah et n'oublie pas de transtyper la valeur en chaîne (pour éviter une erreur PHP "Type Error") - 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 boite ne dispose d'aucuns titres, 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 boite aussi, on développe la structure HTML de la 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 à l'aide de UI Kit: [SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN // ([2])-->[SI-LINDER-PARTNER-2][OSC][SubTaskDescription]::BEGIN $importationGrandeQuantite__randomizator = rand(1, 1); $importationGrandeQuantite__image = 'importationgrandequantite__' . (string)$importationGrandeQuantite__randomizator . '.png'; // ([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 $boxImportationGrandeQuantite__phpvar_cellBox_content = '

Importation Grande Quantité
Avec marquage publicitaire

-----

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