1
00:00:01,600 --> 00:00:03,720
In this videos, I'll
show you the inspector

2
00:00:03,887 --> 00:00:04,750
and how to use it.

3
00:00:05,230 --> 00:00:06,280
What is the Inspector?

4
00:00:07,000 --> 00:00:09,840
It's a tool that enables
to interact with

5
00:00:10,007 --> 00:00:10,920
any object of the system.

6
00:00:11,900 --> 00:00:15,210
As in Pharo everything is written
based on objects,

7
00:00:15,377 --> 00:00:18,160
you can inspect all the objects
composing Pharo.

8
00:00:18,810 --> 00:00:21,780
The closest metaphor
about what is the inspector:

9
00:00:21,947 --> 00:00:26,630
the inspector is a microscope,
but a microscope which

10
00:00:26,797 --> 00:00:29,810
has capabilities to
interact with the objects

11
00:00:30,000 --> 00:00:32,300
it is observing.
It is as if you were

12
00:00:32,467 --> 00:00:36,820
a biologist studying cells
or bacterias,

13
00:00:37,030 --> 00:00:39,080
and all of a sudden
you are able to, thanks to

14
00:00:39,247 --> 00:00:42,780
a needle, interact with these
living bacterias.

15
00:00:42,960 --> 00:00:45,290
I have prepared
a little expression.

16
00:00:47,080 --> 00:00:49,040
In real life it would be
very rare to put

17
00:00:49,207 --> 00:00:52,040
a date, a time and
a "Morph" mixed in a dictionary.

18
00:00:52,350 --> 00:00:54,190
but for the purpose of this
exercise it's ok.

19
00:00:54,630 --> 00:00:56,620
Let's see this. The first
thing to do once

20
00:00:56,787 --> 00:01:01,450
you typed the expression,
is to call upon

21
00:01:01,617 --> 00:01:04,120
the inspector. So,
we get the inspector.

22
00:01:05,240 --> 00:01:08,650
You'll see it is a
polymorphic object.

23
00:01:08,817 --> 00:01:10,810
What does the inspector shows?

24
00:01:11,080 --> 00:01:15,840
Here, it shows that I have
several elements in my

25
00:01:16,007 --> 00:01:18,260
collection. Each time
I click on one element,

26
00:01:18,427 --> 00:01:22,390
I will get another
inspector opening

27
00:01:22,557 --> 00:01:23,800
on the selected element.

28
00:01:24,230 --> 00:01:28,060
You have to notice that
the GT inspector

29
00:01:28,227 --> 00:01:32,800
is the new version of
the inspector in Pharo,

30
00:01:33,000 --> 00:01:35,840
it is developed by the
GT Team at Bern University.

31
00:01:36,007 --> 00:01:36,640
What does it offer?

32
00:01:36,807 --> 00:01:40,510
It offers the possibility
to define different views

33
00:01:40,677 --> 00:01:43,890
adapted to each
particular object.

34
00:01:44,057 --> 00:01:46,840
You may not inspect a dictionary

35
00:01:47,007 --> 00:01:50,440
the same way you manipulate
a graphical element.

36
00:01:51,360 --> 00:01:54,440
The interesting point is that
each one of these elements

37
00:01:54,607 --> 00:01:56,640
can offer a different view
to the user.

38
00:01:57,880 --> 00:01:59,760
The basic view that you have
is the Raw view.

39
00:02:00,850 --> 00:02:03,800
This is the view showing the
implementation.

40
00:02:04,020 --> 00:02:07,350
For instance, I open the class

41
00:02:07,517 --> 00:02:12,400
corresponding to OrderedDictionary,
this class has

42
00:02:12,567 --> 00:02:16,060
2 instance variables,
dictionary and orderedKeys.

43
00:02:16,227 --> 00:02:19,780
Here, the inspector will
show me raw values

44
00:02:19,947 --> 00:02:21,770
contained in these instance
variables.

45
00:02:22,000 --> 00:02:25,640
If I click on dictionary,
I see it is a dictionary.

46
00:02:25,807 --> 00:02:29,360
If I had clicked on it, I see here,
it is a dictionary.

47
00:02:30,550 --> 00:02:34,000
And there, I see once more
the raw view of this object.

48
00:02:34,760 --> 00:02:37,500
It has orderedKeys which is
apparently an array.

49
00:02:38,760 --> 00:02:41,080
I have an array with
Time, Date and Morph.

50
00:02:44,270 --> 00:02:47,170
When I am in Items mode -
the Items mode is

51
00:02:48,860 --> 00:02:53,220
that this OrderedDictionary
element offers me to see

52
00:02:53,387 --> 00:02:56,590
its keys and values in a
better way.

53
00:02:56,757 --> 00:02:59,100
If you look here, you have to
go inside and

54
00:02:59,267 --> 00:03:01,950
it gets a little touchy.

55
00:03:02,117 --> 00:03:03,870
Here we don't know...
"Which one is it?

56
00:03:04,037 --> 00:03:07,040
Ah,it is this one, may be at 6
it means that

57
00:03:07,450 --> 00:03:11,430
I have an association in which there
is Time, I have the key and the value, etc."

58
00:03:11,597 --> 00:03:16,080
So, you see that the inspector
browses.

59
00:03:16,410 --> 00:03:17,930
There is this little
browsing bar.

60
00:03:18,220 --> 00:03:22,260
When I put the cursor on these
little circles, I see

61
00:03:22,427 --> 00:03:24,270
a preview of the screen
I will go to if I click on it.

62
00:03:25,130 --> 00:03:28,060
I can also reduce or change

63
00:03:28,510 --> 00:03:31,510
the windows' size and the focus
I want.

64
00:03:31,720 --> 00:03:35,220
I can select the three for instance.
Here I choose a large size

65
00:03:35,387 --> 00:03:36,590
for you to see better.

66
00:03:37,680 --> 00:03:42,460
When I am in Items mode,

67
00:03:42,627 --> 00:03:44,300
it is better because
I can interact.

68
00:03:44,467 --> 00:03:47,570
Here I see a date, the key
and the value. For instance,

69
00:03:47,737 --> 00:03:52,330
when I select, I see date,
date in the raw format

70
00:03:52,620 --> 00:03:54,550
of instance variables.

71
00:03:54,820 --> 00:03:58,260
If I do self browse,
you can imagine what we'll see.

72
00:03:58,427 --> 00:04:03,220
We'll see exactly a date, Timespan,

73
00:04:03,690 --> 00:04:05,000
so I have start and duration.

74
00:04:06,810 --> 00:04:07,710
I do have start and duration.

75
00:04:09,000 --> 00:04:11,730
If I look at the Details tab,

76
00:04:15,040 --> 00:04:19,390
the date offers me to see it with,

77
00:04:19,557 --> 00:04:24,280
for instance, a year, a month,
that kind of things,

78
00:04:24,447 --> 00:04:25,420
in an ISO format for instance.

79
00:04:27,150 --> 00:04:28,000
How does it work?

80
00:04:28,147 --> 00:04:29,730
We will see it in another video,
but in fact each object

81
00:04:30,370 --> 00:04:33,050
can decide the aspects it will show

82
00:04:33,760 --> 00:04:35,430
and offer to the inspector.

83
00:04:36,230 --> 00:04:37,640
Here there is the calendar for instance.

84
00:04:37,807 --> 00:04:42,330
You can see there is a graphical
representation of what is a date.

85
00:04:44,400 --> 00:04:45,400
I go backward.

86
00:04:48,570 --> 00:04:52,020
In the same way, for Times,
you can see that there are the same things.

87
00:04:52,560 --> 00:04:56,200
I have shown you the Raw tabs.

88
00:04:57,440 --> 00:04:58,540
There is also the Meta tab.

89
00:04:59,840 --> 00:05:03,480
It is a mini code browser which
shows you the methods.

90
00:05:03,647 --> 00:05:06,770
For instance, here I can see the methods

91
00:05:06,937 --> 00:05:11,410
because I may wish to interact
with the date, time.

92
00:05:11,840 --> 00:05:15,310
Let's imagine that I don't know
what I can send to it,

93
00:05:15,477 --> 00:05:17,000
maybe I can send it hours.

94
00:05:17,137 --> 00:05:21,500
It returns 18. It's 18.

95
00:05:22,350 --> 00:05:25,780
Normally, I could see it there if I
look for hour.

96
00:05:27,540 --> 00:05:30,900
I got the method definition.

97
00:05:31,067 --> 00:05:32,550
It is just to be more in the flow.

98
00:05:34,140 --> 00:05:36,000
Now, if I look at Morph.

99
00:05:37,940 --> 00:05:39,130
It is a more complicated object.

100
00:05:39,297 --> 00:05:42,300
We see several different
aspects.

101
00:05:43,000 --> 00:05:44,660
What is nice here, for instance,
is that if I click on

102
00:05:44,827 --> 00:05:46,620
Morph, I see its rendering.

103
00:05:48,190 --> 00:05:52,640
I see the rendering of the Morph object

104
00:05:52,900 --> 00:05:57,330
which is indeed a
HSVAColorSelectorMorph.

105
00:06:02,720 --> 00:06:04,720
Just to show you, in fact
with the inspector,

106
00:06:04,887 --> 00:06:06,560
I can interact with my object.

107
00:06:07,100 --> 00:06:11,470
I can tell it to open in a world
and I can

108
00:06:11,637 --> 00:06:13,270
interact with my object.

109
00:06:16,870 --> 00:06:21,390
It will depend on which
functionalities

110
00:06:22,000 --> 00:06:26,560
it offers. I can do

111
00:06:26,727 --> 00:06:29,090
selectedColor. We will see if
it works.

112
00:06:29,890 --> 00:06:30,590
If I do self selectedColor.

113
00:06:30,757 --> 00:06:35,590
It returns a color.

114
00:06:36,000 --> 00:06:39,000
Here it is interesting because

115
00:06:39,700 --> 00:06:42,360
with the inspector I can
do a print,

116
00:06:42,527 --> 00:06:44,260
and it returns a textual
representation of the object.

117
00:06:44,940 --> 00:06:49,080
I could do inspect on it

118
00:06:49,740 --> 00:06:51,760
and it will open an inspector.

119
00:06:51,927 --> 00:06:52,690
It is what I’m doing here.

120
00:06:52,857 --> 00:06:55,000
Now if I want the result of this

121
00:06:55,167 --> 00:07:00,080
expression to be injected
in the inspector flow,

122
00:07:00,247 --> 00:07:01,000
what can I do?

123
00:07:01,137 --> 00:07:03,190
I just have to do “Do it and go”.

124
00:07:03,610 --> 00:07:08,360
If I do “Do it and go”, I
have added in the interaction flow

125
00:07:08,790 --> 00:07:11,010
a new object and an inspector
on a new object.

126
00:07:11,530 --> 00:07:15,620
You understood. Here it is the colors
with the colors encoding.

127
00:07:16,580 --> 00:07:17,500
Nothing special.

128
00:07:21,800 --> 00:07:24,250
We go backward.

129
00:07:26,570 --> 00:07:31,110
What is interesting to see,
it is that here, I have

130
00:07:31,277 --> 00:07:33,820
a view of my object,
for instance in sub-morphs.

131
00:07:36,000 --> 00:07:38,500
If I want to have the same view
and if I want to find the

132
00:07:38,667 --> 00:07:42,180
sub-morphs composing
my graphical object,

133
00:07:42,347 --> 00:07:47,030
when I’m in Raw mode, I
have to browse

134
00:07:47,200 --> 00:07:52,050
inside the graphical components
tree.

135
00:07:53,130 --> 00:07:54,280
It can be really annoying.

136
00:07:55,080 --> 00:07:57,760
I will show you a nice tip.

137
00:07:59,190 --> 00:08:03,660
Let’s imagine I have my Morph tree.

138
00:08:05,550 --> 00:08:08,640
I have two views which are exactly
the same on the same object.

139
00:08:11,160 --> 00:08:12,820
I can do “Submorph”.

140
00:08:13,530 --> 00:08:16,540
I do Submorph in this one and
there I have Morph.

141
00:08:16,830 --> 00:08:20,520
Now I can select the elements
in the tree.

142
00:08:22,230 --> 00:08:25,610
I tell it: “I want you to
display there

143
00:08:25,777 --> 00:08:30,590
only this one”, or for instance,
here I am really

144
00:08:30,757 --> 00:08:35,290
on the sub-morph of the tree
corresponding to my selection.

145
00:08:36,360 --> 00:08:38,900
It is very powerful because
often, if I had to

146
00:08:39,100 --> 00:08:43,350
find the sub-morph corresponding

147
00:08:43,517 --> 00:08:48,480
to the little indicator, here
it is quite easy, it is this one.

148
00:08:50,440 --> 00:08:54,850
However, if I am in a traditional mode,

149
00:08:55,017 --> 00:08:58,130
it is not so easy because…

150
00:08:58,297 --> 00:08:59,350
in fact I don’t know how to do it.

151
00:08:59,517 --> 00:09:02,270
I have to go inside

152
00:09:05,440 --> 00:09:06,960
until I find it.

153
00:09:07,470 --> 00:09:12,060
It is here I think,
because here it is

154
00:09:12,227 --> 00:09:12,860
a simple object.

155
00:09:14,500 --> 00:09:16,530
You will see in the other videos
that we can do

156
00:09:16,697 --> 00:09:20,680
this kind of operation
in every object of the system.

157
00:09:21,370 --> 00:09:23,530
I will show you in particular
that we can do it

158
00:09:23,697 --> 00:09:27,850
on files systems, on classes
themselves.

159
00:09:28,160 --> 00:09:30,040
As a conclusion,
what we have seen

160
00:09:30,207 --> 00:09:32,560
is that the inspector is an
object that will enable you

161
00:09:32,727 --> 00:09:37,230
to talk to, interact with and
modify living objects,

162
00:09:37,397 --> 00:09:41,010
your objects, and in another hand,
each object will

163
00:09:41,177 --> 00:09:45,730
show different aspects
or different views of itself

164
00:09:45,897 --> 00:09:48,260
in order to have a different

165
00:09:48,427 --> 00:09:51,640
interaction according to
your scenarios.

166
00:09:51,807 --> 00:09:53,760
It constitutes a very,
very powerful object.

167
00:09:54,190 --> 00:09:56,290
In fact, GT Inspector is really
a great tool.