Python User Interface Project – Use PyQt5 to Code a Music Player

Key Takeaways

learn how to use the pi qt5 framework to create a modern music player Pi qt5 makes it easy to create guey applications with python in this course Thomas Burns will teach you how to create a music player that features a beautiful and modern user interface playlist and favorite songs functionality custom context menus for different pages and a background slideshow for every song so let's start learning hello everyone my name is Thomas and in this video you and I are going to build the most advanced and modern python music player you can currently find on YouTube Let us look at what you're going to build because it looks like I'm bragging about it so much this is what we are going to build you can see that is the interface is fully customized and it doesn't have the default title bar it's a custom title bar this is where the song that is currently playing will have the name displayed and then the path to that particular song you can add song to to your favorit or a particular playlist that you have created this is the volume control which I will like to bring down to about 20 now and these are playback controls the you can see the beautiful hover effects that each of them gives on their H and this one uh is the loop one song and then this is the random play or the shuffle this is our music slider and then this is the default song list page that is when we Lo load songs this is where they will come and then this button will help us to add songs this one helps us to delete and then this one helps us to delete all but if you look down here you can see that there are some three boms here what they do is to navigate between several pages in the application so if I click on playlist now you see that the playlist page opens and then you have some playlist here that I created you can actually create your own or remove selected or remove all I think at this point I we have to remove all playlist and then we create some from scratch if I come to favorite 2 I have some songs in favorit that I can actually click and play so if I click on this one and then hit play so the song is playing and then the slider is also moving accordingly let me stop it and oh not zero so let's come to the playlist side and then let's see if you want to create a new playlist let me just say new one and then I can right click on it and then uh see load selected but it doesn't have any song so but if I double click on it sorry this one went to the second screen if I double click on the playlist it pops up uh small window pops up which should show me all the songs in the playlist you see that currently there was no song in the playlist but if I come to song list and let's load some song songs let me load this my songs here and then I can choose to play it it will work as you have seen and if you also noticed I when I click to play a new song the background picture Chang so this application has background slide show for every song that you play and that is a very very cool feature that you are going to build so if I press on the next check it see that the background picture will change to a new picture I press next next next next and automatically knows how to go to the first song when it reaches the end of the list and that is also another very cool feature but if I want to add this particular song to playlist that is playing this one is that is highlighted I just click on add to playlist currently there's only one playlist that I have new one so I click on it and then okay it looks like nothing has happened but let me just pause this song and then come here the playlist when I double click I don't know why this one always comes to the second screen when I double click you see that that song Raising Me Higher that I added has been uh is showing here so we know that that song is in that particular playlist and if I also decide to add the song that is playing to favorite currently it is not playing let me play it again see that it's Raising Me Higher that it's playing it's not part of our favorites if I click on out to favorites I see it here in real time so this is what we are going to build if you are excited about it just hit the like button and then share it to your friends who who might be [Music] interested okay so let us get coding before we start I want you to visit this GitHub repository which the link will be in the description below you will see that there are two branches the starter and then the main the main will have the complete application this starter has the files that we need to get started be sure that you're on the starter branch and then clone the repository into any editor of your choice I'll be using py Chon for this tutorial as you saw so so any editor of your choice and then let's get started so when you clone it this is what you see the file and folder structure here the ETS folder just contains folder for the background images and the images to that have been used in the app or the say like the icons themselves also and then you see here that there is a maini file and then the music. there's the r and then the re. QRC so this tutorial is targeted for beginners also so if you are beginner to the PT framework is also a right place for you to be and I will explain everything uh as you need to know so let's say so is the directory where my folder uh my project is sorry and if I want to open the terminal here okay so this is a terminal I'll will be using the windows terminal the get Bash one if you don't have this option that says open in terminal probably you have not installed the windows terminal you can go ahead and install it or if you're on Windows you can just click this address bar and type CMD that should open command promt for you in that particular directory and so that should also do but I prefer this terminal so that is what I'll go with the only requirement after having python installed is to have pt5 and then pt5 tools installed so if you do pip list whether you are using a virtual environment or you using your default python if you do pip list you should see that pyqt5 and then pt5 tools are all installed great if you don't have it it's quite simple you can just do pip install and then Pi kt5 please check the casing is very necessary you leave a space and then Pi qt5 D tools you see that I have it so it says requirement already satisfied so let's clear up this thing and let me come back here you see the main. file that is the UR file that we'll be using the reason we install the P qt5 tools is that so that we get access to the QT designer that we can use for the designing of our UI there are two options for even for the UI for you to Cho from and I'll show you and I will tell you the difference very soon but if you are looking to learn more on how to use the QT designer and even PT itself you can check out my channel uh that is Tom code based I have a great tutorials on pyqt5 and other Stacks that you might be interested in especially if you are in today's software development staff okay so the QT designer usually some time ago I used to type designer Des exe or without the exe and I was able to open it straight from my terminal but now it doesn't work I don't really know why what I did some configuration that I forgotten so I will show you how to get access to the QT designer after installing it with the p5- tools you would want to go to where your default python where your python is so if you installed it on your default python like I did I have it on my default python I'm not using a environment then you want to go to where your python is installed on your PC so if I should open a new window here you let me paste this address this is where my python is usually it will be at uh local dxc users and then your your username mine is Tomy and then updata local programs python for the windows people uh if you Mar or Lup I think it should be easier also to locate where your python was installed if you have problems with that you can do a quick Google search and then you get to this place where I am I only have one version of python 3.8 so you just click on that one and then you come to this place where you see um lib and those one let's just click on the lib the one with the capital L there there are two there okay the one even has an S but this one is only Li and then from this place you come to sit packages when you come to sit packages come to qt5 applications and then from here go to QT and then go to the bin folder here you see a couple of files we are not even interested in any of them what we need is the designer. exe this one you double click it and then it will open this interface for you so what you want to do to save yourself from coming through all these stress to open the designer is that you can right click on it on your tax bar you can't see my tax bar the moment but if you right click on it you will have the option to pin it from task bar you see that mine has already been pinned the taskar if I W pin it uh then I can right click on it and pin it to the taskbar again so so that to be on the task bar anytime I need it I can close it uh now and anytime I need it I can just open it from my txk bar I think I didn't pin it back so let me open it from here okay pin and then let me make sure that it's pinned okay so if I close it now I will not open it from this folder let me close it and then open open it from my taxk bar so that I will not go through so much stress again so after that you have this opened in your task bar what we want to do is to open the UI file and then do the inspection so here you go to open because you actually want to open a file I'll paste in the address to where the file is that is where my project is so that is the address to where this uh folder is that is what I've opened so let's first inspect the the main and then this is it uh in QT designer if you are new to this um this shouldn't be so difficult to graas it's just that the widgets are here what when we say widgets in pi qt5 or QT is just the other the things that you see used to build your app so the buttons the slider and everything that you see on this screen is a widget the test and all and this is where our object inspector is we can look at all the widget we have added the names and uh the classes of each of them and the property editor is where we edit the properties of any particular so if I pick the song list withget is I can addit the properties of that and then uh we have the resource browser that contains the if we have any resource file yes we do have one for this project and that is what is also the KC this one re. QRC and I really encourage you if you are pqt use pqt just I encourage you to use the resource file instead of just the raw path to the images or the icons that you use because it comes with so many advantages one of it is that if you are even on a different operating system it to be easier to run the application without any errors and then if you are also packaging it you don't actually even need to add the images to it you can do away with the images and then once you convert it to the uh resource file to a python file you have to if you can even delete all the images if you want to and then you app will still be running okay so the resource file was just if you don't know how to create it you can just click on this pencil and then it will bring up the resource file it automatically picked it from the directory where it is just I just added the images that are in this images folder here uh let me cancel this operation so I just added them so that we can reference them in our application there is also some actions that I wrote Because we will along the line if you saw the demo I right clicked on uh something in the playlist and the popup came so the context menu as it is called we using actions to create them so these are the actions that are in the application the action to play pause and all the other default stuff that music players do there is also the signal and Slot editor where I've created a few signals so if you see this one it says the volume down this is the volume down I have made it such that if it is moved then I want to change the volume label to the particular number that the uh so if this is moved this is a label on top you can see I click it you see that the bounding box has come and then it's different from the dial itself I just put it on top of it so what I'm saying here is that if the slider is moved this handle is moved it should get the value that has it has been moved to I set the minimum to zero and then the maximum to 100 as you can see here so if you move it it should get the value that you are currently on and use it to set the number on this label and then this minimize button at the top here too this one uh if I I said that if it is clicked then it will show it should show the app minimized if and the close btn2 if it is clicked it should close the app this ones so that we don't B ourselves writing extra code for them it can easily be done here so so this is the UI it has this title bar uh what we will use for a default title bar because you realize very soon enough that we need a title bar to move the app around and so we remove the default one so we have to create our own and it's called title frame inside of which there is the name m beats my friend called Augustin suggested it and so that the frame pass move our app and then this is the currently playing this is place where our song name will go these labels each of them when you click on them you see that their name is uh their names are here if you go ahead and modify this file because obviously my colors may not be the best and make sure that the names that you if you change the names of the labels and any of the widgets make sure that you keep it in mind because that is what we are going to reference to in uh pip charm when we are writing the code so uh just be careful of that and you see this is where the playback controls are the Hoover effect everything is done with stylesheets if I right click on one of them and go to change stylesheet you see that I can add CSS to this particular widget that is what makes this QT so powerful one of the things let me see that makes CT very powerful you can add CSS styling to any of the widgets you see this colors they all CSS that are used so when it is hover just change this background color there and all that and uh if you are wondering where the rounded corners of the Hoover is coming from you see that this place there's no B radius there but it is inheriting from this parents that is is inside so that is very very cool so it's inheriting from this border radius of the parent and this is the slider has also been customized with some CSS just to look like this because the raw one doesn't look like this at all you see that I have to get the groove and then the handle if I should change any of these colors let me go for the group the alpha is 100 let me make it 255 so that be full when I click on apply so that it changes this color here so I obviously not like it this way so let me cancel out of it and yeah so you can choose to customize it as you want if you go to the next page of this stack widget is this a stack widget then you can see the playlist page and also the favorite page but the page that that you leave this thing on and save the file it is the default page that will render when you convert it to python code so we want to keep you to the song list page this button is the one that open files you see that each of them has uh when you come to the property editor it has it icon linked as a resource file so we just have to save the resource file and then uh we will be good to go the background image also is here and then the over lay is also there there's an overlay if you open in one of the images you see that the color is not really dark like this or at least and it doesn't have any overlay like this on it this overlay is also another picture in the files that just gives our apps an overlay like this it even factors in the title frame also and if I go ahead and preview this you will see that so let me preview infusion style my favorite you see that there's a defa title but this not doesn't look like the one you saw in the demo I cannot maximize this but in case you want to make it responsive that is where you use layouts and Frames uh all of this in pt5 the containers in P5 to make it responsive but because of the fixed size of the background image and the overlay image that has to be on the background image if I try to set a layout for this Central widget which should be the which should make the app responsive then it will just mess up everything so if I just show it now you that everything now is messed up let me just close it and pretend that I didn't do this so I can open r sent and then we have it back so that is why I couldn't make this one responsive and that is the reason there is another file in there called music. py music.i this one looks exactly like this one but doesn't have a background image if the background image goes off then we solve that issue because now I can make the central wiet give it a layout and if I go to form and then preview you see that I can maximize it uh the if I maximize it now you see that it's it's actually full screen so you can do that and maximize it but here you not get the background slid show so if you like it this way I think some of our icons are missing uh you can let's just fix them if you like it this way then you can of course go with it but if not if you want the background slideshow then you have to stick with the old UI let me fix this one so we can so where is the icon I'm not looking for the frame I'm looking for this one okay so choose resource I always goes to the second screen I can choose this one okay and we will use the same thing here also okay so it looks nicer okay so this changes be pushed probably your the stter file will not have it but the finished one will have it so if I go ahead and preview you see that they all there beautifully so depending on which one you want you can choose between the two but anyways you still have a great application so that is it about the C designer if you want more tutorials on that one you can check out my channel I have a great project that make use of KT designer and PT 5 uh so we can build those things from scratch okay let us now design the UI the UI file we use is the main. UI so this new one that you create I will call it probably test or any other name it will not be push to GitHub that is because I will delete it afterwards is this just to show you how to design the UI but this is what we use everything will look exactly like the main. UI just that we use this one and I'll delete that one afterwards as I said the purpose is to show you how to design the UI so let us come back to KT designer and in here let us make sure if you don't have this window come to this uh the new icon here make sure it's on Main window and then click on create the first thing we want to do let me bring this one up is to give our app a name so we click on the main window the Q main window here and come down to this place in the property editor you find window title you see that the currently the window Title Here is main window you find window title which you can call Advanced music player and that should change it for you you see that changes in real time we also have to name our class itself so that's one we come here the object name the object name so you see the objects and then the objects class so the object name should be UI no should be music app sorry music app the UI is added there automatically and you know that you cannot give space in here if you want to give a space it will not really allow you so that becomes the name of the class if you come back to py Cham okay when we convert it you get to know what this one is usually to add UI to it and then and that will be the the name of the class that you call in Python and so we want to also set the size of this but before then let me try and save it so as I said let me call this one or let instead of test let me call it maincore one that is so close and far better and we have all the images in that particular folder but before we move on also and resite let me let us create the resource file come to the resource browser click on this pencil icon and then you click on this button here to create a new resource file which will also call R S1 and then after that you just select this one and you add prefix in case your icons are grouped you maybe you group them into the categories you can use the prefixes to determine that but we will only use one prefix which will be IMG and once you add the prefix now you can come here this button and add files and that is where we want to go into our etails and then images and then select everything that is here and click on open so it will add all of them here for us and then we have to click okay you can see down here that all of them have been added and ready for our use great so the size of our application will be 800 by 550 so before because this one will not be resizable we will make the minimum size and the maximum size to be the same so that the user cannot resize it so that will be 880 sorry 880 rather by 550 we are doing that in light of the size of our background image now it has been Riz for us in fact if we preview it I can go to top here and preview my favorite Style so that I canot resize it but if you change the size now you can actually resize it okay the first thing is for us to add the background image so let us bring in a label so you come to this widget box here usually it becomes difficult to scroll through and find if that happens you can come to the top here and type in whatever you are looking for so if I'm looking for a label I type in label and I bring it in make sure you resize the label to fix the size of the the app like this and you can right click here and then remove status bar we don't need the status bar we also don't need this menu bar so right click at the top and then remove it and now when you select the label like this you can make sure the label is selected you can even see here so here we can now give it a name and the name will be background underscore image that will be the name and we will come down in inside the property edit for that background image and we'll be looking for pix map this pix map is what we used to set the an image inside the label so this one it will not be a resource we choose file for this one and come back by one go into the BG images and then choose any of these which I prefer the first and you will see that you have it in here usually it will not really try and fit in but you can click on skilled content and then you see that once you click on scaled content it will automatically fill in the available space and that is exactly what we are looking for great so now that we have this one we have to bring bring in another label on top of this make sure to resize it you may not really see my transform controls because of the screen but if you are using doing it at your end you see some Blue Notes at the edges that you can use for the res sizing so this one will be the BG overly I can actually also rename it at the top here you can also do it here BG overlay and that one to we give it a PIX map choose file and then the overlay is also part of the stuff here so you can choose that one too and then once again we click on scaled content to have a scale up and so now our background is complete the next thing is to build the widget at this right side that has the the details so that one what we can do is to bringing a frame so we are looking for a frame just like this and then we put it in or we should start building the top first so the okay it will still be a frame just that move it up and let it fill this black section of the BG overlay image because we want to use this part for our title frame okay so let's give it the proper name not just frame but let me do it the proper way not just frame but title frame that is great and inside this title frame we will have a label so let's just search it up label the first label let let just delete the text from it and that one will be the icon we don't really need it at the at the inside py Cham so you can choose to leave the name like this but if you still want to rename it that is completely fine so I'll go ahead and then choose but this time around I'll will come into the images and get this app icon like this so it will give me the app icon also which I can put somewhere here and then the next LEL we need is for the name of the application which we will also not need inside pyam so we can choose not to give it any name here you can just leave it at the default label two and then here I can type my name m p you can choose your name as you like and so we click on it make sure it's selected and then come to this place where you see font let's change the font size to something large think 15 is okay and you can choose to make it bold also and then right click on it and choose change Styles sheet that should bring up the Styles sheet editor this place we can if you want to add a resource you can add resource if you want to even add a gradient you can add a gradient but this place we want to add color if you want to add a color you can pick any of these colors or even pick a screen color and then add it but that is not what I do I already have the color and so I'll paste the color in here the color is this LGB code so when I apply you see that it has changed the color for me okay the next thing to do is to bring up the minimize and then the close buttons which we can those ones will not be labels those ones will be button so push button this one and you bring it in and so you can double click on the button to delete all the test and then you this one we will give it a name of minimize BTN and then we okay I think we can just put uh no this one we give it a px map we will not put the H we give it a p pix map so come to Icon and then you can choose resource for this one because of the background part it is difficult to get that one okay so that's the main.png I was looking for and you can choose to increase the icon size so if we go to say um 24 and then 24 I think that should that should just be okay and we will have it we have it then that way but you could see that on the finished one the background was not there so let us apply sty sheets to move that one so right click and then change style sheet and then in here we will have to type some CSS so we have first to get the class which is Q push button I I can't really maximize the font inside here uh but I just hope that you see it in case you don't you can have you have access to the file you can do the inspection at your end so that will be Q push button and then we can see that the background color we want to like take the background color off so one of the tricks to do that is to just give it an rgba we can choose to make it any color just that the alpha should be zero and you know that that one will not show the color at all so if you choose to make it white which is 255 255 255 and then we we can click on apply you see that it applies it and we can even see the minimum again the the sign but if we add the alpha of zero and click apply again you see that the background is gone because we are not showing the color at all so that is one of the tricks to how I did the background color not showing and then we can also bring up other things like the Hoover effect so I can just copy that one I have up there paste it down here but after the Q push button I just like CSS selector I select the Hoover and then when it is hoovered that one I will not make it zero I will make it like 130 so if I click on apply uh it will not work in here but now when I close the Star sheet and I hover over it you see that the style has been applied let's come back to our sty sheet and so we can also give it some pressed effect so that one to a push button and then if it is pressed the background color should be the same so by the border style but style should be insert and then we also want to make the color black but 100% but I don't think that would really work because this is an image if it was the text that we put there like The Hyphen that would have worked so we can skipe that but doesn't really it's not really needed here but we have to also apply a border radius so can say border radius of 10 pixels and then apply it and then okay so when we H over it we see that particular border radius over there so what we can do now is to copy this one by contrl C for on Mark command C should do and then paste it in please make sure that it is still indented inside the title frame that is very very necessary but this one we will call it not minimize btn2 I think this one the name was even the N was double delete one from it and this place we call it close BTM so for the close BT and let's first change the icon choose resource and that is quit. PNG and that one we now have to just change the Styles sheet and make it red when it is hoovered so once again I have that color which is 255 for the red and then 20 for the green and then for the blue let's make it 12 the alpha this time around should be 200 and that should do and yep that is all that we need the background color I think it should be the same for this side also so we can just copy this value here and then paste it in okay so now you see that you have that vle effect also but we have to now try and bring them to the end as much as we can okay so our title bar is done let us now bring in our frame just position it anywhere at the top left left and this Frame to let's give it the Styles sorry change style sheet for this one we want to give it a background color and of course you can select the color from here so in this case I'll select the color from here but the alpha let's make it 150 and then apply so you see that the background color is there and we can add our border radius of 10 pixels so border radius of 10 pixels apply and that one too is applied so let us add the text inside that one will be a label you know there's a an icon and then currently playing at this side and then there is if I open up the main the main one where is it this one see there's an icon here that is currently playing and then the other one before the other ones come so this label this one is a label this one will also be a label so all these ones will be labels uh just like that so let us bring in a label we will not use it in the in Python so we can just choose to forget about that one uh but if I bring it here you can see that it's inheriting from the parent and it's also getting some background and all those ones so what we will do is that you change the sty sheet specifically for this label and let's see that the color background color even if whatever it for whatever it is we want the alpha to be zero because this one shouldn't have a background and then okay the Border radius we can leave it it will not really matter it will not even show so now let's bring it here and then select where our pix map we can choose a resource and the name is current uh I can't see it for I think current music.png so it's select that one and you will see that it is so large and we have to expand it before we see so how we can go fixing it I'm sure you've already guessed it is to click on the scaled content and that will scale it inside whatever parent it is in so we can put that one on this side and then let us just duplicate okay we Not Duplicate it let's bring another label and then call the test inside current currently clean okay let's resize it go into the stylesheet like this and then set the background color to Invisible okay and then let's come up here for the font side let's bring it up 15 do and then let's make it bold for the color also it will inherit from this m so I think I can just open the sty sheet and then copy the color for it or equally I can right click on it like this change style sheet and then for the color I'll pick a screen color so I'll pick this screen color from the B and then I'll give you to this one also so apply okay and then that's one two shows okay so now we have this one to at the top there what we need to do again usually sometimes it's difficult to get to arrange these things okay I think that this is this is okay with me bring it down okay so we need another label that says name very close to this currently playing so we can actually copy this and then paste and then come in here and just change this one to name and then I will duplicate it again but not now I can now change it let me take the board off bring the font size down to maybe 14 uh I think I need a board back okay if you want it fine if you don't also that is completely fine so I'll duplicate this one to again and then this time around I'll put it down here and say song name goes here spand it to fill and this one you know you have to make it white so go to the sty sheet and then from the color we delete this one go to add color color choose this white and then okay so apply and then that is it and then we repeat it for the song part also but before then let me change the name of this one to current uncore song score name and so after that I can select the two of them by holding control command on Mark and then I can paste them down here and this one will be path and then finally this one will be song path goes here okay that is great I think we have to increase the size of our frame a bit so s path goes here and this one will be current andore songor path then we are left with the two buttons the add to favorite and then add to playlist so let's bring up a push button put it here and then automatically it inherits from the parent but you will change things very soon soon so let's just go ahead and then do the styling before we even put the icon there so change style sheet and then for this one the background color will be white so let's pick it and then the foreground color which is the color let's try this orange is not actually this orange but we modify this one we still need a 255 and this one instead of 170 let's make it 140 and then instead of Z let's make this 164 that's the color I used so when you click on apply you see that the the testt shows there nicely and that is great we don't need to apply the Border radius because it's inheriting from the parent so for the font you can come up here and then bring it up a bit maybe 12 is okay and then it can be pulled it happens to be that we can also add an icon plus the text to a btom so come here choose resource and then this one is the add to favorite so we will do it that way but the test also we have to change it we can also change it here equally so add to favorite great let me reduce the size a bit but I can make this one to 24 by 24 just to make it large okay and this one we have to now give it its proper name which is add to faor BTN great and then we can just copy this one and paste it inside here and then change this now the for the favorite we you only have to flip the colors so what is now the background color will be the foreground color so you can just cut this one and then paste it in here and then this place will be 255 255 255 so apply and then that is it for but let's also uh this will not be out to f BTN to this will be add to playlist BTN so add to playlist BTN and then we can come down here and change the icon to the name of the it's a music list yeah that one and so we have it that one also in case you think they are too close to each other you can actually give space manually here and that is also acceptable so let me give a space anually so now we are done with this side what did I just do okay it looks like I have done something I was not supposed to do okay okay it's good to know that's a great scen so let me save the work here I think it's a caution for me to save the work and then now the volume dial that one is called a dial so let me bring it up like this and then put it here but I want us to move this Frame up a bit great so the volume down let's just enlarge it and then put it here also when we come to the property of this D you can find that you have uh okay let's let's let's put the name there before volume D here we can set the minimum to one and then the maximum to 100 or the minimum should actually be zero because you can somebody can choose to put it as zero the single step is when I turn it what should be the step and that is one the current value 20 you see that the handle mooved to that particular position and then we can set the notches visible when you set notches visible we see that notches that that come out of it I think I like it that way if you don't like it you can choose to leave it and that is completely fine so one after this one what we need is another label on top of our volume dial which we will call volume label and then we we man set the value to 20 because that's what it should be volume label and then let's increase the font let's bring it the sze up okay I think it's okay for me as it is I want to center it so I can come here down here and say the for the alignment the horizontal align H Center the vertical align V Center so that it will be at the center just like it is now and I think I like it that way I may want to make this one too bold also where is it where is it font and then bold okay looks great to me and what we are left with now I think we can finish the bottom part then now we tackle the the stack widget so let me open up the main again for this side we will create a one frame at the bottom and then inside it there will be another frame for the playback controls and then there will be this object also or this other widget also so that we can eily distribute the space for them for this one this particular frame it has I think I gave it a fixed width for the geometry did I no I didn't was it for this one no but this one I think it it it had okay for the height it did have okay for the height so let us work on these ones I think I can minimize itad of closing it every time okay so we need one frame at the bottom there usually it's hard to find here that's why okay but frame is just down here let's try and set it wide and open it up also forgive me if I'm not very fast with this UI building Parts because they usually take some time and then I need another frame inside it make sure it falls inside you can confirm from here that frame three is inside frame to and it is inside these ones that I we will add our push buttons for the playback control so push button make sure it's inside the inner frame and here you can delete the text select it and delete it sorry select the test and then delete it and then let's come here this one should be let's give it the name this one should be the playcore BTN come here icon choose resource and then images play play play where are you that is rather it's rather oh forgive me the the names are interchange this is rather supposed to be the pause but I made that one the play so you select that one and then you know that we have to make our background invisible so let's change Styles sheet and then choose any color that we want not sorry background color any background color that we want I just that the alpha should be zero for this one it will not really be zero but okay okay uh let us apply the sty sheet properly what I will do is that as I did for the minimize and close button so we have to get the Q push button class and here I can set the background color with an alpha of zero and then also set the Hoover so I can copy this this one and then say that when it is hoovered I want the same color but this time around Alpha should be 100 okay so apply think we let's copy it because we need it for the other ones also they they all they are all the same so when I H over you see that I have that nice style there for me but for this one also we will set a minimum size constraint on it so we can come to the top here and set the minimum size to be 30 the maximum uh minimum height and weight will be 30 each so that it will uh just be a square like this I think that is great so what we can do is to copy paste it make sure that it's still inside the small frame the inner frame you can see that all of them are here this will not be play btn2 this will be po BTN and all that we need to do here is to come and change the resource so choose the one for the pause and then we can copy paste it again don't worry to arrange them we use uh layout the layout spacing to do that so don't worry the next one is the stop so all we have to do is to change the name here so stop underscore BTN and then what we have to do is to come down and then change the resource icon to this stop and then copy and paste it again for the next the previous and all of them so next no the previous counts first so previous BTN let's copy paste it then later we change for all of them they icons so this one will be nextore BTN and then after the next we have the loop one and so this one will be loop1 BTN and then we need it one more time for the shuffle underscore songsore BTN great so now let's change the icon so when I click on it this is the previous because the background is white it becomes difficult okay this previous and then the next one is the nextest then we have Loop one which is Loop one the there's there are two Loops one Loop and then the other is just Loop one so select the loop one and then the random play which is play random but for the loop one and the random we have to set this checkable property to true because they'll be checked great and let us now bring in our slider so our music slider so that will be horizontal slider here that one is inside the main frame the not uh not this the one that not the sub frame so let's keep this one here and the name is music slider music underscore slider okay and then we need one more label here here which we call the time label so time underscore label and that one to we have to change the style sheet make the test white so select color pick white and then okay but we have to increase the font size is it okay make it bold maybe which the test will be 0 0 0 0 slash 0 z0 okay so this is great now let's apply The Styling for the slider the class is kill slider the capital S so kill slider and then we want to get the groove so double colon and then you get the groove and then because it's a horizontal we just say horizontal if it was vertical would have said the vertical we want to set the border to one pixel solid and then solid solid and then the color will be the color code will be 999 999 sorry B that then we put a colum here yes just like CSS it is actually CSS and then so we'll be applying it as we do it so that you get to appreciate it now you see that the border the default border that was there is gone now it's this border that is here and so we can continue by saying that let the height be 15 pixels and then let's apply and see okay and then we can also set the padding so I give some breathing space to the slider uh the handle that is moving inside let's set the P into three pixels apply it and see okay you may not really see it until you start working on the handle and then the background the background color so background let's pick this color for for now but this will not be background color it just be background Swit delete the color from here and then that is rgba we want to set the red to zero the green to 255 so and this one to 127 and the alpha should be 100 when we apply it you should see that that's uh green color light green color there if I should change this one to 200 and appli that to be deeper but I don't like it that way I like the 100 okay and then we can set some margins so let's give that a margin of 2 pixels and then zero so for the top and bottom and then left and right and then so let's set it that way and then we can now also say that the Border radius is let's make this one's border radius 11 pixels and then apply it and see so you see that the Border radius got applied and so let's work now on the handle that will also be still kill slider double colon get the handle and as you have guessed this one will also be the horizontal this one the background will be RGB you want a yellow color some that yellow color yellow color so that would be 255 for the red 200 for the green and 50 for the blue so if I apply it it is showing here like a line I don't know whether you see it from your side but once you go ahead you actually appreciate it coming in and then I can also see that the border for this one should be one pixel solid and then the color is 5 C 5 C 5 C let's apply it and see still it's there but you see it very soon when it comes in or you know what let's bring the the value currently to maybe 50 or something like that you can set that one so for the slider the value current value bring it to 50 so you see that the the thing is in the middle like a yellow line so that is what we are working on and then now after that we can see that the width should be 18 pixels let's apply now you see that it has gained some some size and then we can of course give it a margin or let's do the Border radius first the Border radius that one should be 9 pixels for this one so let's apply it do we not do something right but radius apply okay so it's not really applying the Border radius let's give it some margin so that at least to have some breathing space for that to work so margin and then this one will be -2 pixels and then zero let's apply this time around and now we see that it's now circular one so that is how we also work on the slider for the our custom slider let me put it that way so what you want to do is to select the frame in which these playback controls are and then come and click on layout horizontally that one the frame will space them out automatically for us and then select the frame if it becomes difficult to select it here you can equally select it here right click on it and then change sty sheet we supposed to give a border radius of 10 pixels and we forgot because now if we hover over then that the backgrounds are square and that's not what we want so we can come here and say border radius of 10 pixels then okay that one all the children will inherit now is that the Border radius has been applied great one very important thing we forgot is that the ker for each of these ones should be a pointer so when you select each of them where in the property data for the arrow change the arrow to pointer we'll be doing it for all of them oh okay so now let's select the bigger frame like this and lay that one two out horizontally you see that it has laid them out so let's just stretch it out and then let it fill the screen and then yes we have our slider and those one so we can resize it just to fill the space down there so we can let's just select our slider and bring the uh this one we can also set this one scure to pointing hand that's will not to be bad and for the value let's bring it back to zero or even one let's try Z and see not 10 zero okay for this dial Also let's set the hand this one we want to set it to open hand you can choose either the open or the closed hand if you go to preview and then let me select my Fusion style so that this hand is the Open Hand and you can immediately see that something is wrong here this border the frames that we are using their their borders are showing so let's come back select the title frame first come to this place where you see the Q frame and for the frame shap select new frame and then this one you can leave it this one you can leave this way and for this one to select the bigger frame the frame shape no frame but it looks like we have to increase the size a bit okay okay so now let's preview it again the shortcut on Windows is control R and Mark I think should be command R so now you see that the frames are gone and then everything is also visible now but I don't want this kind of K for the dial so I will come here and in of the open hand I will choose the closed hand rather I think that fits the purpose better than the open hand so yes that is the great so now let's work on the stack widget for the stack widgets I just search for stack stack widget and then put it in here three sizes to fill and let's just change the Styles sheet for the first one let's just add a background color I think we can copy from the one here but I think the alpha was it 100 or 150 let's try 100 and see apply this appears to be too much let's make it 50 and see okay I think the 50 is is okay the the icon the image at the background is also showing as well and then let's also apply the Border radius which all the children will inherit from to be 10 pixels and then okay so now we have this one to in the like like this still have more space down here no we need another space down here for the button so let's leave some some breathing space and then in here I will I'll bring a label for the song list right click on it you know that will hear it from the parents so I can now go to background color set the alpha to zero so that the text will not be showing that way I forgot to change the color bring the Star sheet back choose the color make it white okay okay and then we can come here change the font size 15 is okay bold and then we can now see song list okay and there are some three icons here sorry button here so we just come and say button or push button rather push button select this one the minimum size should be 30 30 not not 3 30 30 okay okay this one was the add songs BTN so let's just add the name so add songsore BTN let's come and change the icon choose resource and then it is this one okay so let's change the icon size this one let's make it 32 by 32 and then it comes out large okay but the background for that one in the demo was white if I show you to you that is white like this so let me just change the Styles sheet and then add color background color is white think white is already selected apply but this one to the Border radius is not really 10 pixel so you can say border radius let's take it to six pixels and see I think it's it's perfect for for what we needed to do so we can duplicate this one two times control comma or command C and then paste it in here and the other one name is delete uncore selected uncore BTN and then we can duplicate it one more time and say that one is so delete all songs BTN delete uncore all _ songs BTN great and now let's change the icons so for this one resource and it is clear.png and for this one let's this is the remove okay so the top part is also done cancel the top part is also done let's me save the work up to this point and then we can work on the the list widgets inside so for the list widgets let's come here and search for list don't pick the list view pick the list widgets and let's just put it in here and that is so great because it already inherit from the parents and that's some of the things that we want you to do for this one we can add a few things here so that we check it to can say song One song two we delete them afterwards and then this is song three okay so that we when we apply The Styling we will see it you can actually see that you don't actually see anything but let's bring up the Fone size first 15 is okay then the style sheet for this one the color will be an RGB of 86 red 227 green and then 194 blue so when we apply it you see that that the song name has changed that is the name there and then the background color that we can get it from here it is black but you want to set the alpha to 100 you know the parent is 50 so this one will be 100 then it become uh oh not color this will supposed to be background color the parent is 50 so this one is 100 it brings it it makes it stand out a bit so that it is easily recognized to apply then you see that that one stands out a bit and make it easily recognize and then we can also say selection background color so that one is here selection background color let's pick any color for now and then let's change it to the proper one so it is 255 for this 170 140 and then 64 remember the orange color we used I think that is the same one uh we will not see see it until we do a selection which we cannot do when the Star sheet is open and then we can also do selection color and that one is white so RGB 255 255 and then 255 okay let's give a pattering of 10 pixels for each of the items in there so apply okay and I think the song name should be bold the the font should be bold okay you realize that as I clicked I didn't see the selection color and that is because let's check it in preview I think it's because you are not in preview let's check it in preview and see okay selection background color didn't work so let's let's see what the issue might be change style sheets did we spell something wrong our sty sheet is valid but this this one I think it it will only work when we are in the python so let's for the finished one let's just add just one song and see and then now preview this main see that when we select it still doesn't show but if you check the Styles sheet for the finished one also it has the selection background color and all so this one unfortunately Works only when we are in Python that is why it is not showing so yes we did it but select the list widget again and then come down the scroll area q abstract scroll area just set all of them to off so that there will be no scroll bar showing it doesn't make it nice and then now for the last thing on this page oh why did I close out this widget widget box for the last one on this we have to now also bring a frame again down here down the song list withget and then that is where our three buttons will be so we can now go ahead and bring in our BTN which is a push button right here inside that frame and this one we call it song list and the name the object name should be song uncore listor BTN for the sty sheet I will go ahead and copy the color from here let me see okay so this is the background color and then the Border radius I think I'll copy everything and then just paste it in okay it's not really showing the Border radius remember the frame this one to let's let's set this one to no frame and then maybe the Border radius should apply to the the parents rather so border radius of 10 pixels okay then the next button is the playlist playlist which is also called playlist BTN let's go ahead and change the color for this one the color the background color is green color so delete the existing background color and then let's pick this screen or maybe this one okay but the the font size let's bring them up 12 is okay for me and let me make it bold this one too should be bold and then 12 and then finally you can copy paste this for the favorites okay for this one to should be favorite BTN and then let's just change the background color I'll pick a screen color because the same as this orange here and then okay okay so now I select the frame in which all of them are that's the frame four here you can see they are all indented inside and then I'll give it a layout it looks like this our buttons then still don't want to show the rounded Corners okay let's set minimum height to 32 and let me see not not for the not for the frame for just one of the buttons set the minimum height to 32 and then you see that it shows so for the playlist also set the minimum height to be 32 and then the favorite also set the minimum height to be 32 great so now this first page of our application is done this was only needed for testing let me edit items and remove all of them okay so the first page of our application is done our volume D is not here where would it be oh okay has gone to the back so let me just right click and then bring to front Okay and then right click on the label bring that one to to front Okay so that one is it so our first page for this one is done you just have to click there is if you look closely on the list widget on the stack widget at the top right there is some arrows that you can use to na so we say go to next page and I go to the next page it's completely blank so that is where we will do our playlist things are very similar here so I'll just copy this I just need one of the button because it's just load selected that we do as well as the list with it and then no hold control copy them and then on the second page let's just paste it okay and this place will be playlist and this place this particular one it doesn't even have an icon so let's remove the icon from there can click this uh button at the right side and then it will take it off so we can here see loaded this one you don't really have to give it a lot of the the color background color is some green color so let's pick a screen color for the green this one should do okay and then the font size should come up a bit B make it nice also okay and then uh we want to increase the Border radius to 10 pixels okay or even higher let's try 15 and see okay that looks good to me but there's a very big uh something that we were supposed to that we didn't do on this song Let come here and then you know we have to call it loaded songs list widgets like this and then we go to page two here you can click on this pages to also navigate and then the list widget here now we call it playlist list wigets okay so that is also completely fine and so we are left to the next and the last page which is the favorite page we will also employ something from here this song list you actually need and for the favorite we need this two so control be clicking on all of them control command C and then navigate navigate okay we have to add another page to it before so for the stack wet you can just right click insert page uh okay let's go to the playlist because we can insert after the current page so insert page here after current page and that become page three down here you don't you don't actually need to name the pages we use the index to uh move around so that one should be fine and I paste what we copied in here okay so this one should be favorite and then this ones we have to change their names this will be delete selected favorite _ BTN and then this one will which the next one here should be delete all favorite ptn so I can just change the songs [Music] to favorites and then this one will be favorite list widget so favorit list widget the T favorit list wigets just like that so that is the app interface design for this stack widget whatever page you leave it on before you save it is the default page that will render when the application first opens so you want to you may have to bring this thing up a bit okay we want to leave it on the first page just like this one is so that is it we can preview our app and for the preview we can use this button to navigate but inside python we will have to write our own functions to do the navigation and it wouldn't be a problem at all okay so that is how we I built the UI or that's how you can build the UI and let us work on the actions the actions are what will come in the popup menu or the context menu uh but for now let's okay let's work on the signals first for the signal let me expand this want to add a signal the sender will be our the center will be our Clos BTN here you see now when we let's preview when you click this close nothing will happen but okay this ones even in the property editor the curer should not be Arrow should be pointer the same as this one one so the signal that we want from it is that when it is clicked the receiver should be the music app itself that is the the UI itself and the slot is close so now let us preview it again and then click on this one so that it closes the application so we can set another one for the minimized so minimize BTN saw it here yes when it is clicked the receiver again should be music up and then the slot should be show minimized like that so that one too would work the next one that we work on is for the volume down when the volume down we want the slider moved this one and you see currently if we preview it and then move the slider nothing will happen nothing will happen what kind of Icon have we given to this should be closed hand yep so we want the receiver to be the volume label the one on top of it that values that to be changing the volume label and then we have to set okay okay there's no set text so let's pick the set number and then the int okay so now when we preview this one and I turn it see that the value will also be turning together with it so now let me show you the actions and that will be it for the building of the UI for the actions we just click this one and then this one let's call it play is that you automatically give the name action play for the icon let's just click this place and then choose the particular icon here if you want to set a tool tape to you can say you can add it to play and then the next action will be pause on PA pause SL onpa capital P okay and then the icon for that one also let's choose the resource to this one if you can add shortcut to if you want to but I wouldn't do it if you want to add a shortcut okay I'll show you in the next one the next one is action next and then I can also say next no next next okay if you want to add a shortcut all you have to do is to click inside here and then press the particular shortcut but I I was I was trying to delete it so the back space also keep choose resource file this one and then where is our next next next this one okay and then the next one on the list is the action previous okay so I believe you get the idea of the actions I don't think I should extend the video any longer by creating all the actions because this is not the file that we'll be using as I said we will still be using the main do UI just that this session I was just focusing on showing you how to build the UI yourself so that is it for this session let's look at let's go into py charm and see how we can convert this one to code and then start working on our great application so let me close this one and even close this one also and then let's move to the The Next Step so I think I shouldn't close it we will need to make reference to this UI so sorry let me open it again and then let me open the main one so let's just minimize it we come back to it so let's convert this one to python code obviously this one is not what we be running so let's convert it to python code I'll go back to my terminal and what I have to do to convert the resource file to python code it will say pic5 and then I I bring a flag of DX The Hyphen X is the flag for the incoming Ur file so that is main. UI and then another flag hyph O for the python file that should be generated I will call it music. py you can choose any name but you have to keep that in mind in case I Call Music you you call that particular file name but if you choose music also just press enter looks like nothing has happened but if I list you see that now now there's a music. pii file here it wasn't here at first if you check your you see that it's it's a new file G has told us a new file when we open it now you see that it has generated the code for us for the application but if we run this thing now you see that we get an error it says no model named re. RC and that is because P5 is trying to import the resource file that we used and and it is not finding it even though it is here and that should tell us that that is not this resource file it is looking for it's looking for a python version of this resource file so what we have to come back to our terminal and do is to convert this resource file into uh python uh file and that is done by pi r cc5 and then this one the output flag comes first we give the name of the Python file that will be generated from the resource file and usually as you saw it to key to automatically name it and so I usually use this name for it so that anytime I make changes to my UI file and I have to run the pic5 for command again I don't have to come and change this name all the time in fact you noce from the top here that it tells you that if you make changes and run it again you lose all the changes so I don't want to put myself into that trouble usually you will be making changes to your Ur file and then be converting it again so I just use this name to be and then so I'll just paste the name there py and then I give a space and then give the name of the resource file that should be converted which you know from the top there is re do QRC and you press enter and you list you see that that one too has been created for us so let us come back to Python and now this red arrow should go away anytime soon when we run it again we shouldn't have the error okay so now it has come this is our file you see that the default title bar is there so that is what we have to get rid of when you click on this one you cannot move the app around but of course this one will close it for us okay so you see that I run from this file and it was successful but usually that's not how I do my my pt5 project because this UI file I make changing it anytime that I want and I don't want to be pasting my functions here so that I'll be losing it every time I'm copying and pasting it again it's a whole lot of stress so what I do is that I create a new file which I'll call main.py and that is the reason I didn't name this main UI file main.py the name is main. UI you were thinking obviously that the python file should be also main. Pui but because I have one that I'll be calling main.py I decided to keep that name okay and in here what I do is that I create a class that calls the this music. py file see that there's a class that runs the application it's at the top here it's called UI music app so I create a class inside this main that calls this one and runs the application let's see how that one goes what we have to do is to import okay know from from P qt5 QT widget we want to import everything Q widget we want to import everything and then we create the class so let's say that the name of the class will be modern music player this will inherit from Q main window coming from the QT widget up there and then oh okay I didn't bring the import sorry so Import St and then we also have to import the class from the music. py so we can here say um from music you want to import UI music app as the name is here okay and so after this it also has to get this UI music app and then the default class stuff so we have to Define our in it okay but this one we will call the super also so super call should be here and inside this we will now also say that now we've created a class we have to Now call our window so self. window should be equal to Q main window QT we can create Windows just from widget but we want this one be a main window that is why we are doing that and then we can say s. setup UI and then weet it equal to self okay this s is redundant move redundant parenthesis and then what we can do is to say self do show to show the application if we run this main. Pui file this current file it will still not show our application you can see that process finished with exit Code Zero and that is because that's not how to run QT applications if you come to this music. py file all the way down you see that they they call this uh this so this stuff all has to be they have to come in place before the app will successfully run so I don't do it also in this file and that is because that's how I usually like to keep my things organized so that I don't really mess up with the code sometimes the code bases can be large and so if you mess up one it really takes time to get back on trct so I usually create another file which I call run which will now run the application I don't want to add it now and from there we can just see that from Main sorry from Main you want to import the modern music player that class that we created and then from P qt5 QT widget we want to import Q application course we need an application inst to run the application we also need a system Library so you want to import Sy I was wrong with my typing today import X Ys and then now we declare that the app instance is equal to kill application here we can pass in uh an empty list it it it this place takes in the the things that the application needs to run so all the dependencies that it needs and so we can't be safe in here to say six do agre so that the takes in all the argument that is needs to to run successfully and then we can say window should Beal to the ADV the modern music player the one that we created and then we can just say sis do exit and then you can say app do execute so exec where is it this one this is very similar to what we found in the music. py because you have to create an application instance and then run that particular application so that is what you are trying to do here just trying to so now if we run this run.py of course let me right click and then run you see that our application now comes okay so this is what you be using to run application but I like a style in QT called the fusion style that is how I used to I like all my applications in C so I usually add it and so I can now come here and say app do set style not set style sheet set style sheets another thing you want to set style to Fusion that is great so let's run it and see of course because this one has been fully customized we will not really see the changes but it does happen I like it that way so now all the rest will be coming inside here this run we may not even need it again it's already in my configuration here so let me close out from this window to for some time I just hope the size of the font is loud enough uh it's enough for you to see okay now the first thing is to get rate of this default title bar the default one there so after the setup uh UI before the show let's just say uh it's going to be a lot of lines of course so I'll do my best to comment it out so remove default title title bar okay and this is how we go about it self do set attribute attribute want to set the attribute to QT Dot and we have to import that one at the top here also so we can just say from pqt 5. QT so from PI qt5 do QT Coe sorry we want to import QT like that and then so we say QT do wa for translucent background like this and then the next one that we have to do is so yourself do set window Flags set window yes so set window Flags please make sure that you check the capitalization also so accept window flags and then we can say Q T dot frameless window hint this one should do for us and so if you run it now our Apple will come but the the title bar will not be there so you see that now I cannot move it around even though I can close it because we set that option there other than that we didn't have any way to close it maybe we would have used yeser the stop here to stop it or if you using the terminal control C to break out of it so what we have to do now is to write the function to be able to move our app around using our own title bar we will need some few things so let's just say initial position of the window okay and let's create a let's get that one in a variable so self do initial position sorry position let's set it equal to self dot position this one I think it is yelling at me that I didn't spell something right okay and then we will have to now write some functions to take care of the position that we want to set all of it will happen before the show so let's now Define please check the indentation of this one is inside the init another function the function is inside the init so self it's inside init you call it move up sorry move app okay but this one we take in events not self and then we can see that if event dot buttons that means if uh sorry buttons the button that has been clicked on the mouse if it is equal to QT do left button you want to be able to use the left button as I click and drag to move it around if you want to use the right button which I don't think you want to do you can do here right button okay so now we can to say s. move we want to move the application and you want to move it by sell do position no the position that we set up there and then we can say plus sorry plus event dot Global position minus sorry sorry sorry sorry minus sell. initial position okay so that is not all we have to add some other stuff so now we can say self. initial position should be equal to event sorry event do Global position and then event do accept to accept the particular event okay hopefully this should do the trick but we have to connect it to Something in QT you have something called signals and Slot like I show you how we change the label on the volume down when it is turned round and all that so this you can think of it like uh some something to be performed when an action is triggered but we have not yet defined that particular action that will trigger this so we have to now say self. title frame which is the name of this Frame here that moves our app dot mouse move event so when the mouse uh it has a mouse move event sorry we want to set that one equal to the move app that we have up here but we will not be calling it we just use it like this so let's just see how it goes you see that it doesn't actually work it doesn't actually work and that is because we have to create one more function that is how done in QT I there some research on it and found out how to do it this way so that one will be after the show sorry sorry sorry this one should come the show should come before I think that should be one of the reason because this show should be here this connections they happen after all so the show should come okay okay so now let's run it and see I'm still not able to move it around and that is I think it's because there one of the there's one more function that we have not created yet so outside the init but is still inside the class we want to now create a function that will or a method that will handle the mouse position so function to handle Mouse position and then we can say DF Mouse press event this one is coming in from QT itself you don't have to use your own naming convention to name this function just as it is make sure you type it but I can get rid of all of these things here and then just put in events once again I repeat this method is not one of my own it's coming from QT you have to type the name exactly before it works so you can actually see that sell do initial position initial position should be equal to event. Global position just like this and hopefully this should work for us so now when I click I can move it around just like the title bar has been doing I can minimize it I can bring it back I can close it and it all works so right okay took some time for you to go off from pyam but we know that it's still working okay so now let's move on to the obvious things to start importing files using this button here and then playing them so we can call it ad songs Okay so the method's name will be add s sorry and then it takes itself because it's a method of the class and then we can now say files it Returns the returns are two let me just show you why I want to really want you to really understand why I'm doing the things I do so files equal to K file dialogue this is coming from the QT reg that we imported at the top dot get open file name get open file name uh get open file names so I was looking for this one and then in here we can pass a couple of things the first one should be self and then the second one is the caption so the caption is the title of the window that will come up there so we can now say as a string maybe add songs to the app okay after the caption we can also passing the directory and that is the directory that it should open to by default if you put in any directory here hardcoded directory here like your desktop or your music or your documents that is where it will open to at all times but there's another cool trick that I want to show you if you put in a colum and then two backs slashes like this what it will do is that it will always remember the previous place that it's it's open to so let's say for the first time you loaded the songs from your music folder the second time you open the app and try to load uh the second time you try to load songs it will go to your music folder because that's the recent one it have visited if you change it again now and then you open it now from downloads when you open it again it will go and fetch it from the downloads folder and that is what I am talking about so and the next one is the filter the filter is to let it uh okay let me leave the filter here for now but if if what the filter does is it filters the particular files that should show in the window the the open window so if you just say here that um mp3 it will only show MP3 files for you to select so it's a way to restrict the user from bringing in files that are not supported into the application but for that one I have it here let me copy it from the second screen and then paste it in okay so these are the supported files that application will take from MP3 to MPEG and all those ones I also research about this one and then saw that the QT supports all of these file types if there are more I don't know but these are the ones I found and now we can say that if files so if files that means the user can actually open the window without selecting files so now if files that the person select and I think I named it here fly so files okay so if files what we want to do is that let me now just print files I want to show you something and before this one will work we have to connect this method to one of our actions or our button so at the top here before the show I will just come down a bit and then now give a comment here connections okay and inside here too I will give the another one called default page uh I am doing this and you understand very soon because I want to group things uh where they are supposed to be and I can say self do ad songs BTN that is the name of this one if I click on it you see that it's addon BN at the top here that is what is used to add song so do click not click do click dot connect when it is clicked we want to connect it to sell do add songs add songs okay but we don't call it in here just make it like this okay now when we run it when I click on it you see that it remember the place of the previous one and then it took me there so if I should let's say just create a test folder here let me call it test because I already have a new folder there and then for this time around let me just do some cancel it if I now open it again because obviously I didn't select any song Let me uh see if I can copy from this window okay copy it's a test and then you paste it and then let me select this open and then try the operation again it took me to this place but I need this time if I come here and select it and then open I come again it took me to this place remember the place where I was previously and that is what I was trying to show you and we should have something in our terminal also that I want to show you this is the result that came the first one see that that one was empty so that's why we saying that it fils and then the second one that I selected only one song you see that as part of the return it gives us first uh tiple of this uh a list sorry of of the files themselves and then it also comes with another one for the supported files so we only want this first part of the list of files so that is if we want it that way we can easily C for it this place and just say files comma and then usually they place an underscore there sorry because the second part so this part will be for the first part which is the list of files and then this part will be for the part that we don't need so if you run it again now and then add songs let me select all my songs here and then boom you see on the thumbil that let me close this you see that there is only the list of songs here that we have and so the next obvious thing that we want to do is to add these names to our song list widget that is on the first page so that is what you want to do so we will not be printing files like I've done here and we can just see self. loaded song list widget that is the name of this widget here the first one here so if I click on it see I loaded song list widget do add items or okay if files then we let's now say for file in files because of something that we do later for file in sorry in files then we can just say sell do loaded songlist widget do add item want to add item want to add the particular file so let's see how that one to goes our favorite playlist okay so is that we have it added here obviously not in the way that we wanted it to be because all you the music players or media players that we know of doesn't show you the full PA of the song it only shows you the the song elv or the song names as they appear in the folder and that is what you about to do next this thing is too large and we can easily do that with the OS module so let me just instead of just the raw file I can just say os. path do base name this will give me just the name of the particular file and so if I run it now you see that now I only have the file names and they are displayed here nicely just like this okay but you could see also in the finished product that there was some icon here at the left before the name come so let us add that one and make the work complete let me cut this one here from from here for now and then what I want to do before I add the song is I'll add a k list widget item and then inside the Kess widget item I will add in two things K icon sorry I think I have to import that from somewhere let me see Pam on iover over it like this is to import it for me and if you don't have it be sure to import it from P5 and then for the icon I don't think I will have to sorry this is just redundance so for the icon I will just passing the path to the icon and if you come to the resource browser here and I expand this side you see when I click on the images all the images here I can copy the part so if I am looking for which one are we looking for we looking for this one if I click on it like this and copy path I will get the path to the resource file and that can also that which will come from the python file that we converted that is how the resource files work so I can just paste it in like this that is the path that we need and then the second argument here being the file name sorry sorry sorry sorry which is the os. path do base name of the file okay so that is why we didn't use add item or anything like that we just wanted toate each of them and then add this one okay so now if we add songs hopefully there shouldn't be any error but a beautiful thing here for us okay so that is it we have our songs loaded with a beautiful icon at the side there so the obvious step next that we have to do that is to play the song so let us get into the playing of that particular song again I will create another file for give me I'm creating so many files this will not be the last one but I usually create a phold so called songs where we keep uh some lists because we want to when we load the fil we want to load them into a list and then play from that particular list because our app will only display the the files name as it appears in the folder but we need a full part so we have to store the full part somewhere which I will do or we are doing with inside the the songs. py file so we just let's create two lists there the first one is current current song list and that should be an empty file an empty list sorry and then the second one that you want to create so that you don't come back to this file again is favorite um favorite let want be favorite songs list okay which is also an empty list just like this and then we can close it okay and so what we want to do is that before we add the file so for file in file we can now say songs songs dot uh no songs dot current song list do append you want to append the file to it so that we have it there be sure to import it most of these uh my that I do the P will import them for me automatically but if you're a different editor you may have to do the importation yourself so just keep track of that I'll will try my best to allert you anytime that has to happen so that you you can import them so now that we have it imported into that file then we can now go and call it and use it what happens is that if we now load songs like this when we click on it in this list widget we can use H get the current index or current selection from the song list widget or the index of the current selection from the song list widget and then we can use that particular index to access the full part of the file from the song list widget uh that we have created the empty list or which will now be filled with all of these things and so that we can use that one to index into it select it and then play it but before we can play the song we have to create a player object or appear somewhere okay so um self. player equal to K media player media sorry Q Media player and then be sure to import that one also from pqt 5. QT multimedia we can now come here and then add a new method that will play the songs okay now this one let's put it in a tri accept block I usually like to do that for applications like this especially when the code Bas will grow large it's good so that your application will not be crashing often in terms there's anything that will crashing then the try accept will save you from that so accept can say exception maybe as e we can now say like print and inside an F string we can try and print out something that will help us know where the application crashed so I can say Okay Play song error so that I know that the error is coming from the play on and then I can plug in E here inside here now I can write the functionality what we need to do to play a song is of course get a song which you do by the index so if you want to get the index is you can say current selection sorry current selection should be equal to self do loaded song list wiget uh not this one loaded songlist widget dot current rule this will give us the index of the current selection then we can later use in in assessing the file from the song list the list widget oh sorry the list not the list widget and then we can now see that current song now equals to songs. loaded song list widget how do you call it it's not loaded s or current song list wiget yeah and then we can now access the the one at the current selection when we have it like this then now we can go ahead and play the song what we have to do now is to create a URL that is our with work in by so sore URL that should be equal to K media content which should also come from pt5 QT multimedia so Q media content then Q URL which should also come from P cor okay and then you can say URL sorry Dot from local file because we are accessing it from our computer and then we can now see the current song so we get the new URL that will not be a problem for QT to play with then we can now say sub. player do set media set the media to the song URL and then we can now say s do player do playay okay this should play our song for us so let's just in anticipation oh I should connect it first I'm sure you guess that so where our connections are on the default page we can now say s do play Play song BTN or something like that or it's called play BTN play play BTN this one this is what we want to use so play BTN at the top here so play BTN do click do connect we want to connect it to self do Play song okay of course don't call it just let it be there like that and then now let's load a song I would like to this volume doesn't work for now but if I select life is a dream you see that now it is playing so we have done the basic thing that basic thing that application has to play a song I can't let me just close it so now we've done the basic thing let's us move ahead to now pause and unpause Our Song so that one should should go can say pause and un pause but before we do that let's just get some Global variables to keep track of certain States in our application I'll do them at the top here so after the player or before that I can now say globals and we will need Global stopped we will also need Global loop I just creating all of them so that we don't have to come back and ourselves and then we need a global is shuffled we want to keep track when we are playing the random we want to know whether it's shff or not so the initial states of this one should be that stopped is false when we start the application it cannot be stopped and loop I mean when you start application stop cannot be false that was what I was trying to say Loop is also false here this is not JavaScript is capital F and then is shuffled is also false so it's shuffled which is also equal to false okay then we can now use this to create our pause and on pause so here what we have to say is we want to we have to check whether there is a song playing and this is how we can do it in pqt we will just say that if self do player do state the player that we created out there if the state equal to Q sorry Q Media Player do playing state that means that the song is playing then we can say s self. player. pause else s. player. playay so that is the trick that should do the pause and on pause for us not something so difficult so we come up here do our connection where is it the but should be ser. Pa BTN do click do connect connect it for the s pause and on pause so now let's see whether we can pause and unpause the song as we play so Raising Me Higher Play you can hear that it's playing in the background if I click on this it has paused when I click on on pause it resumes and then it continues playing so yes this one to has been C for the obvious one that we contined is the next the stop so let's just create the connection here before we go down so uh can help by duplicating s dot we will call it stop song stop to obviously through an error because doesn't know that one so stop BTN that's is what will do that for us so let's come down and this one is quite quite simple so I also want to wrap this in the try sub blog because as we go ahead and then build the application a lot of things will be will have to be considered before stopping the application especially when we are playing from from different places like the playlist or the favorite tab instead of the actual or the default song list wiget so let me just safely wrap this one also in a tri block I do have some snippet in Pyon that help me and this place will be stop stop song error and here we can now come and say ser. player no player. store just as easy as that just as easy as that so feeling [Music] happy pause it on pause and then stop it has stopped it I we forgot a very important step the song name should go here and the song pass should go here this one should have been done when we hit the play button so let's do it and then get that one off where is our play okay after it's placed we can let's check their names yeah this is called the current song name then current song path okay so self dot sorry sorry current song name do set text that is how we can do it set text and we want to set it to it should be an F string os. path. base name of the file and then here we can just duplicate this and I think it's current song path and the only thing that we have to change in here why is it say oh okay okay okay I'm thinking that we are in the load songs so this one will be current song okay this one too should be current song okay and the only thing we have to change here is that the base name will not be D name that is it and that should fix it for us let's see so let's add okay life is a dream play and then we see life is a dream and then the four path is done there if I I play a happy Christmas that one for now this part is cated for okay but one more thing is that that you see that our slider is not moving when we uh Play the song we will work on that but let's first work on the volume control before we want to set an initial volume when the application start so let's do it here so self. initial volume let's set it to 20 so that our volume will be at 20 when the application starts and then here we can say um function to change the volume of something like that so function to change the volume volume you call it volume underscore change okay and this is where we also have to bringing a tri accept block because a lot of things can happen and this place we can just say volume change error sorry and here we can now say self dot current volume sorry sub dot current volume the one that we created up there do we call it initial volume or current volume initial volume okay should be equal to s dot volume D that is the name of the D itself so it's called volume d as you can see here so s. volume D do value and then what we want to do is that we serve set the name the volume to that value so self. player do set volume to self do current volume no sorry initial volume I don't know how keep on wow okay so this should work but in the case where application starts we want to just make sure that the volume is at 20 so I think this line can come in very handy at the top there also so just immediately uh beneath the place where we decare the volume where is that one okay so that we know for sure that that is it okay when it runs at first and it seem to be something wrong here uh okay we also have to set the value of this text and then there they handle to the 20 so let's do that one also give a space here and then we can now say s do volume D dot uh set value or something like that to set self do initial volume and then s. volume label this one the label on top of the dial do set text want to set the text to F string just to be save and then we want to set it to the initial volume s. initial volume okay let's run it and see okay then now everything works out like we wanted to so we can add songs and then play around with the volume it is play first I increase it I I hope you hear it L and then now let me play this one [Music] rather okay I think there's a problem somewhere this thing may not really be working let's comment out this line cuz my volume was not actually increasing we still have the 20 set now let's see if the volume will increase I think they should be able to filter all these ones out yes it did so [Music] 20 okay I don't think it is still increasing let me just comment out these ones oh and I I think you guessed the reason I think you've guessed the reason and that is because we have not made a connection you have not really made a connection to uh that particular function that we we created down there that is very very very off things like that do happen so forgive me how we do this connection is a bit different from what we have seen so far and we can just go self. volume d dot value change this one we not looking for the click we looking for value chain do connect what we want to do here is that we want to pass in Lambda because it is has it has to be listening always keeping track of the particular value that the values will be changing as we turn the out so it have to be able to keep track of it and then use it so that's why we pass in the Lambda and then s dot volume changed and for this one you bring in the parenthesis like we are calling the function that's also one of the reasons we are bringing in the Lambda because if you have to pass any value here then the Lambda should be here but in this case the value will be gotten for us the D itself knows how to return it and so we can use that for our player okay so now if I play okay now the volume goes high for me [Music] very low then High okay so our volume dial is also working uh the next obvious thing that we have to do is to get this slider to be moving with a song and so let us get to that part and then see how that one also goes for that one we will create another one another function here to move the slider I want us to bring it to this place just after the function to handle the mouse position so function to move the slider sorry the slider okay and this is how we move the slider we will get the position the length of the song itself sorry and we will set the length of the slider to the length of the song in seconds of of course and then we will now be keeping track every 1 second move the slider by 1 second every one second get the position move it and then move the slider handle to that position so this particular function that we we about to create will be connected to something like a timer so that at at every 1 second it will get the current position of the song it also knows the full duration of the song and so it will set the slider length the full duration of the song and then get the current position of the song every second and use that current position to set the place where the handle should be I don't know whether I've been able to explain it well but I think the code will do the explanation better so let us get into the writing so we Define move _ slider and then we can see that if stopped return you remember the the stopped Global that we we created up there so if stopped that is then we have to return because if the song is STO this thing should not even be moving in the first place and then we can say else can now update the slider then we can say if self do player do state you know the song can be playing for a while and then it will be paused so at that time that it has not been paused the slider is still moving but if it is paused you also have to pause the slider so we have to keep check of that so now Q Media Player this one you have seen it before you know that you are trying to get the state of the player and then we can just say that playing State then that is if and only if it is play if it is PA don't do it then self. music slider that is the name of the slider here you see s. music slider so s. music slider dot set minimum not minimum size set minimum here to zero and then I know you've guessed the The Next Step so s do music slider do set maximum to the duration of the song which you can get byself do player do duration and they all come in handy with pqt we don't have to uh write them ourselves so we have set now the duration also and then we can now see that the slider position should be equal to s 12 do player do position what this one will do is it will give us the current position where the song is is is playing and then we can use that one okay so in order to let you know what actually is happening here let me now try and then print the duration so duration oh sorry I forgot the F string the duration here will be self do player dot duration okay and then the next thing I want to print is the um current time so let's just let me just say current and then that is the slider position and let's leave it for now remember I told you that before this one work we have to now connect it to uh timer so let's come up here where a lot of things are going on up here but we can bring it after before the connection so slider timer and then we can now say that self do timer equal to K timer it comes with pt5 so you can overover import it from P5 QT call up here where were we where were we yeah and then what we want to do is we have to pass in self here sorry what we want to do here is that self. timer do start and I will put in here 1,000 which is 1 second it measures it in millisecond so that is that will be 1 second so that means that every 1 second do what we are telling you to do and now you remember you have to create a connection to it Ser do timer do timeout this is how we create this one's connection so timeout and then we want to now connect it to the function that you created down there which is called self. move slider yeah again we don't have to bring this parenthesis so when we run it now bring up my because you'll be seeing some numbers down here okay so feeling happy let me just play [Music] it okay okay so you see that the values are this value which is the duration is constant you can see it from here and then this value which is the current is increasing by 1,000 so that is the calling of the timer so you see that this is 1599 2599 3599 but the duration stays the same so that is what we'll be doing so at every 1 second what we do is that we move the slider handle to this current positions and then the length will be the same so it to be like a fixed length but a moving handle and that is the trick that we are trying to use here right our slider we are doing more of of course than printing it so let's get rid of this and then what we can say is the self. music [Music] slider set value just as simple as that and we set the value to the slider position because that's the current position [Music] and then you can see that our slider is now moving but you can see that this one nearly tricked us into thinking that the slider is not moving so let's fix that one the time should be changing minimize this one what is the problem here and then this is what we want to do so here we change let me give a comment so change how do you call that on this ones is it time labels or something like that okay so what we want to do is that you saw the the way it's printed it in the terminal that is not a way that will be user friendly for us we have to convert it to the regular hour minutes and seconds that we know so this is how we go about it we can say current current time that should be equal to time which comes by with python is Def python so Str strf time we want this one and then the format that you want to use that uh at the top here say you type in the format the format here let me use double strings here is percentage H now represented H percentage M and then percentage s this is just the hour minutes and seconds if you want it in a different way you can format it that way and then now time do local time and then what is the particular time that you want to convert this format it is the self do player dot position sorry sorry sorry yeah there is the position and then we want to divide it by 1,000 remember it's a it's a millisecond is a microc also so you have to divide it and then we can also get a song duration but just by duplicating this line and then the only thing that we have to change here is the duration okay so this will give us the current time in a format that is easily readable and then this will also give us the no this should be the uh should not be current time it should be song duration okay I can go ahead and print this one to the screen for you to know the terminal for you to know what is happening but I think if you you understand what is being done here just formatting the time and then after we do that you can just say Ser do time label that is the name do set text going to set the text in an F string so what will count first is the current time and then we leave a slash like this and then we now bring in the song duration and this should also work for us let's test it out and see okay so bring it up bring it up bring it up raing me [Music] higher and then now we have our slider working correctly and but for every professional music player application you know that we should have the flexibility of moving excuse me of moving to any particular position in the song and have it playing from there but you see that this is not proving very stubborn when I move it it comes back because every second it is checking the position and fixing that position so how do you make it such that it actually also gets if I move it here it will stay there and then continue playing from if I un pause now it should come back to where it was uh so let's fix that one also that is quite quite easy we don't even have to write our own code for that we have to just create some simple connection for it so up here I still have a default page that's where we are we can let's bring it at the top that should be self do music slider do slider moved sler move this was what we are looking for and then we want to take it as an integer and then we can now see do connect what do we want to connect it to I'm sorry for all the background noise why they just down there making noise okay now we want to connect it to Lambda because we are come to write a function that will take an input so Lambda and then serve do player dot set position I now want to set the you see initially we getting the position I want to set the position so that you continue from there and then what you have to pass yourself dot music slider do value so the value that you have not moved to get it and set it that way rather so let's see how how it goes and so now you can see it is playing if I move it here stops and it continues from there so I can bring it back then it stops and continues from there so that is what I was talking about to make this one uh behave professional way like the professional players do and so of course you have BR on Advanced players so if you have these features okay so the next thing that you have to do here on this page is to get this delete get this delete one and then delete all to work so let's work on that one then we know that we are done we can move to the the different one which is the playlist and then onward to the favorite I think we do the favorite first before the playlist each of them any of them should be okay oh we have not worked also on the next previous okay we work on that one but since I've mentioned this or let's just finish this ones the next the previous and this ones before okay so that'll be play next song for the start the idea of this is quite quite simple you just get the current rule uh in the selected widget that is playing and then add one to it use it as an index and then F the full song part from our songs. current song list list and then play that one that is just how we want to do so and so let us see how that one go so Define nextore song and then let's just say that this is also a place where we have to put tricept okay so next song error here we can now see that the song index equals which is the the current song that is playing so that should be or the current selection of the of the song list widget so that should be S do loaded songlist widget current row okay and then we can now say nextore index should now be equal to song index and then we have to add one to it and then we can now see that next song or is it I think we can get a lot of things from our play here I this things should remain the same let's just go down down down and then paste it in so the next song should not be equal to songs do song list and the next index so all that we have to do here is all this we have to change them to okay you have to change it to next one so next song okay so this should work for us and yeah let's see how it goes okay sorry s so I'm playing life is a dream now if I play nextest bring up my volume oh and I know you know because we have not connected we have not made a connection so let's go up here and now say that s do next BTN do click do connect want to connect it to s. next song without the parenthesis and then let's see most of the times when I'm building this QT apps I forget to make the connection I just forget to make the connection and then I'll have to come back again so now life is a dream is playing have you noticed that this Alum is not changing [Music] okay and never play [Music] next it is play raising me higher but you see that it's thetion is still on life is a dream and that is a big problem because next time you play nextest it will use this index to still play this Raising Me Higher let us fix that one what we can do is that after we play the song um after everything oh no so let me get back to this after we play the song or after we yes after we play the song obviously so we can just Ser do loaded song list widget do Set current Ru uh this one set the current row to the next index so now feeling happy best and it Place life is is a dream and then moves the the selection to that one and to Raising Me Higher also and now to take Vibes I was expecting that I should get an error if I click on next again yes it is inside here this thing this is out of range but app didn't crash because [Music] try the TR that we use that the error for us and that is why I really encourage you to use that one we will fix this one very soon so that when it gets to the end of the queue it automatically restart but for now let's see how it goes okay so I know you've thought of the previous which should be just like this one but you subtract one from it so permit me to just copy everything like this and then let's change all the next stuff to previous if you using Pon and wondering why I'm doing all the selection at once it's alternative J will do that for you so previous song and here we just subtract one but of course you have not made a connection so let's go up there I'm very sorry for the occasional background noise I don't know why they are now standing they're making noise so can now say previous song and then this one should be previous BTN yep [Music] so now we know that this are stuff are also [Music] working for the previous it kind of works when you get to the top and you hit previous it's actually playing Tech house Vibes but it's not selected you can see from here that it's playing Tech house Vibes f now playing raising me higher when I get to but it doesn't go again yeah just when it gets to very happy Christmas check it when I click previous to play check out just that and I don't know how able to do that and not do it for the next but we will get all of them sorted out very soon okay so you can see from there that what we are left to do next is to play uh have the shuffle the loop one and then the random play but I also want to draw your attention to something for a professional grd application like this you don't want to play the next and the previous song based on a selection it is not so professional at all and this is what I'm trying to say if I click on feeling happy and I start playing it and then I mistakenly come again and click on a very happy Christmas or let me see raing me higher and I click on the next button it is plain feeling happy and so I expect that the next song will be live is a dream not Tech house Vibes because if we base our Nest based on the selection then we have to be playing Tech house Vibes instead of life is a dream so let me show you a way to get around that and make this app even more professional where our next song is let's come to the function and then we will now have to get the current song and this is how we get it for now I'll maintain this ones for now and I'll now say current media that should be self. player. media you remember that when we are playing where is it where is the place we set the song yes reset media so we can get the media so this one will give us the name of the or the that the thing that is playing and um for now let me show you why I'll do what I'm doing so current uh this is the current song URL should be equal to current media sorry sorry sorry current media what is wrong with my typing con current media. Canon URL this one and then we can access the thought part but let's just pause let's just comment everything and then let me show you what we are do I don't want it to be typ in blindly so oh I didn't do actually what I wanted to do so I can now print the current song URL sweet next I don't think it didn't mind me okay it did so this is what we get from the canonical URL it brings up a q URL objects uh it's opening when I click it is open it on my my my default player on my system so we have to get this URL inside and so how we do that is to just to say the path just give us the path that is what we want so let's see how it goes now also and you see that we we have a path here but there's something wrong usually you see you see the part here that is running the file it doesn't start with a backlash so if we try to feed this one in as a path there is a high chance that this thing might through an error it may give a problem fine we can we may able to use the OS model to normalize or is it the nor path what is normalized path but there's a nor path here that we can use but why not just put an use Python indexing to get from position one up to the end so this one will just forget the zero one which is this and then get us from the one which is the C to the end and that will give us the four part if we try this one [Music] again now super clean that we can use in our program and so you know that we now have to compare this path to the existing files which are in songs. py where is that one this one the songs should be loaded here so what you have to do is to compare get the index this particular path will be inside this song because the song is part of what we loaded so all that we have to do is that get the index of this this path or this song inside this particular list widget list sorry I keep on confusing them with list wiget inside this list and then when we get that index we can now use that index to play the next song I don't know whether I'm explaining it as I ought to but I hope and I do hope that you understand so let us get to the writing of the code that one will do the job better so all these things are not uh there some of them will be useful uh so this one of course will not be useful what we need to do here is that the song index now becomes song list which the current row this current row will go away and then we can now say do index which is which means that uh song current song with index want to find the index of the current song URL I this one is the right thing that I'm doing no this is not the right thing it should be songs dot current songl do index of that and that is y so this should do the trick let me see so I will be playing feeling happy but I I'll intentionally select the raising me higher and still go next so if what we did is correct then you should play Life as a dream and not take housewi and of course it is playing Life as a dream if I select a very happy Christmas and go next but is still playe Raising Me Higher because that is the song so congratulations now your application is professional grade one so we still building it we still need this particular piece of code remember in the previous also so um where did we get to so let's just paste it and see where we have to do the edits this particular one should go and this one to should work just like that so for instance if I play Tech house Vibes and then put my car on feeling happy I would not expect the previous to play a very happy Christmas but raising me high and another did work so irrespective of the selection we still have this thing playing out nicely and that is great so what we have to do now is to see whether the song is um whether how to play the how to Loop only one song and how to play random for that one I would want us to modify this next song a bit so we will keep this function but it will not be this and then so for now I want you to First copy or cut everything that you have in here don't worry we will place it very and then before the next song this function I want us to create two more functions or even three the first one we call it the default next for now let's do it this way and then this one will be looped next and then this one will be sorry shuffled next okay so what we are trying to achieve here is that if uh the default next at any point in time only one of these next functions will render and that is that depends on what the state of our application is so if the person has clicked on the loop uh loop one button then it's the loop next function that will render if the person has clicked on the random or the shuffle then it's that one that will play other than that is the default Nest so this function that this code that we did cut we have to now place it in here so you can say default next error and then safely paste it in so that will be our default next now let us work on the looped nest for the looped Nest it wouldn't be so different from the default nest in fact if we let's just say Loop next and then paste it in you just made some slight modifications so for that one we don't even need to bother ourselves with all of this because uh but there's a high chance that a person will will click on the loop and then make a different selection from the make a select a different song from the list other than the one that is playing so we still of course need our Canal URL but this time around we will not add any next Index this is not needed it will rather be song index I hope I've not confused anyone because we still need a song that is playing so that if the person select another song we still have that song to play and then uh this one I don't think this should be next song of course the variable naming will not do so much of a hand but it will not make the code that readable so you can say song instead of the next song I think this feature oh this that cool feature in P time I thought it will help me and let me delete all of this I cannot use that my shortcut here because there's chance that to select another guest somewhere that I didn't intend it to okay so this should work for the looped nest and then for the shuffled Nest where is that [Music] one shouldn't also be so different from this one just that uh for that one still to try accept to be safe so shuffled next error do we need a current media no because this one we play it in random so we have to delete this two and then we can this is it so uh song Index this one we we don't even need up to this point delete up to this point we don't need it the next song is should be a random figure so we can now see that the next index here that's you're making reference to here should be random So Random which is a module that comes with python by default So Random dot you want the Rand in we want an integer we are using integers to do the indexing so run in and then we have to declare from we want it from zero to I should be with the length of the song list which the song list if I say the song list without adding widgets I'm referring to the one in here so I may not say currents all the time that why I'm still referring to it so that up to the length of the song do current song list so any number from A to B it can be the number that we pass in for the song to play so that is it also for this one it shouldn't really be a problem but how do we know that how do we know I think there's an error somewhere like one arrow in then inspected that line oh okay okay okay okay I get it I get it there should be an arrow there there should be an arrow there that's what we are going to do now so inside here let's see we have to call the globals that we use Global loot remember Global isore shuffled we use them and then we just check so if it's shuffled then s do shuffled next a leave [Music] Loop then s do I know you've guessed it so it's look next else no I leave else s do default next so if it is looped do this if it is Shuffle do this if it is not then it's the default n that you want to play but as it stands now we don't have any function that keeps track of the uh changes keeps track or tells us whether our song has been loed or it has not been looped so let's just create those functions here down there or they should even come before there anyway should Dobe after this ones just want to make sure that they okay I think I stopped giving comments it's not good so function to Loop the song okay Define Loop one song okay so for this one it's always good I like this try except forgive me but it's a good practice I must tell you it's it saves you that if you get an error in such an application we be getting close to like 1,000 lines if you get an error without this gu it's it's difficult sometimes to figure it out some of the error will not even show at the at the terminal it just says Exit code is some large number and then you now know don't know where to fix it so these things really come in handy looping song error and then what we will do is we still need a global so Global is Shuffle and then we need a global loot Lo okay and then now we can see say if not [Music] loot then uh let me explain what we are doing here here let me pass for now if I run this thing now when I click on this to check it I shouldn't be able to click on this one too at the same time the buttons have been set such that they can be checked that's why they I check and I should have these two so if I click on this one only this one then this one should be disabled so I can't click on it but if I come and click on it here still being stop on then this one should now be disabled so it should just be switching between the two that is what you're trying to do here so if not looped and then you can say looped it's not true sorry true and then what we want to also do let me bring this thing down so that you can have view of most of the code in the viewport and then now you can say s do Shuffle um it's called shuffle songs BTN yes it's just right there shuffle songs BTN do set enabled to false so you can't click on it again else Loop is false and then sorry self do shaffle BTN do set enabled this time around to true so this is the idea behind it and we need a similar thing for the shuffle so let me just okay copy this one in here yep we need it down there so function to shuffle um Shuffle the songs or something like that so we want to Define Shuffle sorry shuffle uncore playlist and then P this in but what we be doing uh is to just be changing this Loop into a shuffle again with my shortcut alternative J I think uh that is for Windows on Mac there should be the that equivalent the same thing and then here will be Loop 1 BTN so Loop 1 BTN that is the name that we gave in the UR file so if you change it just be sure that you use those names appropriately so if I click on it to see lo. BTN if I shuffle I shuffle songs BTN is there okay so for the shaffle it prevents the loop button for the loop it prevents the shuffle button and what is so get an eror we can Shuffling no that should do and now we have to connect them up here so s do shle this shffle s bn. click do connect want to connect it to s. shaffle playlist and then in similar Mana s do uh loop 1 BTN do click do connect we want to connect it to sal. Loop one song so let's try it out and see now if I click on this you see that when I bring my ke on usually when it is active the K should be a pointer and the hover effect should happen but when I bring it is that it's not so I cannot click on this until I uncheck this where is it I uncheck it before I can come and click on this and now this one to I can't even click if I click on it it will not deactivate this yes but you can bring in that log that if a person comes to click here it will deactivate this one that is set the the the global or the variable to false and then now activate this one but I will't do that in this build but I think you get the the explanation I was trying to give if you wanted that way you can now be setting the states here so but that will make the condition a little deep and complex but I think I'm okay with how it looks like now what is left is that we have to now try the The Nest playing of the nest actually we are just testing the butons my songs are not many so that random may not really play like we want it to but let's just see so I'll click on this and then now press next okay I know immediately that it did work because Escape life is a play Raising Me Higher let me see playing feeling happy again how is this F okay now it's playing a very happy Christmas again it's playing it again again again again again so now we know that the random works at least because my songs are very small if you have plenty songs that should do [Music] and then I think we should check the loop also so I'll play feeling happy now and then and check this when it is lo let me click next it started playing again you can see that I clicked it not that I didn't I just put the I not click I clicked it because you know that the sler started again at zero but this time around it's still playing feeling happy you can see that again start at zero so our Loop is also working work on it for the previous song the previe song doesn't really doesn't need no no the previous doesn't need those things doesn't need those things but you can also testify that for some of the music players we have out there when the song gets to the end of the line it kind of plays the next song unless maybe the user set some settings not to let that happen and because we are building an advanced player we can do that also so now if I click on feeling [Music] happy I just want you to get to the end of the song end of the like you should finish playing now it's done but you can see that there is still some one second here to to be Ked for but in the in the in the memory or in the brain of QT this is done so what we can do is that there are two ways but I'll show you what to work best the first way is that we can check so if this time here you remember we were printing some and um the current time in our terminal so we can just say that if the two are the same then go to the next song but we just saw from here I've draged this ladder to the very end I don't know whether your end it will work but mine is still showing 227 instead of 228 so instead of worrying ourselves with getting these durations to March we can easily write one function by the help of QT and this thing will be C for so that function I will put it before the move slider and I can say function to determine the end of the song but as I said you can also manually go around this one and compare the times but I did it didn't really work for me because of that 1 second usually that has to be C for and I think it does it in microc seconds and you saw when I printed it that it didn't start from zero start from 500 and something and so it may be that at the end it didn't really match up to the value maybe it was 200 millisecond short but because that time time is so insignificant to let's say the whole 5 minutes or the 10 minutes or the 3 minutes of the song and nothing May really happen but in the cases where we want to do exact comparison like compare the times and move on to the next song that particular thing is very very significant because the computer can process up to that minute detail so this function we call it songor finished and then we need to keep track of something we can say say status here and then we can say if status sorry if status equal to kill media player do end of media and it's just so so simple like that so that one qt can tell us that I'm done playing the song so that I can just say sell do next song so it will now trigger the next song which if we come to look at it suest that it's just we will be checking all these things and then playing the next song so you just have to make a connection here and this one would be S do player do media status changed media status change this one so when the media status is changed we want to connect it to s. song finished you remember that we created a function just few seconds ago finished great so this one should work so I'll drag it to the end and I expect it to play the life is a dream because that is the default next [Music] okay let see and explain life is a dream so but if let me just say look it and see sorry it started playing again by now still playing life is a dream let me Loop it again and see still playing that so let me now play it randomly and see did I click pause somewhere okay it's now [Music] playing okay now it's playing uh Christmas let's see now it's playing the raising me higher so the random also works and now our app looks more professional I forgot to bring anything here to control this particular Behavior but but if you want to do that you can add one button maybe anywhere here or maybe to this playback anywhere you te fit and then you can connect a function sh that if the person clicks on it or if that part you can make it checked like this that one can easily be done in here so you see this particular button here you can now come and set the checkable properties to true and that is that will do it so when you do that then you just run the pic5 command again you will have the buttom showing and then you can now keep track that if the buttom is checked like we've done for these ones if it is checked you can give a global state to keep track of that also so if it is checked then when the song gets to the end it should go to the next song other than that to just stop but it shouldn't go or like you should call the um song finish function something like that uh but I wouldn't be doing that for this video but I hope you get the idea trying to to bring up so now we have all these ones down here sorted out the only thing we have to do on this page is to create functionalities for these two buttons and also these two buttons and uh for the favorite and playlist yes we have not done it because we can only do it when we get to these places I just want to do it one step at a time so that we don't get ourselves confused but if you have not liked the video yet please be sure to smash the like button and share it to your friends who also might be interested okay so what we have to do next is the songs that are removing and those ones that should be quite easy to do let's come down on the same indent yes okay so move one song and then we will call it remove selected song for this one as always I'll try except block to remove selected song error and here what we want to do is current index now equal to sorry this one we need the index so s do loaded songlist widget do current R and all that we have to do is to get it off the list that we have and then from the list widget itself so first from the list widgets s dot load songlist widget do take item that is how we move an item from it and we can say current index and then we can now also pop it from the listel so that will be songs do current song list. um current index so this remove it for us and then we can let's work on the remove all songs also because it should be very similar to this one just that whenever I copy paste I don't know why the invation goes off so this one will be remove all songs as you have guessed let's make the English right so this we don't need the current index so all that we need to do is to clear all of them so you let me just type it have do loaded songlist do clear and then s dot current no songs sorry songs. current song list. clear but there's one very important thing we have to do before we clear this ones we have to stop the song because we can clear it and there will still be a media in the memory of the player for you to play so what you want to do is to stop the song first so s. stop song before because if you clear everything you don't have you shouldn't have something to play yeah okay so that is it also so this one we move selected move all songs not selected all songs error sorry okay let's see how it goes now we have to come up here and do our connections it's still on the default page so we can put it down here Reserve do delete something how delete selected BTN Yep this one let's confirm the name yes delete selected BTN dot click do connect want it to connect it to Ser do say remove one song remove selected song Yeah the code is growing larger beginning to just forget things that we just did a minutes ago so this one will be think be delete all songs BTM this one will be remove all songs Okay so let's just R it and see bringing a and then make a selection feeling happy it's gone take house Vives is gone and all of them are gone but this of course is not the way we should do it because what if the user was just testing the functionality without any intention of removing the song so we can put some checks uh maybe a popup asking a question if you want to delete it or not before we go ahead and then do that so that's our app will be professional grade as is supposed to be okay so what we want to do first is to check so if self. loaded song list widget do count is zero that means there is nothing in there nothing has been loaded app has been open fresh or something like that we can now say k message box the first time we using this thing here Q message box do information to show the user some information the first that we have to pass in itself and then the second is the title of the the window that should come so we can now see that uh remove select s and then the next is the the message that we show in that particular small window so now we can now see that uh playlist is empty okay so let's test out the remove one and no no no no and when after that then just return it's very necessary so let's test this one out so we know that uh playlist is empty and that is great but if we have some in there that and then this one around it should work take out okay you have guessed right this same thing should be inside the mo all songs we have to check those ones also so playlist is empty but this place we also want to just give some small caution to the user in the case where the playlist is not empty it shouldn't go ahead and immediately remove all the songs so we have to show a question to the user and then if the user agrees to that that oh it's not a mistake I was not testing the button or the functionality I'm just deleting everything then we go ahead and then delete it so that one this is how we are going to do it let's just call it question you can name it anything I just want to name it so that we the code will be readable question equal to Q is a same Q message box but this one we asking a question so as always and then the title here should be remove all songs disadvantage of copy and paste move all songs okay so change that one also and here you can see this action will remove all some from the list or something like that and it cannot be reversed uh if any anything like that let's just cck the back slash and or you can put what by English you want to put there and that is what I want to tell the user and here I can now say continue that means if you want me to you want me to continue that will be the question so we can come down and say that if question equal to equal to sorry that this is not JavaScript Q message box Q message message box do yes if I CH yes that is when we want to do these things other than that it will not even do anything so after passing these things there's another thing that we can pass which is the buttons that should appear on the this popup that is that is showing so we can say k message box do yes separate it with a pipe and say k message box do cancel and then if you want to add more you can add more let me show you so you can say Q message box do no but you bring a comma after everything that you want to add and then the default that you want to be selected so that in case the user presses enter uh what should happen because one of the buttons will be selected by default be Focus so when the user hits Enter key what should happen so we just want to save the user from removing all song so we can just see that now the default is K message box dot cancel as long as it's not equal to yes this one will not work so let us try out this particular one also and before then playlist is empty now playlist is not empty I click on it it says remove all songs this action remove all songs from reest you see that the default is what I was talking about now we have yes no and cancel I can click on cancel or press enter because it's selected by default but if I come here and then remove the the no I don't I don't even know the function of it over there and the low songs again is it that the no did not come so if you want to add any buttons you can do add them I forgotten all the button that are there but you can test it and see and say Q message box dot usually using pyam or any editor should give you all this popup see the buttons that you want there so aort set there are many buttons that you can just go through them and all that so they should go now it's it's okay so let's see what is left now here to do I don't think I think I think for now what we have to do is for this page is done except this add to favorites and add to playlist so now let's when we click this it doesn't move us to the playlist page it's still at the song list page so let's create the functions that will move that will help us navigate the different pages the first one will be switch to favorites and and the name will be the same thing so switch tobr and it's so so easy SC s do stack widget that is the name of the widget that houses all of them do Set current index Set current index 2B the favorite is the is two it uses the same way that python does the indexing so this song list that we see here uh the index is zero this playlist is index uh the playlist part is index one and this is two for the favorite what you have to pass in here is two but if we go ahead and this is redundant duplicate this so knowing that I have to be the tabing again and this's place switch to playlist switch to playlist let's just add the word tab so that we know that that is what we are doing so s to tab okay and what we want to do is the playlist is one okay and then the default page so that is you can call it the song list T so uh switch to song list tab release tab favorite tab see to let's just make this one s star and this index should be zero let hope that we've done everything right okay and then now we have to now connect these functions to the buttons that are handling them where our connections our connections our connections still on the default page which is the song list page that's what I mean by default page here this one was the name song list BTN list BTN and then favorite BTN so sell. songlist BTN do click. connect to S do switch to song stab this one and then we can duplicate this this and then say playlist BTM I'll will be switch to playlist Tab and then this one will be favorite BTN switch to favores no switch to fav tab okay so let's see if you can successfully navigate now if I click here I come to the playlist that it's rendered itting I can click here go to favorite and that is great okay while we have gotten to we are coming to interact with the database we will use the default uh SQL light database I will not be using so think we going to install the SQL workbench or post SQL the PG admin and those ones we use the SQL light and so I let us create another file sorry if it's becoming plenty this one we just call it DB functions I can spell functions right theb functions I'll will add it later Pyon and this is where all our dat database functions will be because all the things that we are left to do now is interactions with the database and I will recommend that you get a particular software don't worry if you don't understand SQL if used SQL before I will explain every step of the way and yes so please search for DB browser for SQL light that is a software I will be using to uh view the database because I want you to really understand what is going on and so if you count you search it you you see the first link should look like this when you click on it it should take you here in the downloads look for your operating system and then do the installation if you have another app that can view SQL light files to find you can use that one but this is what I will be using and so you can also do that for now we don't have an the database file here so what we want to do is no we not we will not create it manually it is a code that will create it but I'm looking at how we can go about it I think we should have aad of leaving the file in there let's just create a directory call it DBS so this is the folder where our database file will be so this is what we want to do we need to import OS here we also need to import SQL light SQL light 3 it comes with python you don't have to install anything the only thing that you have to install was the pt5 and the pt5 tools and so let's just create a database directory the reason I'm doing this let me just finish it before I tell you why because that will make more sense PA Jo I want to get os. get CWD and I want to join it to DBS which is the directory we just created and then we can now see that app database is equal to os. path. join noce link join we want to join database directory to what to the name of the database which I will call appcore DP dot sorry. DP so whatever name you want to give it should be this and then this is the extension is very necessary make sure it's count so if you are calling it any different name apart from appdb that is fine but just make sure that you add the extension the DV good the reason why I didn't just pass this in as a direct path but like this is that if you package your application someone know probably something that you can you be willing to give to your friends to try out for you because you've done really really great because look at application you are building when the the system they are using defines path in a different way you may maybe use uh maybe slash DBS slore blah blah blah blah blah what if some of the parts actually use this box slash so if you use it hardcoded you may fall into trouble but if you do it this way the program will look at the systems style and then use that one for you so you should be safe all the time so the first function that we create here the comment will be create the database or a database table and you understand very soon and so the function is Define create database all database table shop and then it will only take in the table name here I want to restrict it to a string okay this is how we do it so you can say con C people usually use C and all those ones but I just want to make it connection defines the connection says SQL light do connect and then we can connect to app database what this one will do is that it will connect to it if it exists and if it doesn't exist it will create it so on the first instance when we run the application to create a database but for other ter that the database exists that we have not deleted it it will connect to it so that is why the function's name is create database or database table so I've explained the create database part let me explain the database table part and so we can say ker equal to connection. CER you know usually when you are using database uh like my SQL workbench or so you will be using your K to be clicking things around think of the K here that we are creating like that particular K you have to moving around and clicking buttons but this one you are not there to do it so you are employing this K guy to do it for you all in code you can also see K do execute so we want to execute a particular SQL query and for now usually bring three double quotes and let's see very soon we open the database up and then for now we don't have it so let me just type it now and I will explain so we can say create table if not exists sorry exist so to complete and then I will pass in the table name here sorry sorry sorry sorry table name as soon as I hit enter pyam added the F in front it should be an F string I forgot at first make sure it's an F string and then here we can want to create a color it look like it like an Excel Excel sheet so the database will be stored the data will be stored in kind of cells should I say so and then the column name that we want where our songs will be stored so the column where all the songs will be sted row by row we want to call it bring it open and close parenthesis and then I will call a song for that particular column and then the data type should be text so we python we say like a string this one will not be a number it will not be a blog or anything it's just a text so RW text like we are typing and then it is good practice that after we are done what you are doing we now have to connection do commit to uh commit the changes to the databases like saving the changes if you don't do that it will not save and then now we can say connection do close so that we prevent file Integrity errors in case the database file is being used by another application like you be seeing here okay so now that we have this now we have to come into our main.py file and then after globals we can do something here we can just say database stuff something like that appropriate name and then we can now say create data or database table and now you know you can pass in the table name here passing favorite and that is because this our favorite and let me import it so Pam does it for me if your it's not imported sure you import it and that is because uh I think I didn't explain that part well so when the app creates at first the database is fresh our favorite T database table should always be there because you be adding songs to favorite even if you don't want to add it should be there for that purpose and so anytime that it it runs the app it checks and the database is created it also checks if the table is not existing if the user has used any other software to delete it it should should bring it back because if it is not there to throw errors in our Cod when we going to run faite functionalities for now now I see my DBS has no file in there when when I run the application close it now there's something in there which is appdb appdb DP so let me open up the database the DB browser software quickly then we use how we see how we can use that one this is the DB browser um you are probably seeing the light team using the dark team just custom cized it I think it should be at view I did it somewhere maybe I've really forgotten where I did it butuh I think it's at preferences uh application style dark style yeah I like the dark team and then we can open a database here but let's go to our directory where our DBS is here I want to copy this file part for easy navigation and then click on open database paste it in go now it's here and you see that there's a quick statistics that you have one table called it has only one column which is song and that is great and if we come to the browse data tab here we can select which table we want to browse the data from and then we um use it here so for now let's let close connection to our database it is good to know that the database has been created and then there's the table in there so what we want to do now is to we create the function to add a particular song to song to favorite so that we see how it appears in our database also but before we do that inside our DB functions we have to create function that will handle that so that should be okay so add song to database table I didn't correct this database table here you taking the song which is a string we also take in the particular table which is a string by the app database app data no no no no no the database sorry the database keep on forgetting the a the database should Beal to the app dat base okay and these things will be very very close to each other so permit me to copy comfortably place paste it here this is this part that we change so there a cute we can just get rid of this and then what we want to do here is say insert into and this is uh this is a the SQL the language to interact with the database so is just very close to English more simpler than python itself so insert into and then what you want to set the table name you give it here of course it should be lower case we insert into table oh I was expecting the to complete to do it for me let going do it myself insert into table and then what we want to insert into the table after this one we just say value course there can be multiple in insertions but this is a singular one we want to insert and then we bring this open and close parenthesis and put a question mark inside and let me explain it if our file or our database had maybe three columns we put one two and maybe three separated by comment you get what I'm trying to me we would have been putting them there but because this is just a single column call some you just be inserting one and this is of course also the thing we are inserting but after this string we have to put a comma here and tell the database what is it that we are inserting we are now we've told you that this is the data that is coming but to which particular column or sorry this is the table that should that's the T table if I should come in simple terms this is the target table but what is the data that is coming the data is the S but you have to put it in a tle here as a song for the Caps song but don't forget to bring a comma afterwards so that's the SQL this is the parameter so SQL the code that the database will understand and this is the parameter that is going in be careful to bring bring this comma other than that you get a lot of Errors it is a single file but you still have to treat it like multiple or something like that so that should do for us you commit you close y back inside our main down here let me just say um favorate functions and this one will be add song to favorite okay that always wants to format my code for me I don't know why I like to click on it all the time and so we can just call it add song to favorite so DF add song to The Great and here you have to get a particular song so the current index so add the song to cover it we get a current index so sell. loaded songlist widget. current row and then you say if current index is n you can be adding things that you have not clicked on if current index is none that means the user have not checked anything but it's just click on out bre then course you can right click on some place where there is no song and then the person use out so we want to prevent that so K messagebox do information you can make it a warning too but I don't think I would use the warning yourself and then here we can say the title will be add songs toes and then we can say select song to add to you should select the song and then as usual we return so that we break out of this particular operation okay but if that is not the case then we want to try and then here we can say adding song to favorite error okay here we can just say that the particular song we have gotten the index already song equal to songs so songs dot current song listet and that particular index get out that particular song at that index and then here you can say add we call it abon to database table I think so you can see here that s equal to import it for me be sure to import that one so you can see the S equal to let's be safe and pass it here as S and F string and then we can say table should be equal to faites yes so this should do usually if it is sucessful you may want to show some info here information maybe let's convert this to an F string and say. paath do this name song Oh what is this was successfully added two favorates so that we know that operation was successful um this is not a button that should be handling this request this is not a button this button will be handling the request of adding the particular playing song to favorite but for now that we don't have the context or the popup menu to select the one that we will actually use the action let us use that button for now so now we will come away from uh the favorite let just keep it favorite so that you know that you're keeping track of you're looking for something you just find it easily so sell do even though it's at a default page um okay let me put at a default page but the button here after this one so s do the name add to five BTN do click do connect we want to connect it to self. add song to favorite yep so let's just test it out and see and we can verify whether it was added by viewing it from our theb browser app a very happy Christmas app to favorite a very happy Christmas was successfully added to favorite we will confirm it um maybe you like it that way but seriously I don't like it this way that's every time I have to favorite this particular thing should pop up so I just show you that it can be done I'll comment it in case you need it from the code to be on GitHub but I don't like it that way so let's me load more songs just want to add plenty things so that you can see have to favorite I to favorite I to favorite I to favorite more multiple times at for okay now let's come back open database take that back intelligence come to this browse data side and voila you see that all these ones are there let me show it so is there they have been added I intentionally added the feeling happy multiple times so now that we know that we can add to our favorite what we can do is to now load songs from our database to our fa St okay so let's see how we load those ones usually it's advisable to close the database especially when you're going to use it elsewhere we don't want any file Integrity errors in case any modifications has to occur it will not allow us so that's one to we have to come to the B functions and then the function to get all the songs from a particular database table or we should just go ahead and then write all the the B functions I'll will be explaining them and then we will not just be switching between files that will save us a lot I think so yeah so now we can add toate create database this on Okay so the next one that we want to do is so the one is uh want to delete song from a database table so we want to delete a particular song that one I'll hold on to it for now because I want to show you some SQL trick the problem and a solution and so we can go ahead and delete all songs rather first delete all songs from uh database table okay the same Bo St so permit me to copy and comfortably paste it here so Define delete [Music] all songs from database table or something like that and this one to we need a table which is a string and then the database which will equal to app database and so I me paste what I copied connection is the same but here we can we just have to say delete from we don't need we don't need this so say delete from and then the table name comes that is all we have no parameters to pass okay okay and this is this will delete all songs from the database table for us the next that we are working on is to fetch all songs from a particular database table so since they are almost all the same let me just duplicate fetch all songs from a database table and we will still need the table and then the database and we will this one will now be select and the column name should come so select the column name excuse me should be Su from then the table name but how this will come is it will bring it as a tuple of Tes so this is how it will come a list a big list sorry of T orle of tle something like that but in any case looks like this so item and I think it's the index or the rule or some kind of ID but that is this is how it brings them and for us but I forgotten the second second thing here but this is the item that we are looking for then the ID or some index or rule will follow so we have to Now find a way of getting only the items into a particular list and we use a list comprehension for that so we can say that now um songs should equal to or let me say song data so data should be equal to k. fetch all all of them for us and then now you can say data equal to confer so S zero sorry one of them is missing for song in song data so as I show you the structure that will F the first item for every item in the song data and then we can nowain this data after closing the connection so return data so that will come in as a a single python list and that shouldn't be a problem to work with now we can there's a place where we also get all the tables in a particular database especially when we are creating a new playlist We I don't want have to really come back to this file again so let's get that function also done and that will be get all table in the database and will Define get um playlist tables because we only use it for the playlist so we can just name it like that and this one not even taking anything and if you are actually giving this app database I don't think this particular database necessary yeah plus it's just redundant we are not using it for anything yes we don't need a database in you can call use that particular parameter inside but it will still be redundant so because it's just this file it's no to get it from but the usual things will go on so our connection will still be equal to SQL three and then do connect we connect the app database and then here also go to connection there's the execution that will be a little different so k. execute and in here this is how we write it this one we not fing from a particular table or anything like that in fact you should appreciate it more if I do some of these things in the DB browser now let's open the database and there's a place where you can bring a query Builder or something like execute SQL here so if I say select sorry select I just hope you see it clearly select star that means everything from um favorit and I think control enter should execute it for me of course because this place is this particular software you you may not really see the tup in T post stuff I was talking about but if you f it in Pyon R like that that is what you see so we see all the things here retained but what if you want the tables so that's one the synx is uh a bit different from this we just have to say select select star the same star that mean want to get everything but from SQ L LightCore master and then we can now say where type equal to table so if the type is table then get it for us so let's see then now you see that it gave us the favorite if we create any daming table inside there it will come back to live let's just try and see the database structure tables can we create a new table from here let's create table yes so let just call it dummy and then the field are the field let's call it name and that is all so okay now we have two tables in there we have not written the changes to our database so nothing will happen at the front end for python but if we come back to our SQL and now execute it again that now we have two things return so this name is what we be targeting and then using in our program so let me rever changes yes so now when I come back I shouldn't see that particular table again and then so that is the syntax that will get us can copy it and then come back to Pyon where is it that we are getting just paste it in here safely and this will get get us all the table so you saw how it came so we have to now work around so tables equal to you saw that it came as a this one will turn if we are fing it R like that in Python to return like a tle of two each of these 1 2 3 four five 1 2 3 four or five one two three four five each of them will come in so a twole of two PES each twole represents a rule and each row has five elements in it and all that but we now also have to get it by a l comprehension so we can see table underscore name and you see that one was the second object so the second one so we can get it by the first index that's the name can get it by the first index so table name the first one uh for table name table name in tables so that will also give us just that particular oh I didn't get so okay let me just go table names should equal to kza fetch all and then this one should be table names great so this one will just give us a list of all the tables and it will be easier for us to work with in Python but you can actually see that this is a very dangerous uh potentially dangerous code so what you want to do is to wrap it in a tricept block so let me just paste this one in here so error getting table names but this exception will not be broad exception like this we can actually Target it like SQL light do arrrow so if there's any error you should just let us know error fing table and this one will have a finally and finally is that connection do close so whatever happens just close the connection for us okay but if it is successful then we have to return tables so return tables so that we can use it great and the next one that we want to do is to delete from a database table so no delete the table itself so delete uh database table that will come in handy when we want to delete a particular playlist because a playlist will each be a table in the database and this one we can borrow from here or something like that so Define delete database table and we need a table of course which should be a string and this place will be drop table and then the table name so drop table that is how we delete a table just drop table and then the table name follows that is it so we don't need all of this and that should do it for us and I wanted to show you uh s the delete one we didn't work on that one is it if we did if I should duplicate this no some gets confused between the py cham shortcut and the vs shortcut and so this is the delete all so delete uh how do we call it delete song delete song from from database table everything Remains the Same until this execute part I'll show you why now let's come back here uh hope we have not closed it yes we have not closed it we have to delete by the item name so let's also select uh everything from uh favorite and then let's run it see that we we get them here like this so is that's why I added a feeling happy multiple times is what I'm about to show you if I click this and then copy it here and I say delete from favorite sorry favorite and then I can say where um song equal to then I paste this one in that's if I write the syntax like this I want I'm telling the database to delete a particular song from this table where the song is this you have that's what you have to pass in because you're not keeping track of it by IDs that will be uh uh a little bit difficult but if if you want to do that you can do that you understand the database language but I just want to show this one also so if I run this query now and then let's say afterwards you want to select everything from faite so select star from favorite okay so let me select this line and then control enter it has been executed successfully and now let's run this one also can you see just what just happened it removed every instance of that particular uh item from the database so even if we right click on an index in our favorite list widgets that we want to remove as long as that particular index uh we will fetch the particular song from the song list if if there are five of them in there it will delete everything it will not use that because we use the song name not the index so that's we pass the song name in here and how we get it is that we get an index that has been clicked on in the favorite list withit and use it to fetch the particular song from the list and then use the list the value we get to delete it like we have passed in manually here but how do we go about it if we want to add a song multiple times to VI because may you just want the song to be playing for 100 times or number of times and we can work around that one so let me revert all the changes yes and then you will see that we have our feeling happy here is that there are total of 12 rows now so feeling happy comes in let me show you how we can delete without causing this particular trouble so delete from favorate uh the song is what we will C for now delete from favorite oh am I not coming back in this place we can see where row ID equal to we can open and close parenthesis here and then we can now say select the minimum of row ID this row ID sorry row ID comes in default because the database tracks keeps track of all the items placing by their IDs it gives it to them even though it may not really show it here but it does give it to them this is you can think of the RO IDs as these ones are the uh left hand side here and now we can now see from favorites and then see where song equal to okay I think I should be bringing things down to the next like so where row ID equal to this favor or song equal to this where s equal to this so let me try and explain again so we are deleting from favorite square instead of passing the song directly we want to get all the r IDs they will all be returned so to for the feeling happy that particular object will have the r IDs from 4 to 11 and so it will get all of them for us so we want to select the minimum from it you can actually select the maximum here also or something like that it it will also work but in all cases we are targeting to select only one value from it so if it should take the minimum to take the four from that particular favorites and then it will delete that one so it uses this to check how many rows have this oh I got five rows okay starting from where starting from index 4 to index 11 or index 4 to something and then okay then pick the minimum row ID what is it and it is four okay then delete the item at four so hopefully if did this thing very very right if I select this me terminate it with a semicolon and I run it okay execution finished with errors that means we have some errors in our code delete from favorite where row ID equal to select minimum row ID and this one was not supposed to be there apologies because it's not even closing anywhere so when we execute this it's still getting us some error so where row ID okay okay okay okay okay that one should be here but they should be another one that closes it here too yeah there should be another one that closes it here too so uh I think that in this case it really makes more sense so delete from row ID where and then which of the row IDs do you want to delete so row ID equal to and then all these things will will be executed so get this particular value all the row IDs for the value and select the minimum from it so now I think all the errors have been fixed forgive me for the errors and now we have execution finished without errors you remember the were 12 now let's run it again they 11 now if I rever changes yes and select everything from favorite we get 12 but if I run this select now we have 11 so now we've working around when there are multiple songs in the playlist in the favorite and the person just wants to delete one of them so let's just copy this and comfortably paste it here I think we can format it well here okay but this one will not be this it will be are we table without a song Impossible so song but the song will also be a string okay so delete from this is where the table comes in and then here we also pass in the song that looks good to me and I think that is all that we have to do here if any of them is Left Behind we come and do it but I think that is all so now let's work on the functionality to delete a database delete song from favorite if we have to do that then we have to Now work on the the popup menus or the context menus but for now let's just make sure that whatever we have our favorite can be loaded into our application so before the asong to favorite we can say load um favorite songs and then the function will be load uncore favorite into app okay and then favorite songs so we can say favorite songs will be equal to remember we created a function that says fetch all songs from database table that is what you be using so fetch and that's SC all songs from database table and then we pass in the table name which is favorite so be sure to import this fet all song This know how you name it from database I didn't bring the a s from database table P I'm quick quick quick quick quick okay has imported it for me so now this will give us all the songs and then we can now say songs do favorit song list wiet do clear because we be appending and why we are clearing it is that anytime we remove a song from the favorite we have to now load the favorite again back into the application so if there's already an existing uh list inside the list a favorite list wiget it it will not affect it the database will not affect it so what we have to do is that we have to now clear it and then add a new one that the changes will will be affected at the the user side that is why we are clearing it before or if I comment it out I think the effect will explain it better and then here we can say self do favorite list wages do clear list widget also do clear but we will comment that one to out for now and then we can now say what I want you to understand it well so for favorite in favorite songs we want to append it to the favorite song list reg inside song so that we can play from favorite if we want to so songs do favorites. append favorite and we also want to append it the list widget so self. favorite songlist widget. add item add item we want to add a favorite also so until we connect it or call it at the top there and we go to favorite we not see anything even though we have stuff in our database empty but what we have to do is to come up here when we have the database stuff is it and then we can call ser. load favorite into app that should fix it now you come to favorite see all our songs and immediately you know what is wrong so let's go down and fix it first is to where is it here so it should be where do path do base name of favorite and that should fix it and then they are all here we can scroll up and down also and yes that is it but you can see also from the finished version that there was some favorite icon here and you know how we did it for the song list widget so let's just bring this one down okay you know that you have to add it to a k list widget item which will take the Q icon and then we can go to our QT designer and copy the PA but for now let me bring this okay I think I forgot the shortcut let me just copy and paste it there okay so let's go back look for the icon it's this one copy path and then paste it in so this should work let's see and then everything is now beautiful like that sweet okay oh okay there's a there's a Buton here to delete the favorite so let's just work on functionality to delete samung from favorite and I you understand why we how to bring these things here so add song to favorite I think this should be very similar to the delete song from for I remove some favorite but I will not copy and paste so think we have one indentation in and then we can now say uh remove song from favorites okay you remember we had to perform some check to when we were deleting the items from so we have to perform this check again so that if it is empty don't just be woring the database with connection without any work so if this one will be favorite if it is empty say remove song from sorry [Music] favores and then we can say favorite favores list is empty then will return other than that we want to get the current index also so the current index which should be equal to self. favorite list widget do current row and then we can say if current index is none then the person has not selected you need something like that so we can just show a q message box here once again I'm sorry for the background noise occasional background noise some work is going on and remove some from this place will be select a song to remove from favorite okay the return okay we can keep it there other than that you want to do try it's a necessary thing so removing from favorite error and here we can now say song the song that we want to move down we have the current index at the top there so song equal to songs do favorite list wig remember we be playing these ones from the favorite song list wiget so you have to remove it from using that particular list and then we want to get the current index we have a function here called delete some from database table what is it yeah so that is what we use here just call it and then make sure I import it and then here the song will be song and then the table okay and because we want the the thing to refresh on the application we just have to call the S do load for into app so self. load fav load favor into app yes this one so that it will refresh so now what we have to do is to come here and it is still there so now this is in the faite stab so s dot let's check the name and pleas start delete selected favorite BTN so self. delete selected favorite BTN do click do connect we want to connect it to self do remove one [Music] song okay remove song from for this one so let's see okay let's let's remove Raising Me Higher is just one here or life is a dream the last one it is actually removed if I close this one out we are having an error our app just crashed and it says that you see that's why the try and accept is necessary it's a databas is lock and that is because you have not closed the connection to the database yet so discard back to our faor select the live is a dream delete you see that it did a refresh and then it has brought in the other ones again that is why we had to clear the old stuff from it before we bring in the new stuff so moove one song from favorite take us very close to that particular function you're looking for which is this one the load song from favorite comment to this side if I remove a very happy Christmas it doesn't duplicate the list necessarily can remove this one remove remove okay so now we know that this is also working let's work on the functionality to delete everything from the favorit so let be very close to this remove one song yeah right just go in by one tap okay remove all songs from favorites okay so we just check if this count is zero fine but we also have to POS a question to the user we don't need this current index we also have to post a question to the user just to be safe question equal to kill message box you remember we did some for the remove all do question passing s and then we can say uh remove we remove all [Music] favorite songs and then we can now uh see this [Music] action will remove all songs from favor and it cannot be reversed continue and remember we have to pass in some buttons yes so K message box do yes they not pipe and then Q message box do cancel but we want our default to be Q message box do cancel okay and if question if question sorry question equal to K message box dot yes then we will do this trying here so let me just invent it in and then moving all songs from favorite Arrow this current index we don't need it you remember there's a function here called remove all songs from favites wa Rel all songs from database table this one is what need so we come here and then paste it but that one takes only one which is the table name be sure to import it yes great and we should load for R into app yeah that's also that's also there so let's go up and then connect this this one also let's check the name delete off BTN let me close this close this we don't need it CL it's good okay s is it delete all favorite how can I forget yes is this one do click do connect I want to connect it to self do remove all songs from favorites this one favorites then our question comes no for the first time and yes and everything is gone now when we close the application we come back open the database and then let me comment out this ones and then run it you see that it's empty there's nothing in there this card what changes did we even do to it so now let's add a few songs to favorite because we want to be playing from the favorite song l so feeling happy want to Christmas once life is a dream Once Raising Me Higher once takech Vibes once and you go there and they didn't do that in real time for us why was so should be doing it in real time but was it added they were added why was not doing in real time it should come from the this function the we call oh no we didn't call it so that means after this place we should call S do load Fates into app so that we see the real time changes okay so favorite okay let me load a song here uh and see life is a dream I come to favor and I add life is a dream to favorite I that it comes in here real time and that is what we are looking for so now let's work on functionalities to get these ones to play we will now modify the play function where is it we should be Clos yes and here let's be save let's declare Global stop and say that stop this force it cannot be stopped stop made a mistake here stop equal to false okay because it should be playing and here we only have to check which of the widgets are we are on and then we we know what we are we are doing so if we on the favorite uh list wiget then it will be that one that we use for the selection and then the index into the particular list but if we are not on the other side then so it's only this part that we have to cut for now and then say that if self. stack widget dot current index am I writing something wrong here current index um let's work first with the song the song list with so that one is the first one so and then we know that this is how we supposed to go okay we can now say a leave self dot stack widget and do current index equal to the playl is one the favorite is two so it should be two then let's just paste it and do some modification then the current selection is not this it is the favorite songes current row and then here we be indexing to favorite song list also not that one so this one should fix it for the play for us let's see if we can play from our favorite directly so let me just pick a very happy Christmas because it's close to [Music] Christmas and you can see that it's actually playing the song and yes you can now play my but because you have not configured it for the best and previous I don't think that be a good thing for us tode here Al make crash so let me pause play this one okay so now we can play from that one let's work on the nest for the list also this function should be close Okay so for this one also we need to copy it up to where the URL is this one and then if self do stack widget do current index is zero sorry not o zero then we paste it because that's what is happening the default one a if so dot stack widget. current index equal to two and let's paste it it should be similar but with some small changes the current media is still the same the current song Ur is still the same and then the current song index will change this one will go to favorites and yes the next song index will be the same but this is favorite yes this should work let's see so let me play Christmas [Music] next uh is playing life is a dream but it's not moving the this is Str it is plain it correctly but [Music] working oh and that is because it is your favorite song list wiet favorite or something like that yeah shouldn't be the actual songet yes and so this one should work now yep and now the changes are being effed fantastic but there's one more thing uh you realize that when we're playing from the default this place so now we be playing a lot from our favorites and I go next next next next next you see how it's ROM randomly chooses we want to be able to move to the first index when we hit the last one so we have to just modify this code a bit just a little bit uh do we have to modify the shold nest also yeah I think we do so let's just work on the shuffled Nest this Loop n will not be affected so for the shuffled nest also up to where we get a song URL we can cut it up here and say that if uh self. stack widget do current current index equal to zero should be like we did before and if that is not the case we leave self. stack widget do current index equal to two then let's paste it and have the modifications okay okay okay okay I've realized an error in the first one that we did let's do let me correct it here then we I'll show you why you remember if we set the what is it see this one we are setting it here we are setting the current rule here but what if we are playing from the um the loadest song list widgets that means we not be able to set that one to let me show you exactly what I'm saying because I'm setting it down here now if I load a song here I'm very sorry once again for this background noise you see I'm going next but is not changing that's because I'm setting it afterwards so let me fix it here then we will come back and do it so so now after this place I can say self we just set that one inside here when it is the song list wiget but if it's the favorite set the favorite list wiget but I don't think we have to do any modifications to this particular file at this time so all we have to do is to come back here and fix our error so after this we can paste it in and then we can get this cut it from here and then paste it in here great so this should fix that particular error for us and also we want to work on the when it gets to the end of the queue what it should do nextest so for the shaffle nest we don't have a problem with this so that one is only the default nest that we be working on in that regard so let me see where is it so we get the song index we get the next index okay before we just add one to it let's see we have to check we can say if s index + 1 is equal to the length of song dot I think it's current song list widget current song list forgive me then next index nextore index equal to Z else next index next index plus song index plus one so this one checks so if the index you you know that the index starts from zero but the length if I have a list of five items and I I I ask python for the length it will tell me five but if I ask it for the index of the last element in that five member list it will tell me four so that is what why I have to add one to you so that it can work that way so if it gets to the number four to actually know that it's at the end index four which is item five and that will render five here and this check will render valid so if that's the case then next index should be zero then use it here if not then just have to increase it and I think we can do the same thing here rep place it with this one yes so by this one will be favorite don't forget sweet and so let's you remember that the previous also has it where it's previous where is previous previous previous okay so previous two has it let's just paste this one here by the previous we have not actually worked on the this will be previous we have not worked on whether it's in the favorite list or in the defa song list so let's work on that one and I think it will be up to this point can cut it and say that if self. stack widget do current index equal to Z which is the default then paste it in a leave self. stack widget do current index to two then you can paste it in by I think you remember um this should be minus one and then this should should also be minus one now this one will be different we cannot just be pasting this one there the previous will be different so for the previous it will not work this way so if current song index is zero you let me delete it we have to check so if current uh no we made a mistake we deleted something is not supposed to delete so this is it so if song index is zero then we want to say that the previous index should now be equal to the length of the S the list so songs dot current song list so if the index is zero then the previous index is called to the length of the song list widget and remember that we have to subtract one from it because if it's now output is in zero and then it wants to go to the last item on the list if you take the length it will give it to you in a different way that the index works so you have to subtract one from it to get the index that can work well with the list widget other than that we can now say that so else previous index previous index should now be equal to uh song index minus one yes that should work so this is how this should be apologies for the first one have repl it here okay so this would work and we have to set the current rule separately like we did for the first one so this one will be the default yes we loaded song list with it and this one will be list widget and they should take care of those ones for us so let's see what we are left yet or left to do for the favorit we have done all these things then we work and then we can um play a song of course the the pause and un pause works I pa it to go stop stops it by the stop there's something else that we have to do we do it very soon now if I play I'll go forward um the previous seems not to [Music] work oh disadvantages of copy and paste this should be favorite so one here too that one should be favorite list with favorite song list and this one should be favorite so be sure to CH change all of them be sure to change all of them other than that you also have the error so let me play previous and it's working so we see when I stop the song it stops but these things still remain what they are and that is a very bad thing so we'll be looking for stop song it should be here here self. player. stop and then self. music slider do set value you set the value to zero so I go to the the beginning and then s do time label do set text want to set that particular text so so I just like to use up strings so that would be 0 0 0 sorry and slash just to set it to default and then for the remember the song names that we set up there so that would be self dot current song name dot set text want to set the text to song name go here and then we do a similar one for the current song path so that would be current song path and that will be song path goes here okay that is great now that should fixed it for us let's try it out and see so I'm expecting the slider to come to zero and then everything else to go back to and it did work that's great and so I think now we have to come to the playlist functions uh we done with all the favorites at least for now yes we have we are done and the rest will come and right it later when we bring in the actions we are doing it one step at a time so on there we have seate functions and then here we have the playlist functions the first thing is to try and create a new playlist so create of course it's to put it in a tricept block so creating a new playlist error and then the error will come you know we have to now check if the playlist already exists then you cannot create it so we can now say existing equal to you remember we created a function here called get playlist tables here this is what we'll be using so get playlist tables calling it be sure to import it okay get playlist tables and then we remember there's a small popup that came that you can type something in and then get the written the value that comes so without name this one to rains a second that you are not really interested in you can print it out and check what it is and so that will be QT wiget then we have it we just just import it we need dot um Q input dialogue this one do get test so it's a dialog that will pop up you want to get the test from that particular dialog yourself and then that be the first parameter then we also want to get the title that will show can say create a new playlist and then the see there it will be like a a line edit or like a form field or something like that and so I can now see that the prompt for the user to know what to do is enter playlist name why is the self angry at but why am I even creating a function without the Define okay so Define newcore playlist and it should be in there how did I manage to do that okay so this will give us the name also and we can say that if name equal to an empty string or should be even more careful can say name dot STP the person the person just hit the space bar multiple times you can still get it so that means you didn't type any name that be K message box do information self and then can see name error and the actual message be play list name cannot be empty okay and then afterwards we return else if name not in existing because if the name of the playlist exists you shouldn't be creating it again so if name not in existing then we want to say we have the function there create database or database table some like that the first one yeah this one now we are using it again create database a database table and then now we have to pass in the table name which is the name that the person typed so that should create a database table for us which is the playlist Remember that creat a column call songs and that is what we use we have a function to load playlists so s. [Music] load playlist that should the fun that's the function that we should write and let me comment it out for now so if name is not inexistent that is what will happen but if the name is in existent and the person still wants to create it then the person wants to overwrite the one that is there we can give the person chance to do that so a name in existing we can through a caution I think we can get a question one of those questions from here but this one we name it caution and then this place will be replace playlist and this action will um no no this this is not this should not be the syntax so you can see uh playlist with name yeah name I was trying to play SM with Pyon but it didn't give me the F so I have to bring it here myself with name name exists so already exist do you want to place it so in that case the user wants to replace it and yes our options remain the same maybe you can put the name in double quotes if message is yes then we can or the person chooses yes then we can there's one function called delete database table it should be down there this one you have to first delete the table the table name in this case will be name because they will be the same and let's be sure to import it so you delete the table the database table and then we want to create database or database table which and again we will create it as F name okay and then ourself will load playlist should be here again okay that should do and so let's quickly create that function the self. load playlist it should be the top let's see so load playlist into H find so loore playlist oh it shouldn't be shouldn't be that that way you find this at s will come in here okay so all our playlist should should be equal to get playlist tables remember that one and then playlist do remove I want to remove the favorites from it but it's not part it's not part of the users playlist it's a default one so self do playlist list wiget here do clear you understand why you should be doing these things the clearing and then after that we can see that for playlist in playlist and this one to you add an an icon plus the playlist itself so I believe that we've done it two times so I can type it straight forward without further explanations so s do play let L reg do add item and that will still be a k list wiget item the first one being a k icon which we copy the PA and paste soon but this one we are just placing the playlist inside just like that so let's get the icon from here think it should be this one which one I think it's this yep copy it and then paste it in there so that should do it for us yep M anytime we need to to load it for us so let's come at the top here and then connect the new playlist and we have another one yet no let's un comment this and then let's un comment this one too so we can come up here and just as we call the load playlist into app let's call the self. load load um playlist and for the connection let's create one for playlist the serve do I think it should be ising new playlist ptn yep it should be this one do click do connect want to connect to self do uh we will call it in something new playlist I think it's this one yep so this is it let's try it out and see if it works we should have the database table let's see let's see first if we have closed closed the connection and so playlist side create new you see the popup that came this we call test we press enter and then we see test here with a beautiful icon fantastic so if if we close our app and then come back here open database you have more than one table now if you browse the structure you see the test is already there great so let's close come back here now we know that that one is working and so let's go ahead with the rest of the database functions that we need to do okay so now let's work on the deleting of a playlist so delete uh play list which should be so the particular playlist that we want to delete should we go to self do playlist uh list wiget this one dot current item yeah this one not the current the current item do text because we want the text not the not the index so this one will give us the text of whatever is in that particular line of the list wi it so in this case if the name of the playlist is test to give us TST as we expect and then I'll try because it's necessary and say maybe deleting playlist error here you can just say delete database table and then you pass in the particular playlist so we test so we don't have to convert with strings strings strings and this one to have a finally whatever happens we want to self. load playlist so this one will delete a single playlist let's work on the deleting of many playlist so delete all playlist and then this one we should still get the playlist all the playlist and see let's see we got all the playlist and then because we need the Nam to delete the database from the database we using this function because we still need the name so uh Define delete all playlist okay and then we can now say playlist equal to get playlist tables and then playlist do remove want to remove the favorite favorite okay and then after we remove the favorite we want toat this one okay I remove the favorite what we want to do is bring a caution I think we already copied that one somewhere know should be in my yep here so yes still be caution first we want to caution you that you are doing something that is irreversible so the caution will be delete this one delete your playlist so delete all playlist and this action will delete all playlist Del will delete all playlist and it cannot be reversed continue yes or no or cancel so if that is the case if the question is yes you want to try we deleting all playlist Arrow other than that we want to say for playlist playlist in playlist delete database table playlist so it will just look through and delete each of them one by one and as you have guessed there should be our finally block here load playlist y that should also be it and let's see how we can add a particular song to playlist a playlist well I just want us to create all of them then we will do the connection that will be faster but I'm hope I'm explaining things as these things as they are supposed to be explained so add a song to a playlist okay uh you remember in the demo when we are adding a song to a playlist uh what we call a drop down if you are coming from web development or a combo box if you are this python time from T this place I think is also called a combo box but in web terms it's a drop down that contains all the existing database favorites so we have to get those ones and then let the user select which of them you want they want to add the songs to and it's quite quite easy so we can just say options equal to get playlist tables this function is really helpful and then options do remove remove want to remove favorites because person always options the person wants to add it to the F use add to fate rather and let me let me skip that part or let me let me do it options do insert at the zero position this particular string which is click to select it I'll tell you what it does but let me comment it now you can leave yours un commented and we can see that playlist remember how we got the particular playlist here where is it should be somewhere close here yeah this one let's copy this up come back and then paste it in so instead of name this will be playlist you in put dialog. [Music] get item rather they should be get item not test and then self yes and then this will be add song to playlist and here will not pass you can just say choose the desired playlist and you know we have to pass in the options also so we can say options and then editable should be false you don't want that to be able to edit the content in there Y and so so let's see and so for this one let me connect it here I know we are skipping ahead of it we wanted to do everything at once but let me connect it and then so that will be self do add song Sorry add song to a playlist it should be a button or something no let's see okay that is an action so what we will do is that we will link it to the load selected now then we will change it later so load selected playlist BTN do click do connect to self do add song to a playlist so that you see how the popup comes and I'll show you what I was talking about or if uh what is it I click on this thing now you see that test is the one that comes first I don't want it to always be so so that's why this uh it's inserted so when this is inserted this is how it will come so click to select then we now can select test and that is I think this is really cool and so once we get it now you have to perform some checks so if playlist equal to this click to select here that means the person did not select anything let's just make sure that everything is as exactly as that then it means the person did not select anything so we can Now show some info Q message box do info and it be add not s add s to playlist and we can now say no playlist uh was selected and then afterwards we are not adding anything again we can just what is this one doing here we can just return other than that that means if there is some selection then we want to do with the tricept and here we can see that current say uh index should be equal to self do loaded songl reg no loed songl current row this how we need a current row and then the song should be equal to songs do current song list we want it at the current index and yes why we are doing this TR and accept is if it doesn't work we can show an error here instead of the uh printing the that means this place there no song was selected so we can just say no song was selected Ian the person just decided to trigger the action without selecting the song so you can now say unsuccessful or something like that let no song was selected great and then after that we want to return I can just bring this one up just to save a line and do same for this place also but if all the above passes then we want to add some to database table and then we now pass in first the song which is equal to song and then the table which is we got to playlist so select a song and then the playlist great and then we know that we have to load playlist into yourself do load playlist into app but if you want to also show a successful message like we did for adding the song to favorite you can do that but I don't want to do that here okay the next on the list is to uh now we have add a song to playlist the next on the list is to add all current songs to a playlist so in case all the songs that are playing want to add them to the playlist we can go ahead and then do that so sh on the same liation level add all current songs to a playlist for this one this should be very similar to this at least to some extent so we can just paste it in where is it after this return you need it but it's just a similar things we be doing here so that is it choose the playlist and of that if that is the case and yeah yeah that check is necessary so we can say that if length of songs do current song is less than one or zero that means that there's no songs loaded because we can also use the list wiget to check but we can also use the this list to check because when