1
00:00:04,600 --> 00:00:05,430
All right, so we're going

2
00:00:05,430 --> 00:00:07,030
to move on now and combine

3
00:00:07,030 --> 00:00:11,030
what we've learned about databases and classes.

4
00:00:11,030 --> 00:00:12,730
Now, some of the inheritance examples

5
00:00:12,730 --> 00:00:15,320
in the object oriented programming section

6
00:00:15,320 --> 00:00:17,060
were quite theoretical.

7
00:00:17,060 --> 00:00:18,250
So we're going to have a look

8
00:00:18,250 --> 00:00:20,820
at how subclassing an existing class

9
00:00:20,820 --> 00:00:23,830
can be a great way to add extra functionality.

10
00:00:23,830 --> 00:00:25,830
One good thing about this is that,

11
00:00:25,830 --> 00:00:28,260
you don't have to have any idea on how the class

12
00:00:28,260 --> 00:00:31,450
that you're subclassing actually works.

13
00:00:31,450 --> 00:00:33,090
You have to know what it does, of course,

14
00:00:33,090 --> 00:00:37,270
and also how to use it, but that's about all you do need.

15
00:00:37,270 --> 00:00:39,000
We're going to use our music database

16
00:00:39,000 --> 00:00:41,500
to produce a visual database browser.

17
00:00:41,500 --> 00:00:43,270
Now the app will be quite simple.

18
00:00:43,270 --> 00:00:45,520
We're going to display a list of artists

19
00:00:45,520 --> 00:00:47,710
from the database in a list.

20
00:00:47,710 --> 00:00:49,840
And when you select one of the artists,

21
00:00:49,840 --> 00:00:52,250
another list will show all their albums.

22
00:00:52,250 --> 00:00:54,800
When you click on an album, you'll get to see

23
00:00:54,800 --> 00:00:58,070
all the songs on that album in a third list.

24
00:00:58,070 --> 00:00:59,940
All right, so let's get started.

25
00:00:59,940 --> 00:01:02,840
We need a copy of the music.db database file

26
00:01:02,840 --> 00:01:05,730
that we've used earlier in this course.

27
00:01:05,730 --> 00:01:08,660
And you can see I've just downloaded a copy onto my desktop

28
00:01:08,660 --> 00:01:10,140
which I'm going to be using shortly.

29
00:01:10,140 --> 00:01:12,350
You can also grab that from an earlier lecture

30
00:01:12,350 --> 00:01:15,000
or from the resources section of this video.

31
00:01:15,000 --> 00:01:19,160
I'm going to create a new path and project.

32
00:01:19,160 --> 00:01:22,750
We're going to call this one Music Browser.

33
00:01:29,020 --> 00:01:31,550
Copy that music.db into this folder.

34
00:01:31,550 --> 00:01:34,830
The easiest way is to just right-click the package name

35
00:01:34,830 --> 00:01:37,090
and go down to Reveal In Finder.

36
00:01:37,090 --> 00:01:39,390
It will be opened in explorer on Windows and Linux,

37
00:01:39,390 --> 00:01:41,010
I believe, or words to that effect.

38
00:01:41,010 --> 00:01:43,210
If you click on that that opens the folder.

39
00:01:43,210 --> 00:01:44,980
I'm going to go into that folder

40
00:01:44,980 --> 00:01:48,930
and then I'm just going to go back to my desktop.

41
00:01:48,930 --> 00:01:52,530
Then I'm going to take a copy of that music.db file

42
00:01:52,530 --> 00:01:53,750
and paste it in there.

43
00:01:53,750 --> 00:01:55,260
Whatever you need to do, to do the similar thing,

44
00:01:55,260 --> 00:01:58,130
paste that file in there so we've got access

45
00:01:58,130 --> 00:02:00,030
back in it in the IntelliJ.

46
00:02:00,030 --> 00:02:02,820
You can see for me it's now popped up in the list there.

47
00:02:02,820 --> 00:02:05,030
All right, let's create a new file,

48
00:02:05,030 --> 00:02:06,130
a new path and file.

49
00:02:06,130 --> 00:02:08,720
We're going to call it jukebox.

50
00:02:14,090 --> 00:02:16,630
Okay, let's make a bit more space there.

51
00:02:16,630 --> 00:02:17,860
I've created that file.

52
00:02:17,860 --> 00:02:21,860
We're going to start now with a small challenge.

53
00:02:27,100 --> 00:02:29,600
The challenge is to use the database tab

54
00:02:29,600 --> 00:02:32,130
to configure the data source correctly,

55
00:02:32,130 --> 00:02:34,640
so that we don't get those warning messages from IntelliJ

56
00:02:34,640 --> 00:02:37,860
that we've seen previously when working with databases.

57
00:02:37,860 --> 00:02:41,290
And this also has the added benefit of helping IntelliJ

58
00:02:41,290 --> 00:02:44,050
to check things like our column names.

59
00:02:44,050 --> 00:02:44,960
That's the challenge.

60
00:02:44,960 --> 00:02:45,820
Pause the video.

61
00:02:45,820 --> 00:02:49,990
Let's see how you go, and I'll see you when you get back.

62
00:02:51,400 --> 00:02:52,500
Okay. So how did you get on?

63
00:02:52,500 --> 00:02:54,330
Hopefully you managed to figure that out.

64
00:02:54,330 --> 00:02:56,260
If you do remember from when we configured

65
00:02:56,260 --> 00:02:59,160
the accounts database in the previous project.

66
00:02:59,160 --> 00:03:02,900
Dragging a database file onto the database tab only works

67
00:03:02,900 --> 00:03:06,230
if the file has got a .sqlite extension.

68
00:03:06,230 --> 00:03:07,930
Now having said that, the latest version

69
00:03:07,930 --> 00:03:11,340
of IntelliJ Idea on a Mac, I was actually happy

70
00:03:11,340 --> 00:03:14,810
to create a data source by dragging the file music.db

71
00:03:14,810 --> 00:03:16,500
onto the database pane.

72
00:03:16,500 --> 00:03:19,900
This maybe will change on other operating systems as well.

73
00:03:19,900 --> 00:03:22,100
But in any event, the first step is to right-click

74
00:03:22,100 --> 00:03:24,310
on the music.db file.

75
00:03:24,310 --> 00:03:27,220
We're going to refactor and rename,

76
00:03:28,080 --> 00:03:32,250
and we're going to change the extension to sqlite.

77
00:03:34,240 --> 00:03:37,090
All right, so now I've actually done that here,

78
00:03:37,090 --> 00:03:39,160
but you may not actually want to rename your file

79
00:03:39,160 --> 00:03:40,540
for whatever reason.

80
00:03:40,540 --> 00:03:41,830
Perhaps other programmes are using

81
00:03:41,830 --> 00:03:44,370
the same database file for example.

82
00:03:44,370 --> 00:03:46,210
Although, I've renamed it here,

83
00:03:46,210 --> 00:03:49,040
I'm actually going to configure the data source manually

84
00:03:49,040 --> 00:03:50,750
instead of dragging the file.

85
00:03:50,750 --> 00:03:52,600
And that's because dragging and dropping the file

86
00:03:52,600 --> 00:03:53,880
onto a database tab-

87
00:03:53,880 --> 00:03:57,450
This is the one over here I'm talking about.

88
00:03:57,450 --> 00:03:58,970
Well, that's really only a convenience

89
00:03:58,970 --> 00:04:00,480
but it's not essential.

90
00:04:00,480 --> 00:04:02,610
Now, configuring the data source manually

91
00:04:02,610 --> 00:04:06,080
let's you use a sqlite database with any file extension.

92
00:04:06,080 --> 00:04:08,100
If you happen to have renamed the database file

93
00:04:08,100 --> 00:04:09,820
and dragged into the database pane

94
00:04:09,820 --> 00:04:12,510
to configure the data source as we've done previously,

95
00:04:12,510 --> 00:04:15,800
then well done, that's a challenge completed successfully.

96
00:04:15,800 --> 00:04:18,540
I want to show you something that can go wrong.

97
00:04:18,540 --> 00:04:20,730
Before configuring the database

98
00:04:20,730 --> 00:04:24,890
I'm going to just paste some code into our jukebox.py file.

99
00:04:28,040 --> 00:04:30,770
There's the code there.

100
00:04:30,770 --> 00:04:33,580
Actually we'd expect, and I'll just close the database pane.

101
00:04:33,580 --> 00:04:35,110
We're getting those warnings

102
00:04:35,110 --> 00:04:37,500
about no data sources are being configured

103
00:04:37,500 --> 00:04:39,190
and also a couple of other warnings here about

104
00:04:39,190 --> 00:04:40,870
unable to resolve symbol albums,

105
00:04:40,870 --> 00:04:43,500
and unable to resolve table albums.

106
00:04:43,500 --> 00:04:45,610
You don't actually have to type this code in

107
00:04:45,610 --> 00:04:47,220
before configuring the data source.

108
00:04:47,220 --> 00:04:48,390
I've just done this so that you can see

109
00:04:48,390 --> 00:04:50,630
that things are working properly.

110
00:04:50,630 --> 00:04:52,840
It can be a very natural mistake that you make

111
00:04:52,840 --> 00:04:55,450
that will cause this particular error.

112
00:04:55,450 --> 00:04:57,860
We're going to go and configure this manually.

113
00:04:57,860 --> 00:05:00,020
I'm going to open the database tab again

114
00:05:00,020 --> 00:05:02,110
and click on plus.

115
00:05:02,110 --> 00:05:03,900
I'm going to choose data source,

116
00:05:03,900 --> 00:05:06,630
and then I'm going to choose sqlite xerial,

117
00:05:06,630 --> 00:05:08,210
this one down here.

118
00:05:09,070 --> 00:05:13,490
Next, you can actually come over here and use the ellipses

119
00:05:13,490 --> 00:05:17,520
next to the file, over here to the right or the file label,

120
00:05:17,520 --> 00:05:20,760
and that's one way to navigate to the actual folder.

121
00:05:20,760 --> 00:05:21,600
But you might be looking at that thinking,

122
00:05:21,600 --> 00:05:24,130
"Well, isn't this just quicker than just type in the name?"

123
00:05:24,130 --> 00:05:26,850
Because you know the name is music.sqlite.

124
00:05:26,850 --> 00:05:30,060
You could come over here and just type in music.

125
00:05:30,060 --> 00:05:32,330
With the theory being that music.sqlite,

126
00:05:32,330 --> 00:05:35,120
we can see it's over here in our project folder,

127
00:05:35,120 --> 00:05:37,890
so we don't need to worry about a path.

128
00:05:37,890 --> 00:05:39,330
I've changed the name as you can see there

129
00:05:39,330 --> 00:05:40,900
now to music.sqlite.

130
00:05:40,900 --> 00:05:41,980
You change it to whatever the name

131
00:05:41,980 --> 00:05:44,800
of the database file is on your system.

132
00:05:44,800 --> 00:05:47,950
That does work in that the test connexion button,

133
00:05:47,950 --> 00:05:51,290
which I'm going to press now, it does actually work.

134
00:05:51,290 --> 00:05:53,280
It says successful.

135
00:05:53,280 --> 00:05:55,780
But on Windows it doesn't report an error.

136
00:05:55,780 --> 00:05:59,120
With that said, if we click on okay now.

137
00:06:00,360 --> 00:06:02,280
Notice that, I'm not sure whether you were paying attention,

138
00:06:02,280 --> 00:06:03,930
but there's this little arrow, it was appearing

139
00:06:03,930 --> 00:06:06,650
to the left of the database name.

140
00:06:06,650 --> 00:06:08,820
The one that we normally click to get into the database

141
00:06:08,820 --> 00:06:12,370
to have a look at the tables and columns, etc,

142
00:06:12,370 --> 00:06:14,310
but then that disappeared.

143
00:06:14,310 --> 00:06:16,460
We can't browse the database now.

144
00:06:16,460 --> 00:06:18,880
The other thing is we go back to the code.

145
00:06:18,880 --> 00:06:22,710
We're still getting some weird warnings there.

146
00:06:24,300 --> 00:06:25,190
We're still getting a problem

147
00:06:25,190 --> 00:06:26,780
with resolving the symbol albums

148
00:06:26,780 --> 00:06:29,130
and resolving the table albums.

149
00:06:29,130 --> 00:06:32,100
In other words, IntelliJ is not recognising those.

150
00:06:32,100 --> 00:06:34,010
The thing is, it's not going to recognise those

151
00:06:34,010 --> 00:06:38,350
until you provide the full path to the file.

152
00:06:38,350 --> 00:06:40,810
That might make sense to just type in the name

153
00:06:40,810 --> 00:06:43,020
without a path that I actually did there,

154
00:06:43,020 --> 00:06:43,940
for the moment at least,

155
00:06:43,940 --> 00:06:45,820
or at least for this version of IntelliJ

156
00:06:45,820 --> 00:06:47,640
it doesn't actually work like that.

157
00:06:47,640 --> 00:06:49,350
But fortunately we can fix that.

158
00:06:49,350 --> 00:06:51,570
We can just go back to the data source properties.

159
00:06:51,570 --> 00:06:54,980
We can right-click and choose properties.

160
00:06:56,310 --> 00:06:58,880
I'm right-clicking the database file obviously.

161
00:06:58,880 --> 00:06:59,880
Alternatively I could have used

162
00:06:59,880 --> 00:07:02,090
the little wrench button there to get into the properties

163
00:07:02,090 --> 00:07:06,250
at the top of the toolbar there, just above the file name.

164
00:07:08,120 --> 00:07:11,310
If I change that now and actually click on the ellipses.

165
00:07:11,310 --> 00:07:14,900
This time if I now go to that folder again.

166
00:07:18,550 --> 00:07:21,720
I'll select my database, if I'll open,

167
00:07:22,790 --> 00:07:24,640
with a full path this time.

168
00:07:24,640 --> 00:07:25,830
Test connexion.

169
00:07:25,830 --> 00:07:26,680
Well, that still works.

170
00:07:26,680 --> 00:07:28,860
If I click on okay this time.

171
00:07:28,860 --> 00:07:29,920
You can see it having done,

172
00:07:29,920 --> 00:07:31,800
we firstly have got this little green arrow here.

173
00:07:31,800 --> 00:07:34,600
The arrows have disappeared from our path and code,

174
00:07:34,600 --> 00:07:36,380
but also we've got the little arrow now.

175
00:07:36,380 --> 00:07:38,560
We can click, we can open up tables and open up

176
00:07:38,560 --> 00:07:40,860
and get access to the columns.

177
00:07:40,860 --> 00:07:44,580
In any event, that's how to configure a data source manually

178
00:07:44,580 --> 00:07:46,080
instead of drag and drop.

179
00:07:46,080 --> 00:07:48,070
Along the way I also showed you a little problem

180
00:07:48,070 --> 00:07:51,050
that can pop up if you don't actually use the ellipses

181
00:07:51,050 --> 00:07:53,720
to select the database file with a full path.

182
00:07:53,720 --> 00:07:55,410
Make sure you do do that

183
00:07:55,410 --> 00:07:57,950
until IntelliJ hopefully can handle this problem

184
00:07:57,950 --> 00:07:59,620
and actually fix it.

185
00:07:59,620 --> 00:08:01,080
Incidentally, what we just did there

186
00:08:01,080 --> 00:08:03,130
with the manual configuration.

187
00:08:03,130 --> 00:08:04,280
Well, that's what you'd need to do

188
00:08:04,280 --> 00:08:06,900
if you were connecting to a client server database

189
00:08:06,900 --> 00:08:09,740
such as sql server or perhaps DB2.

190
00:08:10,790 --> 00:08:12,310
Just close the database tab,

191
00:08:12,310 --> 00:08:14,680
now that we've got our database centre find.

192
00:08:14,680 --> 00:08:17,890
I'm going to delete the code that I initially added,

193
00:08:17,890 --> 00:08:20,520
and we're going to start coding.

194
00:08:20,520 --> 00:08:22,820
We need to import sqlite, obviously,

195
00:08:22,820 --> 00:08:25,280
but also we need to import tkinter.

196
00:08:25,280 --> 00:08:27,880
And we're going to do that in the python2 friendly way

197
00:08:27,880 --> 00:08:29,200
and that's because this app is almost not going

198
00:08:29,200 --> 00:08:33,230
to be able to work with python2.7 and up.

199
00:08:33,230 --> 00:08:37,049
I'm going to start with the import to sqlite3.

200
00:08:37,049 --> 00:08:41,210
I'm going to need to add a try, colon, import tkinter.

201
00:08:42,289 --> 00:08:44,179
You've seen this code before.

202
00:08:44,179 --> 00:08:47,350
We need to add an except import error,

203
00:08:49,580 --> 00:08:51,830
colon, and that's python 2.

204
00:08:53,430 --> 00:08:57,600
In that case we're going to do import Tkinter as tkinter.

205
00:09:02,210 --> 00:09:04,180
Then we just can start with our connexion,

206
00:09:04,180 --> 00:09:06,510
conn equals sqlite3.connect.

207
00:09:08,040 --> 00:09:12,530
And of course the file name should be music.sqlite.

208
00:09:12,530 --> 00:09:15,070
If by chance you haven't renamed it and it's still db,

209
00:09:15,070 --> 00:09:18,210
obviously you need to change it to that name.

210
00:09:18,210 --> 00:09:20,350
All right, so next we're going to set up a window.

211
00:09:20,350 --> 00:09:22,390
It's a good idea to start with an idea

212
00:09:22,390 --> 00:09:24,680
of what it should look like.

213
00:09:24,680 --> 00:09:26,880
We're going to be creating a simple layout

214
00:09:26,880 --> 00:09:30,560
that I'm going to show you on the slide.

215
00:09:30,560 --> 00:09:32,990
That's what we're going to try and create here.

216
00:09:32,990 --> 00:09:34,540
You can see that it's pretty basic,

217
00:09:34,540 --> 00:09:37,540
but it demonstrates some very useful techniques

218
00:09:37,540 --> 00:09:40,690
for subclassing an existing class.

219
00:09:40,690 --> 00:09:43,570
We want to put a scroll-bar next to each list box,

220
00:09:43,570 --> 00:09:44,410
but we're going to put them

221
00:09:44,410 --> 00:09:46,700
in the same column as their listbox.

222
00:09:46,700 --> 00:09:50,450
In essence we're going to need three columns.

223
00:09:52,410 --> 00:09:55,990
The space between the lists will be set using padding,

224
00:09:55,990 --> 00:09:58,110
but there's something I want to demonstrate

225
00:09:58,110 --> 00:10:00,770
when we come to subclass the listboxes.

226
00:10:00,770 --> 00:10:03,700
We're going to set the padding on the left of each list,

227
00:10:03,700 --> 00:10:05,990
but for the far right of the display,

228
00:10:05,990 --> 00:10:07,820
I'm going to use another column

229
00:10:07,820 --> 00:10:10,960
to keep the songs list away from the edge of the window.

230
00:10:10,960 --> 00:10:12,160
You don't have to do that,

231
00:10:12,160 --> 00:10:16,320
I'm only doing it to make explaining something else easier.

232
00:10:18,620 --> 00:10:22,350
We also want a title, as you can see, above each box,

233
00:10:22,350 --> 00:10:24,680
so there'll be at least two rows.

234
00:10:24,680 --> 00:10:26,620
Because there's going to be far more artists

235
00:10:26,620 --> 00:10:28,240
than albums or songs,

236
00:10:28,240 --> 00:10:32,410
we're going to span the artists listbox over two rows.

237
00:10:35,020 --> 00:10:38,430
We're also going to leave a blank row along the bottom,

238
00:10:38,430 --> 00:10:39,640
and that's to keep everything away

239
00:10:39,640 --> 00:10:41,220
from the edge of the window.

240
00:10:41,220 --> 00:10:43,230
That's four rows in total.

241
00:10:43,230 --> 00:10:45,130
Now that we've decided all of that,

242
00:10:45,130 --> 00:10:49,100
we can go back and set up these windows.

243
00:10:49,100 --> 00:10:51,150
We're going to continue on

244
00:10:51,150 --> 00:10:54,610
and we're going to type mainwindow

245
00:10:54,610 --> 00:10:56,110
equals tkinter.Tk,

246
00:10:57,840 --> 00:11:00,340
parenthesis, mainwindow.title,

247
00:11:03,600 --> 00:11:06,080
parenthesis and in single quotes,

248
00:11:06,080 --> 00:11:08,580
Music Db Browser as the title.

249
00:11:10,290 --> 00:11:11,550
Then we want to set the geometry,

250
00:11:11,550 --> 00:11:13,880
so it's mainwindow.geometry.

251
00:11:15,340 --> 00:11:18,610
We're going to go for 1024 by 768,

252
00:11:18,610 --> 00:11:21,300
so we need parenthesis and in single quotes,

253
00:11:21,300 --> 00:11:22,130
1024x768.

254
00:11:26,130 --> 00:11:29,320
Let's go ahead now and configure the columns.

255
00:11:29,320 --> 00:11:31,570
Mainwindow.columnconfigure.

256
00:11:33,850 --> 00:11:37,980
We're going to go with zero, comma, space,

257
00:11:37,980 --> 00:11:39,480
weight equals two.

258
00:11:40,810 --> 00:11:43,390
Mainwindow.columnconfigure one,

259
00:11:45,130 --> 00:11:47,210
comma, weight equals two.

260
00:11:48,620 --> 00:11:52,780
Mainwindow.columnconfigure, parenthesis, two, comma, space,

261
00:11:54,140 --> 00:11:55,640
weight equals two.

262
00:11:56,550 --> 00:11:59,970
And last one, mainwindow.columnconfigure,

263
00:12:02,140 --> 00:12:04,220
three, weight equals one.

264
00:12:07,500 --> 00:12:11,670
Just as a reminder that's the spacer column on right.

265
00:12:14,590 --> 00:12:16,390
We now want to configure our rows.

266
00:12:16,390 --> 00:12:20,330
That's going to be mainwindow.rowconfigure,

267
00:12:20,330 --> 00:12:25,220
parenthesis, zero, comma, space, weight equals one.

268
00:12:25,220 --> 00:12:27,640
Then mainwindow.rowconfigure,

269
00:12:29,640 --> 00:12:31,800
parenthesis, one, comma,

270
00:12:31,800 --> 00:12:33,780
weight equals five.

271
00:12:33,780 --> 00:12:37,860
Mainwindow.rowconfigure, parenthesis, two, comma,

272
00:12:38,810 --> 00:12:41,140
space, weight equals five.

273
00:12:41,140 --> 00:12:45,590
And lastly, mainwindow.rowconfigure, parenthesis,

274
00:12:45,590 --> 00:12:48,840
three, comma, space, weight equals one.

275
00:12:51,020 --> 00:12:52,090
As you can see there,

276
00:12:52,090 --> 00:12:54,440
I've given more weight to the middle two rows

277
00:12:54,440 --> 00:12:57,180
and that's because they contain the listboxes.

278
00:12:57,180 --> 00:12:58,660
If you're not too sure what I'm doing here,

279
00:12:58,660 --> 00:13:01,340
do go back and check the tkinter videos

280
00:13:01,340 --> 00:13:03,010
in section 11 of the course,

281
00:13:03,010 --> 00:13:06,070
because I go into detail about what all this stuff means.

282
00:13:06,070 --> 00:13:07,540
I'm assuming at this stage of the course

283
00:13:07,540 --> 00:13:09,780
you've actually been through that.

284
00:13:09,780 --> 00:13:12,960
Next we need our labels and listboxes.

285
00:13:12,960 --> 00:13:14,000
We're going to create them

286
00:13:14,000 --> 00:13:16,560
after setting up the columns and rows.

287
00:13:16,560 --> 00:13:19,050
We're going to start with, and put a comment here

288
00:13:19,050 --> 00:13:21,330
just to indicate what we're doing.

289
00:13:21,330 --> 00:13:23,920
This is going to be the labels.

290
00:13:25,450 --> 00:13:29,830
We'll start with tkinter, that's going to be .label,

291
00:13:29,830 --> 00:13:32,990
parenthesis, mainwindow, comma, space,

292
00:13:34,320 --> 00:13:38,040
text equals, then artist in double quotes,

293
00:13:38,040 --> 00:13:42,200
right parenthesis then .grid, parenthesis, row equal zero,

294
00:13:43,260 --> 00:13:47,430
comma, space, column equal zero, right parenthesis.

295
00:13:48,900 --> 00:13:51,300
Let's just copy that line task,

296
00:13:51,300 --> 00:13:53,160
because we need two more labels.

297
00:13:53,160 --> 00:13:55,960
The first one is going to be,

298
00:13:55,960 --> 00:13:57,340
everything the same up until text.

299
00:13:57,340 --> 00:14:00,120
We're going to change the text to albums.

300
00:14:00,120 --> 00:14:02,150
Then the grid row reference, everything is the same,

301
00:14:02,150 --> 00:14:04,990
column is one, and for the third one

302
00:14:04,990 --> 00:14:06,460
that's going to be the third label,

303
00:14:06,460 --> 00:14:07,840
it's going to be songs.

304
00:14:07,840 --> 00:14:12,010
That's still on row zero, and the text is going to be songs.

305
00:14:14,370 --> 00:14:16,530
Okay, I love that.

306
00:14:16,530 --> 00:14:20,200
We've done that okay, and let's continue on.

307
00:14:21,540 --> 00:14:25,460
We're now going to work on the artists listbox.

308
00:14:27,900 --> 00:14:31,380
We're going to start with artistList

309
00:14:31,380 --> 00:14:33,460
equal to tkinter.listbox,

310
00:14:35,830 --> 00:14:37,830
parenthesis, mainwindow.

311
00:14:39,560 --> 00:14:41,980
Then we want artistList.grid,

312
00:14:43,970 --> 00:14:46,430
parenthesis, row equals one,

313
00:14:46,430 --> 00:14:49,590
comma, space, column equal zero, comma,

314
00:14:49,590 --> 00:14:52,750
space, sticky equals, in single quotes

315
00:14:53,590 --> 00:14:56,840
nsew, comma, space, rowspan equals two,

316
00:14:58,540 --> 00:15:02,630
comma, space and then padx equals parenthesis, 30,

317
00:15:02,630 --> 00:15:04,330
comma, space, zero.

318
00:15:04,330 --> 00:15:07,760
And then two right parenthesis to finish off the line.

319
00:15:07,760 --> 00:15:09,810
Then we need to also add a config.

320
00:15:09,810 --> 00:15:11,560
So artistList.config,

321
00:15:13,850 --> 00:15:16,560
parenthesis, and it's going to be border equals two,

322
00:15:16,560 --> 00:15:18,230
comma, space, relief

323
00:15:20,310 --> 00:15:23,960
is equal to, single quotes, sunken

324
00:15:23,960 --> 00:15:26,600
and then we just end parenthesis.

325
00:15:26,600 --> 00:15:29,570
That's our artist listbox, then we want to do

326
00:15:29,570 --> 00:15:32,330
the same for albums listbox and songs listbox,

327
00:15:32,330 --> 00:15:34,830
so let's go ahead and do that.

328
00:15:35,830 --> 00:15:38,410
This is going to be the albums.

329
00:15:40,260 --> 00:15:42,680
I'm going to start by albumLV

330
00:15:44,090 --> 00:15:46,090
equals tkinter.Variable,

331
00:15:48,520 --> 00:15:50,520
parenthesis, mainwindow.

332
00:15:52,250 --> 00:15:53,580
And albumLV.set,

333
00:15:55,400 --> 00:15:57,050
two left parenthesis there,

334
00:15:57,050 --> 00:15:59,270
then we want the text in double quotes,

335
00:15:59,270 --> 00:16:00,690
choose an artist,

336
00:16:02,240 --> 00:16:05,300
and a comma after the trailing double quote

337
00:16:05,300 --> 00:16:07,790
and then the two ending parenthesis.

338
00:16:07,790 --> 00:16:09,630
Then we want albumList

339
00:16:11,010 --> 00:16:14,030
is equal to tkinter.Listbox

340
00:16:14,030 --> 00:16:17,780
again, parenthesis, mainwindow, comma, space,

341
00:16:18,790 --> 00:16:21,380
listvariable, all in lowercase,

342
00:16:22,360 --> 00:16:26,440
equals albumLV that we defined on line 34 and 35.

343
00:16:29,050 --> 00:16:30,580
Then we want to set the grid,

344
00:16:30,580 --> 00:16:34,490
so it's going to be albumList.grid, parenthesis

345
00:16:36,120 --> 00:16:38,030
and we're going to start with row equals one, comma,

346
00:16:38,030 --> 00:16:41,250
space, column equals one, comma, space

347
00:16:41,250 --> 00:16:44,590
then sticky equals, single quotes, nsew,

348
00:16:47,080 --> 00:16:49,820
comma, space then padx equals,

349
00:16:49,820 --> 00:16:52,570
in parenthesis, 30, comma, space, zero

350
00:16:52,570 --> 00:16:55,590
then the two right parenthesis to end the line.

351
00:16:55,590 --> 00:16:57,340
Then we need a config as well,

352
00:16:57,340 --> 00:17:00,340
that's going to be albumList.config,

353
00:17:02,380 --> 00:17:06,210
border equals two in parenthesis, and relief equal sunken

354
00:17:06,210 --> 00:17:09,859
and sunken has single quotes around it.

355
00:17:09,859 --> 00:17:10,690
Sunken.

356
00:17:12,510 --> 00:17:13,980
All right.

357
00:17:13,980 --> 00:17:15,119
I'm making more space here,

358
00:17:15,119 --> 00:17:18,290
and let's finish off the songs listbox

359
00:17:19,250 --> 00:17:21,250
before we end the video.

360
00:17:25,980 --> 00:17:28,349
We're going to start there with our variable again,

361
00:17:28,349 --> 00:17:30,050
so songLV is equal

362
00:17:30,050 --> 00:17:31,630
to tkinter.Variable

363
00:17:33,780 --> 00:17:36,870
and it's going to be mainwindow.

364
00:17:36,870 --> 00:17:40,850
And songLV.set and then two left parenthesis

365
00:17:40,850 --> 00:17:43,600
in double quote, choose an album,

366
00:17:44,810 --> 00:17:47,320
and the double quote to finish off the line

367
00:17:47,320 --> 00:17:50,670
and then a comma, two right parenthesis.

368
00:17:50,670 --> 00:17:53,260
songList equals tkinter.listbox

369
00:17:56,150 --> 00:18:00,120
and it's going to be mainwindow in parenthesis, comma,

370
00:18:00,120 --> 00:18:04,290
then listvariable, all in lowercase, equals songLV.

371
00:18:06,890 --> 00:18:09,560
Then songList.grid, parenthesis,

372
00:18:11,180 --> 00:18:13,170
row equals one, comma, space,

373
00:18:13,170 --> 00:18:15,730
column equals two this time,

374
00:18:15,730 --> 00:18:18,850
space after the comma, and sticky equals,

375
00:18:18,850 --> 00:18:21,700
single quotes, nsew again.

376
00:18:21,700 --> 00:18:23,880
Single quotes around the text there,

377
00:18:23,880 --> 00:18:27,230
comma, space, padx equals and in parenthesis 30,

378
00:18:27,230 --> 00:18:31,470
comma, space, zero, then the two closing right parenthesis.

379
00:18:31,470 --> 00:18:33,120
Then we just need the config,

380
00:18:33,120 --> 00:18:34,700
so songList.config,

381
00:18:36,800 --> 00:18:38,870
border equals two, comma, space

382
00:18:38,870 --> 00:18:42,330
then relief equals, two single quotes,

383
00:18:42,330 --> 00:18:44,840
and it's going to be sunken within that.

384
00:18:44,840 --> 00:18:47,600
Then right parenthesis to close the line over.

385
00:18:47,600 --> 00:18:50,520
That's the user interface elements created,

386
00:18:50,520 --> 00:18:52,030
so we should be able to start a main loop

387
00:18:52,030 --> 00:18:53,630
and see how it works.

388
00:18:53,630 --> 00:18:55,610
Let's quickly do that before we end the video.

389
00:18:55,610 --> 00:18:58,700
I'm just going to put a code in here.

390
00:19:04,090 --> 00:19:04,930
Main loop.

391
00:19:06,420 --> 00:19:07,850
And the code is going to be pretty simple,

392
00:19:07,850 --> 00:19:10,930
it's going to be mainwindow.mainloop.

393
00:19:13,400 --> 00:19:18,220
We're going to print, closing database connexion.

394
00:19:18,220 --> 00:19:22,060
Of course we open that right up on line seven,

395
00:19:24,010 --> 00:19:25,870
I think I see up there.

396
00:19:25,870 --> 00:19:30,600
Then we need to actually close this, so conn.close.

397
00:19:30,600 --> 00:19:32,270
Let's just run that,

398
00:19:35,010 --> 00:19:36,820
and have a bit of look here.

399
00:19:36,820 --> 00:19:38,860
That's close to what we originally said we wanted,

400
00:19:38,860 --> 00:19:41,060
but we're missing scroll bars though.

401
00:19:41,060 --> 00:19:44,890
Let's start looking at that in the next video.