1 00:00:01,600 --> 00:00:03,720 Dans cette vidéo, je voudrais vous montrer l'inspecteur 2 00:00:03,887 --> 00:00:04,750 et comme on l'utilise. 3 00:00:05,230 --> 00:00:06,280 Qu'est-ce que l'inspecteur ? 4 00:00:07,000 --> 00:00:09,840 C'est un outil qui va nous permettre d'interagir avec n'importe 5 00:00:10,007 --> 00:00:10,920 quel objet du système. 6 00:00:11,900 --> 00:00:15,210 Comme Pharo, tout est écrit à base d'objets, vous allez 7 00:00:15,377 --> 00:00:18,160 pouvoir inspecter tous les objets qui composent Pharo. 8 00:00:18,810 --> 00:00:21,780 La métaphore la plus proche de ce qu'est un inspecteur, 9 00:00:21,947 --> 00:00:26,630 je dirais que c'est un microscope, mais un microscope qui 10 00:00:26,797 --> 00:00:29,810 aurait des possibilités d'interagir avec les objets qu'il 11 00:00:30,000 --> 00:00:32,300 est en train d'observer. C'est comme si vous étiez un 12 00:00:32,467 --> 00:00:36,820 biologiste avec des cellules ou une culture de bactéries 13 00:00:37,030 --> 00:00:39,080 et que tout d'un coup, vous allez pouvoir, avec une 14 00:00:39,247 --> 00:00:42,780 petite pointe, interagir avec ces bactéries alors qu'elles sont vivantes. 15 00:00:42,960 --> 00:00:45,290 Je vous ai préparé une petite expression. 16 00:00:47,080 --> 00:00:49,040 Ça serait très rare dans la vraie vie qu'on mette dans un 17 00:00:49,207 --> 00:00:52,040 dictionnaire une date, un temps et une "Morph" mélangés, 18 00:00:52,350 --> 00:00:54,190 mais pour le but de l'exercice, c'est très bien. 19 00:00:54,630 --> 00:00:56,620 On va voir ça. La première chose à faire une fois que 20 00:00:56,787 --> 00:01:01,450 vous avez tapé cette expression, c'est d'invoquer l' 21 00:01:01,617 --> 00:01:04,120 inspecteur. Donc, on obtient l'inspecteur. 22 00:01:05,240 --> 00:01:08,650 Vous allez voir que c'est un objet qui a plusieurs formes. 23 00:01:08,817 --> 00:01:10,810 Qu'est-ce que me montre l'inspecteur? 24 00:01:11,080 --> 00:01:15,840 Là, il me montre que j'ai plusieurs éléments dans ma 25 00:01:16,007 --> 00:01:18,260 collection. À chaque fois que je clique sur un des 26 00:01:18,427 --> 00:01:22,390 éléments, je vais avoir un autre inspecteur qui s'ouvre 27 00:01:22,557 --> 00:01:23,800 sur l'élément que j'ai sélectionné. 28 00:01:24,230 --> 00:01:28,060 Alors ce qu'il faut voir, c'est que l'inspecteur, en tout 29 00:01:28,227 --> 00:01:32,800 cas GT, la nouvelle version de l'inspecteur en Pharo qui 30 00:01:33,000 --> 00:01:35,840 est développée par l'équipe GT de l'université de Berne, 31 00:01:36,007 --> 00:01:36,640 qu'est-ce qu'il offre ? 32 00:01:36,807 --> 00:01:40,510 Il offre la possibilité de définir différentes vues qui 33 00:01:40,677 --> 00:01:43,890 vont s'adapter à chaque objet que l'on va manipuler. 34 00:01:44,057 --> 00:01:46,840 On ne va peut-être pas vouloir inspecter un dictionnaire 35 00:01:47,007 --> 00:01:50,440 comme on manipule un élément graphique. 36 00:01:51,360 --> 00:01:54,440 Donc, l'intérêt, c'est que chacun de ces éléments va 37 00:01:54,607 --> 00:01:56,640 pouvoir proposer à l'utilisateur des vues différentes. 38 00:01:57,880 --> 00:01:59,760 La vue de base que vous avez, c'est la vue Raw. 39 00:02:00,850 --> 00:02:03,800 C'est la vue qui montre l'implémentation. 40 00:02:04,020 --> 00:02:07,350 Si on regarde, si j'ouvre la classe, par exemple, qui 41 00:02:07,517 --> 00:02:12,400 correspond à OrderedDictionary, cette classe 42 00:02:12,567 --> 00:02:16,060 a 2 variables d'instance, dictionary et orderedKeys. 43 00:02:16,227 --> 00:02:19,780 Là, l'inspecteur va me montrer les valeurs brutes qui 44 00:02:19,947 --> 00:02:21,770 sont contenues dans ces variables d'instances. 45 00:02:22,000 --> 00:02:25,640 Si je clique sur dictionary, je vois que c'est un dictionnaire. 46 00:02:25,807 --> 00:02:29,360 Donc, si j'avais cliqué dessus, je vois ici, c'est un dictionnaire. 47 00:02:30,550 --> 00:02:34,000 Et là, je vois encore une fois la vue brute de cet objet-là. 48 00:02:34,760 --> 00:02:37,500 Il a des clés ordonnées qui est un tableau apparemment. 49 00:02:38,760 --> 00:02:41,080 J'ai un tableau avec Time, Date et Morph. 50 00:02:44,270 --> 00:02:47,170 Maintenant, quand je suis en mode Items - le mode Items, 51 00:02:48,860 --> 00:02:53,220 c'est que l'entité OrderedDictionary me propose de voir 52 00:02:53,387 --> 00:02:56,590 ces clés et ces valeurs d'une manière plus sympa parce 53 00:02:56,757 --> 00:02:59,100 que là, si on regarde, il faut aller à l'intérieur. 54 00:02:59,267 --> 00:03:01,950 Ça devient un peu délicat. 55 00:03:02,117 --> 00:03:03,870 Donc, là on ne sait pas "ah oui, c'est laquelle? 56 00:03:04,037 --> 00:03:07,040 Ah, c'est celle-là, peut-être qu’à 6, ça veut dire que j'ai 57 00:03:07,450 --> 00:03:11,430 une association dans laquelle j'ai Time, j'ai la clé et la valeur, etc. 58 00:03:11,597 --> 00:03:16,080 ". Donc, ce que vous voyez déjà, c'est que l'inspecteur navigue. 59 00:03:16,410 --> 00:03:17,930 J'ai cette petite barre de navigation. 60 00:03:18,220 --> 00:03:22,260 Quand je mets la souris sur les petits ronds, je vois un 61 00:03:22,427 --> 00:03:24,270 preview de l'endroit où je vais aller si je clique dessus. 62 00:03:25,130 --> 00:03:28,060 Et ce que je peux faire aussi, je peux réduire ou changer 63 00:03:28,510 --> 00:03:31,510 la taille des fenêtres et le focus que je veux avoir. 64 00:03:31,720 --> 00:03:35,220 Si je prends les trois par exemple, je vais mettre en 65 00:03:35,387 --> 00:03:36,590 gros pour que vous le voyiez bien. 66 00:03:37,680 --> 00:03:42,460 Maintenant, quand je suis en mode Items, c'est beaucoup 67 00:03:42,627 --> 00:03:44,300 plus sympa parce que je vais pouvoir interagir. 68 00:03:44,467 --> 00:03:47,570 Donc là, je vois date, j'ai la clé et la valeur, quand je 69 00:03:47,737 --> 00:03:52,330 sélectionne, par exemple, je vois date, date au format 70 00:03:52,620 --> 00:03:54,550 brut des variables d'instances. 71 00:03:54,820 --> 00:03:58,260 Si je faisais self browse, vous imaginez ce qu'on va voir. 72 00:03:58,427 --> 00:04:03,220 On va voir exactement une date, Timespan, 73 00:04:03,690 --> 00:04:05,000 donc j'ai start et duration. 74 00:04:06,810 --> 00:04:07,710 J'ai bien start et duration. 75 00:04:09,000 --> 00:04:11,730 Si je regarde l'onglet Details, 76 00:04:15,040 --> 00:04:19,390 ce que me propose la date, c'est de la voir avec, par 77 00:04:19,557 --> 00:04:24,280 exemple, une année, un mois, ce genre de choses, sous 78 00:04:24,447 --> 00:04:25,420 forme Iso par exemple. 79 00:04:27,150 --> 00:04:28,000 Comment ça se passe ? 80 00:04:28,147 --> 00:04:29,730 En fait, on le verra dans une autre vidéo, mais c'est que 81 00:04:30,370 --> 00:04:33,050 chaque objet peut décider des facettes qu'il va exposer 82 00:04:33,760 --> 00:04:35,430 et qu'il va proposer à l'inspecteur. 83 00:04:36,230 --> 00:04:37,640 Donc là, il y a calendar, par exemple. 84 00:04:37,807 --> 00:04:42,330 On voit qu'on a une représentation graphique de ce que c'est que la date. 85 00:04:44,400 --> 00:04:45,400 Je reviens en arrière. 86 00:04:48,570 --> 00:04:52,020 De la même manière, pour Times, vous voyez qu'on a les mêmes choses. 87 00:04:52,560 --> 00:04:56,200 Alors je vous ai montré les onglets Raw. 88 00:04:57,440 --> 00:04:58,540 Vous avez aussi l'onglet Meta. 89 00:04:59,840 --> 00:05:03,480 C'est un mini browser de code qui vous montre toutes les méthodes. 90 00:05:03,647 --> 00:05:06,770 Par exemple, là je peux voir toutes les méthodes parce 91 00:05:06,937 --> 00:05:11,410 que j'aurais peut-être envie d'interagir avec ma date, time. 92 00:05:11,840 --> 00:05:15,310 Imaginons que je ne sache pas ce que je peux lui envoyer, 93 00:05:15,477 --> 00:05:17,000 peut-être que je peux lui envoyer hours. 94 00:05:17,137 --> 00:05:21,500 Il me rend 18. Il est 18 heures. 95 00:05:22,350 --> 00:05:25,780 Ça normalement, je devrais pouvoir le voir ici si je cherche hour. 96 00:05:27,540 --> 00:05:30,900 J'ai la définition de la méthode. 97 00:05:31,067 --> 00:05:32,550 C'est juste pour être plus dans le flow. 98 00:05:34,140 --> 00:05:36,000 Maintenant, si je regarde Morph. 99 00:05:37,940 --> 00:05:39,130 C'est un objet plus compliqué. 100 00:05:39,297 --> 00:05:42,300 On voit plusieurs pans qui sont différents. 101 00:05:43,000 --> 00:05:44,660 Ce qui est sympa là, par exemple, c'est que si je clique 102 00:05:44,827 --> 00:05:46,620 sur Morph, je vois son rendu. 103 00:05:48,190 --> 00:05:52,640 Je vois le rendu de l'objet Morph 104 00:05:52,900 --> 00:05:57,330 qui est en fait un HSVAColorSelectorMorph. 105 00:06:02,720 --> 00:06:04,720 Juste pour vous montrer, en fait avec l'inspecteur, ce 106 00:06:04,887 --> 00:06:06,560 que je peux faire, je peux interagir avec mon objet. 107 00:06:07,100 --> 00:06:11,470 Je peux lui dire de s'ouvrir dans un monde et je vais 108 00:06:11,637 --> 00:06:13,270 pouvoir interagir avec mon objet. 109 00:06:16,870 --> 00:06:21,390 Ça dépendra de ce qu'il me propose comme 110 00:06:22,000 --> 00:06:26,560 fonctionnalité. Je peux lui demander 111 00:06:26,727 --> 00:06:29,090 selectedColor. On va voir si ça fonctionne. 112 00:06:29,890 --> 00:06:30,590 Si je fais self selectedColor. 113 00:06:30,757 --> 00:06:35,590 Il me rend une couleur. 114 00:06:36,000 --> 00:06:39,000 Là, c'est intéressant parce que ce que je peux faire avec 115 00:06:39,700 --> 00:06:42,360 l'inspecteur, c'est que là j'ai fait un print, ça m'a 116 00:06:42,527 --> 00:06:44,260 donné une représentation textuelle de l'objet. 117 00:06:44,940 --> 00:06:49,080 Je pourrais invoquer, je pourrais faire inspect dessus 118 00:06:49,740 --> 00:06:51,760 et ça m'ouvrirait un autre inspecteur. 119 00:06:51,927 --> 00:06:52,690 C'est ce que je suis en train de faire là. 120 00:06:52,857 --> 00:06:55,000 Maintenant, si je veux que le résultat de cette 121 00:06:55,167 --> 00:07:00,080 expression soit injecté dans le flow de mon inspecteur, 122 00:07:00,247 --> 00:07:01,000 qu'est-ce que je peux faire ? 123 00:07:01,137 --> 00:07:03,190 Il suffit que je fasse Do it and go. 124 00:07:03,610 --> 00:07:08,360 Si je fais Do it and go, j'ai ajouté dans le flow d'interaction 125 00:07:08,790 --> 00:07:11,010 un nouvel objet et un inspecteur sur un nouvel objet. 126 00:07:11,530 --> 00:07:15,620 Vous avez compris. Là, ce sont mes couleurs avec l'encodage des couleurs. 127 00:07:16,580 --> 00:07:17,500 Rien de bien spécial. 128 00:07:21,800 --> 00:07:24,250 On va revenir en arrière. 129 00:07:26,570 --> 00:07:31,110 Ce qui est intéressant de voir, c'est que là, j'ai une 130 00:07:31,277 --> 00:07:33,820 vision de mon objet par exemple en sous-morph. 131 00:07:36,000 --> 00:07:38,500 Si je veux avoir la même vision et si je veux trouver les 132 00:07:38,667 --> 00:07:42,180 sous-morph qui composent mon objet graphique, quand je 133 00:07:42,347 --> 00:07:47,030 suis en mode Raw, je vais devoir aller naviguer 134 00:07:47,200 --> 00:07:52,050 à l'intérieur de mon arbre de composants graphiques. 135 00:07:53,130 --> 00:07:54,280 Ça peut être vraiment pénible. 136 00:07:55,080 --> 00:07:57,760 Je vais vous montrer une astuce vraiment sympathique. 137 00:07:59,190 --> 00:08:03,660 Imaginons que j'ai mon arbre de Morph. 138 00:08:05,550 --> 00:08:08,640 J'ai 2 vues qui sont exactement les mêmes sur le même objet. 139 00:08:11,160 --> 00:08:12,820 Ce que je peux faire, c'est faire Submorph. 140 00:08:13,530 --> 00:08:16,540 Je vais faire Submorph dans celui-là et là j'ai Morph. 141 00:08:16,830 --> 00:08:20,520 Maintenant, je vais pouvoir sélectionner dans mon arbre les éléments. 142 00:08:22,230 --> 00:08:25,610 Ce que je lui dis, je ne veux que tu affiches ici que 143 00:08:25,777 --> 00:08:30,590 celui-là, ou alors par exemple, là je suis vraiment 144 00:08:30,757 --> 00:08:35,290 sur la sous-feuille de mon arbre qui correspond à ma sélection. 145 00:08:36,360 --> 00:08:38,900 C'est super puissant parce que souvent, si je devais 146 00:08:39,100 --> 00:08:43,350 trouver la sous-morph qui correspond à ce 147 00:08:43,517 --> 00:08:48,480 petit indicateur, là c'est relativement facile, c'est celui-là. 148 00:08:50,440 --> 00:08:54,850 Par contre, si je suis dans un mode traditionnel, c'est 149 00:08:55,017 --> 00:08:58,130 une autre paire de manches parce qu'il va falloir, en 150 00:08:58,297 --> 00:08:59,350 fait je ne sais pas comment faire. 151 00:08:59,517 --> 00:09:02,270 Il va falloir que j'aille à l'intérieur 152 00:09:05,440 --> 00:09:06,960 jusqu'à ce que je trouve. 153 00:09:07,470 --> 00:09:12,060 C'est ici, il me semble, parce que là c'est un objet 154 00:09:12,227 --> 00:09:12,860 simple. 155 00:09:14,500 --> 00:09:16,530 Vous allez voir dans les autres vidéos qu'on va pouvoir 156 00:09:16,697 --> 00:09:20,680 faire ce genre de manipulation sur tous les objets du système. 157 00:09:21,370 --> 00:09:23,530 Je vais vous montrer en particulier qu'on peut faire ça 158 00:09:23,697 --> 00:09:27,850 sur des systèmes de fichiers, sur les classes elles-mêmes. 159 00:09:28,160 --> 00:09:30,040 En guise de conclusion, ce qu'on a vu finalement c'est 160 00:09:30,207 --> 00:09:32,560 que l'inspecteur c'est un objet qui va vous permettre de 161 00:09:32,727 --> 00:09:37,230 parler et d'interagir, de changer des objets vivants, vos 162 00:09:37,397 --> 00:09:41,010 objets, et d'une autre part, c'est que chaque objet va 163 00:09:41,177 --> 00:09:45,730 exposer différentes facettes ou différentes vues sur 164 00:09:45,897 --> 00:09:48,260 lui-même de façon à vous permettre d'avoir une 165 00:09:48,427 --> 00:09:51,640 interaction différente suivant vos scénarios. 166 00:09:51,807 --> 00:09:53,760 Ça donne un objet qui est très, très puissant. 167 00:09:54,190 --> 00:09:56,290 En fait, GT Inspector est vraiment un super outil.