 I'll do a quick one, I think my sound is still the second camera on, that's not a good sign. That means I'm using the wrong microphone. No, it's actually okay. The microphone is okay, close that. Okay, let's start. We are working on a new one. Not on the list yet, hopefully. It soon will be there. Still getting used to Linux. Okay, we need to possibly simplify. So we have this EEG, a music. So we want to turn EEG into music. There's a reason why we do it, it's not just a game. Well, it's kind of is. We're having a couple of issues. Then she was having a too complicated project structure. Yeah, we actually don't do upload at the moment. Okay, so we don't do upload at the moment. Leave this for now, dashboard. I thought my index HTML is the dashboard. How is this different from index HTML? So I had data folder. Data folder can be in static in it. In utilities, we have a filter EEG music conversion. Load data, what else do we need to do? Generate those to the dashboard for more interactive context. So EEG music and dashboard could display more detailed information about user EEG data. Okay, might leave it for now. Okay, index HTML. Now currently, we are having a problem in main.js. Probably have to regenerate it. It's now thinking forever. Right, that was quick. I don't know what happened there. Then with comments explaining each part. Okay, now we have a batch EEG data. Okay, but this one. Okay, main.js document. Event listener. Is this event listener? Yes. For the whole document, yes. This one's using batch EEG data. What's my actual endpoint? I don't actually know the actual endpoint. URL path for the flask route that serves the EEG data. Assuming you have flask route set up by the EEG data. You would replace if the actual route. For example, you have flask get EEG data. No, I don't have get EEG data. So this would call load data, would it? JavaScript fetch. Just give me... I won't be able to integrate the whole thing. Give me the whole main.js. I fixed the Python... Not fixed. I changed the Python code as expected. Speed, GitHub, Copilot. No. Select load. The utilities folder. Yes, that is correct. I think. Yes, this is complete. I'm sure it's better than what we had. So it will be main.js, is it? Yes, charges is already in the HTML, so that should be fine. Main.js. How do we fix this? Don't need to explain the whole thing. Okay, let it run. Orbit. See what it... Yeah, this bit we need to sort this bit out, don't we? It says so we need to do. It's not actually running. Okay, having an error. This is load data. We're getting the following error. Can you fix this for us? We actually need a function in there. I can pretend I knew that, but no, I did not. And returning data. Looks legit. Run. Using the yes. Main.js. They get data. Where's that... Get the gdata. Some error handling. Probably need to get this one. Convert data frame into format that can be serialized into JSON. Yeah, I had this problem before. Don't remember how to solve it. It's suggesting to convert two common protocols in data list to list or data frame to dictionary. So converting to dictionary or list. Which one makes more sense? Probably. Doesn't matter. How did I do this before? To list. In spectrogram. This is Python code. Yes, we did to list. Okay. Okay, go with lists. Get the gdata. Chat is not defined. Main.js. Why is it giving me all this? gdata.21. gdata. Sticklet. Button. gdata.21. I wouldn't know how to fix this. Main.js. Chat.js. New HTML. I'm pretty sure it's already there. Put. Main.js. I know it's not there. In header. Pretty sure we have that already. It's double check. Yes. Check of it. Type zeroes. Console log. Chat object. This will help you verify the chat. Chat is available. It's loading forever. Okay, it's showing something. Get rid of that about us. I don't know why it's there. Chat is loading, but not displaying anything. Script fetch. gdata. Console log. An empty array, isn't it? That actually has stuff in it. Too much. Too many. This is the 16 channels. The data is there. Yeah, I don't know what to pop this in. The chat configuration. It's a bit kind of a sediment. Whatever. Chat configuration. It's a simple array of values. Chat configuration might look like. Yeah, it's not as simple as 16 channels. That's also why it's loading for so long. The eGdata has 16 channels. Can we load only one? Should we make an option to have names? I'm not sure they have names. I'm not sure the channels have names. Can we check? And also display a first 10 rows of data. Yeah, we did this before for now too, but we'll do it quickly again. We need to know what the data structure is. Okay, so in Python, this is in load data. Print call names. eGdata. But it's not called that. Oops. Yeah, it's not called that, is it? Yeah, it's not called eGdata. It's just called data. Right, now we just have the numbers. Or just have numbers. And that time array. Yes, so in load data. Read of data for now. Selecting channel zero. Again, this thing is not called eGdata. It's called data. You should know that. Oops. Ctrl S. Obviously we're not there yet. Okay, just in channel script code. eGdata. Get context. eGdata. New chart. Line. Okay, data. Load eGdata. eGdata. Because it's now called something else, is it? Get eGdata. eGload. I need to do two lists again. That's working. Display about 100 and be able. We want to display, say, 100 points at a time. And also be able to move back and forth through the file. Through the channel data. Using a slider of some sort. Yeah, I wish I had a teacher like that back in school. And maybe I would love programming. Get eGdata. And load that. Select that existing code. That's the returning channel that I want to return. I want an option. I want an option to select the channel as well. But we'll go with this one now. What's the start? Don't have a start, do we? Load that. Oops. No, why? The front end JavaScript notification. I find the JavaScript input this slide. It's loading for some time. Don't need to display the eGdata. We'll need to do some sort of the training. E-training. What is the turn print error? Okay, we'll fix it in a bit. HTML over here. Some sort of slider. Slider can't be made wider. Wider slider. We want the wider slider. Okay, in JavaScript, update data. Another function. That does that. Turn fetch. eGdata. Turn fetch. Turn fetch. It might say loading for quite some time. pppp. Okay, there's a problem. Problem, problem. It's working. Why is it loading forever? This one is something wrong in the logic that it's taking forever to load reload. It doesn't sound to be played as you move this slider. So you can do like a dj thing. One more option to destroy the chart before creating a new one. Update the existing chart. I thought we'd do that already. Yeah, because I think it's called the... Is this okay? I'm getting... I'm getting there. It's going places. images. a document.com DOM content loaded. Okay, so we have there checked console logs. And there's this one. Right, so it's loading. It should be scrolling through the file. It's doing something. It just takes forever. It is scrolling. It is super slow. Yes, like this will work. Yes, that's fine. Yes, it's working just really slow. Can hear the CPU going. Can reduce, should we reduce the window size or something? Anyway, so we want to be turning this into music. Okay, so we want to be turning that EEG signal into music. But first, can we also add an input for selecting the channel number and also an input to change the window size. Thank you. It's loading forever to begin with. It kind of looks like the stock market as well, doesn't it? I think I know the problem is in JavaScript that the event should be changed instead of yes, this event bit. Let's see what the chgpt says channel modify html. Here we need some more inputs. So it's a drop-down list, isn't it? Window size default, we need a default. We have the data slide. It's okay. Channel selector. Yeah, we can have them. All the controls at the bottom, can we? All the top, all the side. Well, and why the screen should be on the side? On the phone. Well, yeah, it's a whole different story. After this scroller the data slider we have that. We have window size and the slider slider can change just format the document. Right? It's not updating, is it? It doesn't look like it's actually taking effect because we need to update the JavaScript. We haven't done it yet. So in update data we have just replaced that hhg. Start count Save channel as an import. Great. So it's still loading. It was some time to begin with. Should be different. We can hear the CPU doing something. Yeah, I'll need the training. Can remove the access there. We actually have another tool where you can review the data. This one specifically turning this into well, trying to turn it into music. That's probably a seizure onset. Yeah, there should be a seizure somewhere in the middle of this file. Could have much quicker. I reckon. GitHub co-pilot to the job. Ideally we'll have some sort of sliders, so it looks like a DJ set. For now, we're okay. Yes, there are 16 of them. And yes, GPT-4 could have done the whole lot. Only 60. That should be it. Let's reload this quickly. Change the plot. Any errors? Or is it still loading? Yeah, errors. No, but that's okay. Yeah, maybe it's slow because we're actually displaying the data points. Where do we do that? It must be JavaScript. It's what it's called a log something. Yeah, console log can get rid of that. Maybe it will be a bit faster. Getting cache security to this sending another get request. That's working okay. When I do this, it's also sending a get request. Chat. But the chat is not updating more. It's a bit odd. But okay. Okay, we need to do more stuff. Accept channel parameter. Channel parameter. So in Flask, now let's get now that's the definition of getEG data. So it should be now let's load data getEG data in here. Start count channel. Default channel zero. Channel eG data replace channel eG data is the same. Take your load load data count channel and select the channel time. And this is data not eG data. I don't know why it's getting confused. Considering it's wrote the code itself. It's still loading. That's also because I'm getting an error. Shouldn't be where it's that coming from. HTML, what's the problem with HTML? Shouldn't just select the default value when the page loads. Okay, I'm sure one of them already has a problem. Let's check check JavaScript page channel select then listen to this then listen eG eG data. Why do this? Do I have the now one like this back in the save cut to handle cases where channel probably might not be valid integer. Should be a valid integer. What's the problem? Let's do the HTML and this one select the channel still doing something quickly. Close this run it again three errors please undefined. Let's get eG data. I get eG data. We'll have to continue this next.