txs:contrib:framadate_p18:resolution_de_l_issue_125

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentes Révision précédente
txs:contrib:framadate_p18:resolution_de_l_issue_125 [2020/02/22 02:47] – ↷ Liens modifiés en raison d'un déplacement. 94.130.216.182txs:contrib:framadate_p18:resolution_de_l_issue_125 [2020/09/16 11:24] (Version actuelle) – modification externe 127.0.0.1
Ligne 1: Ligne 1:
 +====== Résolution d'une issue 1 : #125======
 +===== Description de l'issue =====
 +==== Lien ====
 +https://framagit.org/framasoft/framadate/issues/125
 +
 +==== Texte ====
 +<code>
 +Choose between "," and ";" as field seperator in the CSV-export.
 +Please use ";" as field seperator when using CSV-export instead of ",". That makes opening these files in Microsoft Excel a lot easier.
 +</code>
 +Après discussion la modification consistera en un choix, à l'aide d'un menu déroulant afin de sélectionner le séparateur.
 +
 +
 +==== Justification du choix ====
 +C'est une issue plus complexe que l'issue   [[https://wiki.picasoft.net/doku.php?id=txs:framadate-p18:resolution_de_l_issue_237|237]]   cependant elle peut être fragmentée en plusieurs morceaux de difficulté plus simple .
 +
 +
 +Voici une copie d'écran après les modifications :
 +{{:txs:framadate-p18:capture_d_ecran_2018-05-09_00-33-03.png?400|100}}
 +
 +===== Informations utiles  =====
 +===exportcsv.php ===
 +Une page PHP //framadate/exportscsv.php// crée un fichier d'export de tout le tableau des participants avec leurs réponses dans un tableau, actuellement au format CSV.
 +
 +===implode ===
 +La fonction PHP //implode// rassemble les éléments d'un tableau en une chaîne.
 +Cela nous permet ensuite de travailler sur ces éléments avec une variable.
 +Elle  est souvent utilisé avec la fonction explode
 +===explode ===
 +La fonction PHP //explode// Coupe une chaîne en segments
 +L'utilisation de explode et implode permet de découper nos chaines et de les retravailler pour les remettre ensuite dans nos tableaux
 +
 +===bootstrap ===
 +La plupart du CSS est déjà créé grâce à du //bootstrap//. Avant de créer quoi que ce soit, il faut vérifier si cela n'existe pas déjà. Toute la documentation concernant le //bootstrap// est ici :
 +
 +[[https://getbootstrap.com/docs/4.1/getting-started/introduction/|{{txs:framadate-p18:600600p3764ednmainbootstrap-social-logo.png?100}}]]
 +==== Démarche des recherches  ====
 +
 +=== Itération 1 :  transformer  , en ; ===
 +Pour cette première étape, le principe est très simple on remplace chaque "," rencontré par un ";".
 +Il a été cependant intéressant de chercher à comprendre le fonctionnement en modifiant petit à petit chaque caractère.
 +
 +<code>
 +$moment=explode(',',$slot->moments);
 +</code>
 +
 +devient 
 +
 +<code>
 +$moment=explode(';',$slot->moments);
 +</code>
 +
 +=== Itération 2 : créer une variable contrôlant le séparateur  ===
 +On sait maintenant comment contrôler manuellement le changement du séparateur, créons  une  variable à changer sur la page.
 +
 +<code>
 +if ($exportchoice=='CSV'){
 +  $delimiter=',' ;
 +}
 +else{
 +  $delimiter=';' ;
 +}
 +</code>
 +
 +Et on modifie  , ou ; en $delimiter 
 +
 +<code>
 +$moment=explode($delimiter,$slot->moments);
 +</code>
 +
 +=== Itération 3 : créer un formulaire html===
 +On se situe  maintenant dans un fichier template : ''tpl/part/poll_info.tpl''.
 +Les spécificités de ces fichiers sont expliqués [[https://wiki.picasoft.net/doku.php?id=txs:framadate-p18:etude_de_l_architecture_globale_du_projet_framadate|ici ]].
 +
 +En observant la page du côté client on observe qu'il y a 3 boutons :
 +  *export
 +  *menu déroulant : icône poubelle 
 +  *print
 +Le menu déroulant (le petit logo poubelle) est similaire à la fonctionnalité que l'on désire créer. Le code  est  donc similaire en de nombreux points, au niveau des classes //dropdown-menu// (codé  sur plus de 3 pages CSS et JS ''css/bootstrap-theme.CSS''''css/bootstrap-theme.css.map''''js/bootstrap.js'' : ), et des balises //li// et// ul// 
 +
 +<code>
 +<ul class="dropdown-menu" role="menu">
 +    <li>
 +        <button type="submit" name="remove_all_votes">, 'Remove all the votes') }</button>
 +    </li>
 +    <li>
 +        <button class="btn btn-link" type="submit" name="remove_all_comments">{__('PollInfo','Remove all the comments')}</button>
 +    </li>
 +    <li class="divider" role="presentation"/>
 +    <li>
 +        <button class="btn btn-link" type="submit" name="delete_poll">{__('PollInfo', 'Remove the poll')}</button>
 +    </li>
 +</ul>
 +</code>
 +
 +Ainsi, La ligne servant à exporter le sondage :
 +
 +<code>
 +  <a href="{$SERVER_URL|html}exportcsv.php?poll={$poll_id|html}" class="btn btn-default"><span class="glyphicon glyphicon-download-alt"></span> {__('PollInfo', 'Export to CSV')}</a>
 +</code>
 +
 +devient :
 +
 +<code>
 +    <div>
 +        <button type="button" class="glyphicon glyphicon-download-alt" data-toggle="dropdown"/>
 +
 +        <ul class="dropdown-menu1" role="menu">
 +            <li>
 +                <a href="{$SERVER_URL|html}exportcsv.php?poll={$poll_id|html}"
 +                    class="btn btn-default"><span class="glyphicon glyphicon-download-alt"/>{__('PollInfo', ',')}</a>
 +            </li>
 +            <li>
 +                <a href="{$SERVER_URL|html}exportcsv.php?poll={$poll_id|html}"
 +                    class="btn btn-default"><span class="glyphicon glyphicon-download-alt"/>{__('PollInfo', ';')}</a>
 +            </li>
 +        </ul>
 +    </div>
 +</code>
 +
 +Une balise "div" a été ajoutée afin d'éviter que les menus déroulants ne soient les mêmes. En effet, s'ils partageaient la même div le CSS ne ferait pas la distinction entre les deux.
 +
 +=== Itération 4 : envoyer le choix html  à $exportchoice ===
 +
 +Je me suis reporté au tutoriel de  [[https://openclassrooms.com/courses/concevez-votre-site-web-avec-php-et-mysql/transmettre-des-donnees-avec-les-formulaires|openclassrom ]]\\ j'ai tout d'abord testé à envoyer  les données en post, après de multiples essais je n'ai pas réussi j'ai donc essayé en GET en modifiant directement le lien depuis un navigateur. 
 +https://framadate.org/exportcsv.php?admin=H4q3YSmDQbXnx2HLHUjnSm5V&exportchoice=CSV
 +
 + 
 +=== Itération 5 :gérer les traductions ===
 +
 +Pour gérer les  traductions,il faut  faire deux choses :
 +
 +**Modifier le fichier en.json** :
 +Ajouter dans le dossier /locale/en.json selon ce format (ici avec edit name)'' "Edit the name": "Edit name"'', si la page n'existe pas il faut rajouter le nom de la page avec ''"nomdelapage {"edit the name" : "edit name"}''\\
 +
 +**Modifier l'HTML** :
 +Chaque contenu apparaissant à l'écran doit avoir ce format'' {__('nomdelapage', 'motvisible')}''
 +
 +
 +
 +
 +===== Merge request ===== 
 +https://framagit.org/anaellacour/framadate/commit/28f4a2ff95dd67135ce65907c83eb6747d52cd95
 +