Live Stream #163: Toothpicks and Fourier Series

hello good morning afternoon whatever time it might be it's morning for me hi it's Friday something exciting to show you really quickly but well oh wait it's all assumed in anyway how are you I is my mic on my mic is on music is playing I am so excited for today's livestream because I'm going I have out a plan I've thought about it I'm not exactly prepared but I spent I spent some time on the subway doing some reading and watching some videos to think about what it is I'm going to do today and the first thing that I'm going to do has to do with this box of toothpicks could there possibly be what could possibly on the coding train related to a box of toothpicks you might be asking well soon I will tell you first let me do some housekeeping here and talk to you about what's happening for the rest of the year on this YouTube channel that you are watching so there are only two more live streams in 2018 both of which are happening next week and then I will be off for quite a while until January so I believe here whoops if I go to website youtube.com slash the coding train I will see first that I am streaming live and then I want to show you these two things so two things are set for next week on Monday at about 3 p.m. Eastern Time I will be coming to you live from not this room but from about five floors down on the fourth floor is the program called ITP that's the graduate program the undergraduate program is called ima these are both programs at Tisch School of the Arts at New York University the end of the semester show is coming over a hundred projects made by an incredible set of talented students from all over the world so I'm going to walk around with a my phone and somebody to help me an interview students and show projects so you can tune in for that if you miss it don't worry it will all be archived and I also will produce probably the whole live stream we'll probably be out two hours but typically after that's done I produce about a 20 minute kind of like edited compilation highlight reel of a bunch of the projects by the way if you have any experience live-streaming that might that and you might have some tips for me I'm looking into currently getting I have a gimbal I have a person who's gonna help me hold the camera I have a variety of different microphones that I'm looking at using but I'm looking at getting one of those kits for a mic that goes with the camera and a handheld thing and all that sort of stuff so if anybody has any experience or some things you want to suggest that I get that I could get between now and Monday let me know then coming to you next Thursday at about 10:30 a.m. in the morning I will be doing my annual processing foundation holiday telethon biannual I mean a second annual but did it last year sort of spur-of-the-moment last year I'm a little bit more planned this year although I don't actually have any topics in mind but I am looking for you to suggest stuff so let's let's move over here for a second if I go to and I want to come back to this in a second but if I go to one I don't want to import my bookmarks go away whatever if I go to github.com slash website slash rainbow topics I think I need to rename this repo not know oh no coding train coding train slash rainbow topics um this is a repository where I kind of keep a list of things of suggestions of things that I might do in a video or on a live stream and currently there are 800 77 open things look at this suggested four days ago tooth pick patterns toothpick toothpick toothpicks nice not a sponsor so I'm gonna do the toothpick challenge today but I'm thinking what I would like to do is add a label I'll go to labels I'm gonna create a new label I'm gonna call it holiday telethon probably be should be some reddish I like that green I can't hold on we'll get there eventually yeah that's not really very ah that's that's good so that's very dark but holiday telethon label I will so I'm looking for holiday themed coding challenge ideas for example one that I will most likely do next week is the Koch snowflake which looks like any of these patterns whoa I've never seen it done like this so we're gonna have to figure that out so this is something like things that are wintery holiday themed that's my plan for next week hey startup guy thank you for the super chat from India t other thing I'm trying to get working but I don't believe that I'm gonna get it unlocked unfortunately there is a YouTube as a feature called super chat for good which is a way of sending super chat donations directly to a non-profit 501c3 organization of which the processing foundation is one so I've been in contact with YouTube to see if I can get that enabled for my account for next Thursday but it's I don't know if that's going to be possible so just to be aware I'll be asking people if your if you have if you are able to make your donation through processing foundation.org slash support but anyway that'll be next Thursday and builds eat emoji and the chat asks you really came up with this video after smarter every day yes so I mean so I was had the honor was lucky to get to actually meet Destin at thinker con which was a conference that he organized a little while back in Huntsville Alabama and I've been obsessively tuned into his channel ever since and the Fourier series video I mean I also want to show and reference the three blue one Brown series on Fourier series which is also excellent and as something that I had tuned into quite a while ago and re-watched so I want to get started with that Simon tiger is taking I'm pronouncing Koch wrong I know I know I'm pronouncing it wrong but sometimes in life we just have to pronounce things wrong to get through the day okay now oh and smarter every day just said hello in the chat what up fourier peeps okay so this is what I'm looking for for next week your holiday-themed coding ideas I have purchased a new ukelele I purchased a new ukulele which if you can stomach your way through about an hour from now if you're still actually watching or two hours from now I might actually unbox I hear unboxing is like a thing I you know I'm of a mind I'm just gonna like forget this coding thing or just make unboxing ukulele videos but we'll see I'm gonna open up my new ukulele and try it out because I will be singing very badly next Thursday a coding themed holidays it's really a terrible idea but and as you donate to the wonderful nonprofit the processing foundation so I'm also looking in addition to suggestions for holiday themed coding challenges I am looking for your lyric lyric submissions of holiday music with coding lyrics and I had a bunch of them from last year thank you to me IMC and to me who wrote a whole bunch of those alright so that's what I have to say now one thing I want to do is I want to briefly before I get started with the first coding challenge I want to show some of the projects that the community has made so I'm gonna go to the coding train here the most recent coding challenge I did was this flocking simulation oh oh and I was recently speaking with Nicki case who is one of my absolute favorite internet artists ever if you do not know the work of Nicki case you should their work out but explore Nikki case reminded me explorable x' website i hope this is gonna come up yep here we go explorable explanations look at that does anybody recognize that that those are boys right there on the explorable explanations website so if you want to know how to code these this boy's algorithm you can go right here and watch the flocking simulation one now I'm gonna go to this page here and we have a couple look we have a bunch of submissions from the community so as you know as you might not know but if you watch where my coding challenges does that make your own version of it you can submit it over here um so I want to click through these there was also one that isn't submitted here but came through the comments I'll have to dig it up and find it somebody made a flocking simulation in unity which kind of like blew my mind so let's before I get started with the coding challenge let's take a look at a few of these so I'm gonna go here on this one I love and I'm gonna go to the full view of it what this one is here is the tasteful toasty love these internet names took my flock encoding challenge and combined it with my quadtree coding challenge this definitely gets a like a person in their 40s who has a train whistle on the Internet okay but so what this combination is one of the things you might notice if I go to just my actual coding challenge let's let's actually oh shoot see it live no view code web header that's what I want to do so I'm gonna run this be really nice of you I appreciate that okay so what I want to show here is see how there are two hundred Boyd's flocking right now if I increase this to even just like five hundred look how slow that's running this is because every single Boyd has to check every other Boyd in relation to where it is if you watch the coding challenge that's what I went through how do these Boyd's move to their neighbors this is incredibly slow if you could do the math 500 checkpoints each one checking every other 500 is 500 times 500 which is I could get the answer to on a calculator or in my head but it's too stressful when you're live streaming so and if I made this a thousand look at that it can barely go now this is not a limit of a computer to draw right if I do if I comment out this line look at this if the computer is no problem drawing a thousand circles quadratic complexity thank you I always say exponential which is absolutely wrong it is quadratic thank you and so here now if I go back to this this what this is doing is it's using a quadtree algorithm what is a quadtree it's a way of sectioning a computer graphics window or any two-dimensional space you can have an octree in three-dimensional space into various buckets and all the voids register themselves in particular buckets and then when it's time to look at the neighbors it doesn't have to look at everyone it can look at just the ones that are within its bucket and this is called quadtree optimization it sounds very fancy but it's not that you it's it's a thing you can do you can actually do squat it's called quadtree because you can actually keep subdividing subdividing based on how many boys are in any particular area but you could also just do what's called spacial subdivision like we could just divide the screen into equal parts and that would also be work well for flocking now I should let me go back to the code and I change this look that's already 500 let's change this to a thousand you can see like okay it's not running super fast that's because there's still a lot of stuff for it to do and this is javascript in the browser but this is a reasonable animation with a thousand which is really wild and there's probably a lot of like further optimizations you could do like there's tons of stuff in my code where I'm doing all these extra square root calculations and that type of thing okay so I am going to sorry I'm distracted by multiple chats going on I'm going just takes us back to 500 which is a nice number for us to see look how fluid and passive great so thank you tasteful toasty for doing this so I'm gonna leave now I'm gonna go back to where was I here to find the other ones the internet is a hard thing oh there we go let's look at colorful regular polygons flocking by Juan Carlos and let's click on that this I love to see so a couple things about this I love one is that a nice new interface that's a little that's quite a bit more nicely designed with actual labels to play with the different rules and then you know a lovely design take on this instead of just using circles to use different polygons with different colors wonderful work let's move on to three 3d does this involve quaternions 3d Boyd's with quadtree and then let's look at this one let's actually once again I want to go one of the things I think would be nice to add to this web editor is a button that immediately gets me to the fullscreen view but I can just type it into the address bar so this is really cool to see so this is actually now I wonder is this using the WebGL renderer of p5 amazing if it is and you can see this is happening in 3d we can decrease the number of Boyd's increase them change their perception bump up the separation so many fun things I encourage you to play around with this on your own then we've got evolution aquarium oh oh oh I saw this I think someone said to be on Twitter or like post it in a comment I don't underst but this this is the kind of this is like my dream project if you ever have seen the nature of code book they sort of like working exercise through that whole book is to make your own ecosystem with a lot of different agents that are have different rules and are evolving different behaviors and this looks like it is a manifestation of that a smarter every day is still in the chat says oh dang I was hoping for 3d the 3d is coming I'm gonna find that unity one which is really wild so what I love about this is each one of these creatures I know I don't I haven't looked at the code I don't know what's going on here I actually think it would be but in this kind of case I would love for the creator of this maybe to consider a write up about how all this is working but there are predators there are voyeurs there are food there's food there's poison and those creatures and you can see that everything is that the I imagine this is also built on top in addition to the flocking behaviors using my genetic algorithm evolutionary series to evolve different behaviors what I love about this is I can click on show names all have names like sweet or Daisy I just love that like where do these names come from maybe they could use some kind of like text generative generation neural networks thing to like generate names for all these creatures and then I can do things like add a predator I think that's spelled incorrectly Allah I'll pull requests that a pull request that predator so I think if I click now oh so the red are the Predators so I could get distracted with plane we fish the whole day I think I want to feed them ok so I mean I could feed them look Oh these kind of projects can be so excited so I would I really want to like play around with this and explore the code and kind of understand what it's doing but I'm going to set that aside so I was planning on starting with the toothpicks that was gonna be my warmup because I have to admit hi I checked out this book from the current library which is the like math computer science library here at NYU called Fourier analysis so excited I was like I'm gonna go get a math book I forgot I left it downstairs I want to have it here as a prop I'm gonna read it on the sub and then I started looking at us like oh my whoa oh dear this is this is a little bit beyond but so I have two things I want to do one is the Fourier series and one is the toothpick challenge I don't know I don't know I don't know I was planning to do the toothpick challenge first but now I'm thinking maybe I should start with the Fourier series I could always just go oh the unity thing that's one more 3d so I'm gonna find this video and yes sure you can show me notifications I am going to find the unity can I find a comment where is it somebody commented and linked to their unity version maybe somebody watching can find this more quickly than me unity seriously I just thought okay I could find this hold on is it not maybe it was aunt wasn't on this video let me find it on this computer I have to decide shoot here let me play some awkward waiting music [Music] alright let me try it if anybody in the chat can find yeah I was trying command F but you can find this comment recent comment I'm gonna go into my YouTube studio over here it was the URL was an itch dot IO I'm gonna go to community I have a second computer here if you're wondering what's going on and I'm gonna go [Music] on earth ah here it is I found it I found it oh okay box rock ox Rock Bukit io / okay here we go here is someone ox Rock 2k1 on YouTube rights I created a 3d implementation with Blue Jays I love birds I love birds I'm like a I wanna be birder I have one of those life books you know the life book is where you write down every single bird you've ever seen I travel I know I've talked about this I traveled to Norway to rune de bird Island to see the puffins which I didn't see but I had an amazing time there well I won't rehash that story of going to Norway but allow you to adjust relevant values in real time you can play it here link I also posted the scripts on github for any who are interested I will bring out its github.com / øx rock / Boyd's but let's run this and see I do not know how to program in unity it's something I have always wanted to explore but I love like I love the fact that there's this actual like bird flapping 3d model animation I don't know how well this is reading you know one thing I would love everybody who watches my videos to always be conscientious of is contrast ratio this is a really important thing to consider when you're making content on the web Forex accessibility people with low vision can honestly read text that it's not high contrast and there are certain web accessibility standards that would be good to follow so anyway I'm not sure if you can see this but you can see there's bird count separation distance cohesion elijan alignment momentum and settings so so anyway I would look I would play around with this who can add a lot more birds but I encourage you to check this out on your own it is really interesting to see this play out in 3d Daniel asks in the chat is unity only first c-sharp so it's unity only for c-sharp you both I think c-sharp is the programming language of unity you can also program apparently in JavaScript in unity but I don't think does wonderful so thank you for this to ox rock this was really exciting to see it kind of makes me think about wanting to try a little unity and also I still want to put this out there anybody who wants to try no one tried this I don't think I'm gonna go here view rule a flake yes so I mention this that in the book the computational beauty of nature which is a MIT press by Gary flake Gary flake describes a fourth rule for flocking view move laterally away from any boyd that blocks the view and the theory here is that if the Boyd's in addition to the alignment separation cohesion rules are also trying to keep their view clear they might actually end up in the kind of pattern you typically see of birds in the sky that V pattern that pattern emerges without a leader through the local interactions between those birds okay so let's go to I let's go to Schiffman dotnet randomizer no it's not that Schiffman dot github I oh let's put in a toothpick for ei well let's submit these let's spin the wheel okay everyone speaking of accessibility I really need to work on this a spinner like it's very like holiday themed today okay here we go [Music] which one will I do [Music] oh it's gonna it's gonna stop before it gets all the way through this I'm pretty sure I really have to do the Fourier series first I really want to do the toothpick series I even even rigged up an overhead camera which is no longer on oh wait my overlook there you go have you been rigged up an overhead camera whoa that made me a little bit dizzy actually to be perfectly honest um all right I guess we're guess we're starting with Fourier series all right so I need to get myself set up a little bit and so first let's pull up a bunch of links smart every day [Music] this video let's pull up actually let's go to dokas blog which is in turkish but there's actually yoga has a post which was translated into english how am I gonna find this Twitter I think so what I'm doing right now just so you know is trying to find all the resources that I use to make sure I credit things properly a building misses a little Baba okay hold on I just wanna there we go I'm pretty sure that's the Twitter handle and then yep and then somewhere in here is a post translated English so great we're gonna do this we're gonna come down here to look at this okay then we are going to also go to a three blue one brown 4ei this this video is really remarkable if you have not watched but what is offered that this is still on move the overhead I'm so sorry I didn't realized that was there if you have not watched this but what is the Fourier transform so when I make an edited when I make an edited version of this as of like a short coding challenge video I will probably reference to watch this and the smarter everyday video first because I'm essentially like the way that my channel works if you haven't watched it before um is that I try to do that sort of like last step implementation sometimes I know exactly how the math works and I can explain that sometimes I'm relying on somebody else's derivation or proof of a formula and I'm just figuring out how to make it work but I want to show the entire process from start to finish of creating this visualization even if we don't understand every interim step we can understand every line of code so that's what but this could not because is really a remarkable explanation of the Fourier transform there's also actually a really nice better explained better explained a Fourier I was looking at this also is excellent an interactive guide to the Fourier transform and so now I think I can close out all these other things and then I'm gonna do this I'm gonna do this in the p5 web editor I think this can work in this I think is I mean there's nothing simple about what I'm gonna do it's very hard I had a really hard time thinking about this and trying this out this week but I think it's a small issue amount of code what is the password oh no it's just coding train that's why it's a smallish amount of code that I think I can do it in this editor so that there's an online version that you can find oh and then of course we would not be able to live without Wikipedia no Fourier series I want Fourier series yep here we go alright and so one of the things that I love but okay here we go oops did I lose the better explained I've got this I've got the Wikipedia I've got the blogpost I've got the three blue on Browns video let's let's get this somewhere as I reference it there's a like a mind-blowing part of this to me and there's so many mind-blowing parts to this video I've watched this video probably like over 10 times so but and also we can move this to like just like this would be good like look at this the mechanical see this is I wish I could do stuff like this build mechanical things someday we can dream okay so this I've got the code thing here I'm gonna put that here Oh better except I lost the better explained I don't know why one of the things I love about this page is talking up is this smoothie to recipe so I was trying to come up with my own metaphor to explain what a Fourier transform can do and then I read though that's really good hello maybe I should use it I should come up with my own but I'm gonna use this and credit it okay alright so how's everybody doing everybody ready for this let's get the whiteboard going whoops next time I livestream maybe I might remember to actually erase the whiteboard before I use it this by the way is a book of Christmas songs for the ukulele that I just got delivered to me yesterday from Amazon I also have this keyboard but that's what I used last year but oh and there's the eraser wonderful okay so this was my diagram of the flocking stuff let me erase that I have so many good toothpick stick ideas you know dropping them all on the floor there were gonna be lots I all these plans and the Fourier series is gonna it's really good it's good it's gonna make my head hurt race race race race race let's make sure I have a working marker hello I'm over here and for a for a let's write this Fourier ba-ba-ba-ba I'm very no I'm not gonna write transfer my just gonna I miss a Fourier series all these aren't related interrelated terms and that definitely get some like hearts and like a little rainbow for Fourier maybe like some stars there we go okay how we doing all right can you tell that I'm procrastinating that I've liked terrified and don't want to try this all right uh here we go okay toothpicks just just think of the possibilities hmm I will have to first read some random numbers let's see here [Music] she's gonna help me relax before I get started with the Fourier series I will be reading from a million random digits with 100,000 normal DBS if you were waiting for me to actually do some coding I'm so sorry page 165 4289 twenty-five thousand one hundred and eighty two eighty nine thousand one hundred seventy six eighty eight thousand one hundred and eighty five fifty two thousand three hundred and sixty one seven hundred and eighty-five seven thousand six hundred and twenty six five thousand four hundred seventy nine ninety one thousand one hundred okay ceci gauche writes in the chat I'm French and you don't pronounce for you correctly okay sorry if you I would I'm totally game for a lesson on pronouncing Frawley a correctly in French alright let's get started actually doing some coding so let's call this okay all right here we go house this font size can people see this font size okay I think this is going to be a fine size for the canvas wait why what's going on it's weird there we go okay something weird happened for a second oh whoops let me do this I think it's actually better for me to just increase the font size this way my computer is really acting up and then have a larger canvas to work with and then give myself a little more space okay Fuli eh is that is that better what is going on on this computer I let me just mmm this makes me nervous hold on just make sure things are working yep all right we're fine I'm having a little panic attack okay ah what did you not just see that change just the command s and it changed what is going on all right I gotta just we're gonna code doesn't a second but I'm having a little bit of a panic here let me close this I have a feeling that this paint not this page but this page is running a lot of real-time JavaScript T stuff and so I wonder if that is causing problems yeah the editor I wonder if I need to like move away from the editor some weird stuff is happening okay all right something weird is going on but let me just just bear with me for one more second okay all right it's not getting the last thing I say you know something got fixed so I'm gonna not use the web editor right now because I'm just going to actually use a a Visual Studio code I think this is my time sorry to like go off-topic yet again I'm really proud I really will be starting this in a second but I'm just going to point this out I have a feeling that recent there's issue 675 yes I have issue numbers memorized this is a bug in the web editor that the leaf site dialog shows even after you save your work and this was just fixed within the last 18 hours and I think there's like something maybe it's something that this fixed like broke something else so so I am going to what I'm gonna do is this will take me just another couple minutes so apologies I could also just do this in processing but I think I want to do this in JavaScript for a couple of reasons so what I'm gonna do is [Music] [Music] better so if you're wondering what I'm doing you can check out all my workflow videos which show how I work and create these projects [Music] so we're gonna use okay now I'm ready sorry for that little pause thing but now we are ready this is actually a nice oh you know what I'm going to start with us this because this is basically exactly what I'm going to recreate so I will have this open here bean is I don't know how to pronounce that this is which is on the problem okay let me cycle the cameras again we're really getting started now everybody okay you know what I'm going to I'm going to do this yes okay all right so just so you know this is basically exactly what I am about to program and I am going to get started right now let me just open this computer back up in case there's any emergency messages okay stretch [Music] hello welcome to a coding challenge Fourier series so what I am going to program in JavaScript using the p5.js library is exactly this this is what's known as a Fourier series it is a series of wave patterns that when summed up together approximate some other function what does that even mean so I'm first of all you should yeah I'm going to show you some resources the things that got me thinking about this topic and wanting to make this coding challenge and you probably should if you want stop this video and go what look at these other resources and then you can you can come back if you want or maybe you're just off doing something else so pretty recently smartereveryday came out with a video called what is a Fourier series explained by drawing circles this video reminded me of a amazing video that I watched at some point in the past I guess like almost a year ago called what is the Fourier transform of visual introduction you probably if you've done any coding and programming you've probably heard these terms before FFT fast Fourier transform it's usually referenced in the context of analyzing sound and so a smarter every day's a video was a collaboration worked with a Turkish researcher on this website here I'm not going to attempt to pronounce it I will Billy Mina's gazelle on net I encourage you to check out and read this whole article but this is a visualization again of exactly what I want to do a series of wave patterns visualized as a path along a circle periodic functions sum together to approximate a square wave and if we can make this happen in JavaScript then there in theory is no reason why we couldn't then figure out how to draw any given path as a series of Fourier transforms and there's like a sort of well-known gift for video of this like crazy set of circles drawing Homer Simpson so I'm hoping to get there but this video I just want to by the end of this video have exactly this pattern in JavaScript okay so I also want to reference this website better explain calm which has a nice article an interactive guide to the Fourier transform and this I think is a really excellent excellent explainer so again I'm gonna get start coding in a second but you're just gonna have to humor me to let me kind of talk about this a little bit more just to get my feet under me here so the idea of a Fourier transform so a sound wave right we have this idea of a sine wave you've probably seen me draw sine waves on the board or in code in countless videos usually drawn something like this a sine wave has a frequency which is how fat how often does it repeat like if if this is the sort of x-axis like this is one whole cycle right and I could think of that as like the time it takes for this circle to pass this dot to go all the way around the circle so frequency is like how how how how many cycles of the wave per unit of time like per second or per frame there's also amplitude amplitude is the height of the sine wave how how much distance between the very top and the very bottom and so a sound a pure sound the tone the musical note that was I meant to pick a but I hit G and that was I don't have any door close to perfect pitch who knows what note I just sung we can get the ml5 machine-learning pitch detection model to tell us that's another story for another time could be represented as a sine wave so but you probably have seen like oh I've got this recording device sound D thingy and what it's doing is it's like this is like the sound this is the wave this is the representation of the sound that I'm listening to right now well you can create this kind of wave pattern is typically actually the sum of multiple wave patterns can be represented this way pets so so in other words if this is like the music note a and then this is like the musical note something else and we're to add these two waves together can you still see where I'm drawing you know I might get something that looks like this right and I've done this I think I have like an additive wave video and the nature of code series about this kind of idea the idea of the Fourier transform is can we go right I could have these two waves I could add them together and get this pattern could I go in Reverse if I'm listening to a sound like this could I pull out all of the waves the sounds the frequencies that make up that that's like pitch detection or if I wanted to then filter out a very high pitched sound if I could take this sound break it apart take away one of the high pitch sound add it back together I would get this so this is akin to I love this metaphor here in the better explain of unsmooth iing a smoothie so I'm like to make smoothies actually a little known fact I was like anyway so but could you like right let's say I take some mango and some kale and two blueberries and some like almond milk and I mix them all together and I give it to my children and I say I made you this beautiful smoothie can you guess what's inside of it this is actually a game we actually play at home I've just realized that this is perfect well if I could do a Fourier transform I could take the mixed smoothie and filter out unco in Reverse and find out all the ingredients that's the idea so that's the idea of a Fourier transform that's conceptually what it is now what I want to do in this video is I'm not going to worry about figuring any of this out I'm just I now I understand what it is what it can be used for I have this goal eventually of having it of using a Fourier series to draw any arbitrary path but one way to get started with that is exactly what's demonstrated here on this website which is could you what what ways do you need to add up together to end up with a square wave and you can see here this is actually a really nice visualization as as as you have you have more and more iterations of the Fourier series how it convert is even closer and closer to the square wave I can also just go here to Wikipedia and find this again so this is the clue so there's this idea in a Fourier series of Fourier coefficients and some kind of like iterative thing of like N and n plus 1 and n plus 2 and we can actually see a nice clue to that in here this is actually a very this is one of the simplest Fourier series what is the series one three five seven can you guess the next number nine eleven so if I can just implement this each one of these circles and like have them rotate around like this at that period or frequency with that amplitude we're gonna get somewhere so let's I talked about this away too long let's try to actually code this down alright so the first thing that I'm gonna do is Oh where's my code here it is ah here it is okay so the first thing I wanna do I'm just gonna start I'm going to start like kind of you're not thinking about the Fourier series and I'm just gonna make up a variable called angle you can really think of that as time it might be more appropriate for me to call this time because time is moving forward that's a sort of crucial idea and then I'm just gonna say time equals every time through draw if you haven't sorry let me make this a little bigger that's too big if you haven't work with p5 before draw is a function that loops over and over again over and over again so time is moving forward then what I want to also do is I just want to like a draw a circle somewhere so I'm gonna translate to like 200 pixels over and 200 pixels down I'm gonna have this idea of a radius like the radius of a circle that I want to draw is maybe going to be 50 pixels and then I'm gonna say ellipse at 0-0 with that radius times two because the lips function expects the diameter radius is half that I'm gonna make this white so I'm gonna say a stroke two fifths the stroke 255 somebody told me how to get rid of that autocomplete and I still haven't done it and a no fill so when I go back to the browser and refresh it I've got a nice circle there let's make it a little bigger all right so now what I want to do is how can I have that dot traveling around the circle let me have the dot traveling around this Circle so the way that I would do that is I would use polar to Cartesian coordinate transformation and I certainly have a video that talks about how to do that but what I'm talking about here is if this is the radius and this is the angle which is really in my program the time how far over an X and how far over an Y can be calculate how far up in Y can be calculated based on trigonometry so the radius times cosine of the angle or angle is the x-value the radius times sine of the angle is the y-value so I'm gonna do that here I'm going to say I'm gonna say let X equal radius times cosine cosine of time and let y equal radius times sine of this sign of time I should write pause and turn that off and then but let me get through this first point X I'm definitely gonna positive turn this off point XY I'm gonna say stroke 2:55 stroke actually actually let's make this a circle also so we're gonna say like ellipse X Y I'm just gonna make it smaller like 8 pixels and let's also say fill 255 oh my gosh making me crazy and here we go look at that there's that circle moving right circle is moving and maybe it makes sense to also draw a line from a line from 0 0 to X Y and now I've got this and I want it to move a little bit faster and honestly I'd like it to go the other direction I'm not sure I should actually check what is it doing if I want to like recreate exactly what's here yeah that's moving the other drag so I've got the beginnings of this now I haven't worried about the number 4 here and the fact that I've got the angle divided by PI but we'll get there okay I'm gonna pause for a second this will get when I release this as an edit video this will get edited out let me try to find okay so also armor is makes a good point writes in the chat I am you using Fourier series and Fourier transform interchangeably but they are not the same thing that is absolutely correct not my intention to use them interchangeably let me see let me so first thing I want to do is figure out how does somebody in the chat know how to turn off that autocomplete that's making me crazy and then maybe I will try to give a statement to clarify the difference so hold on how do I turn off visual studio code autocomplete pre-press simply press escape alright ii can disable it in the vs tool settings requires a restart a visual studio to take effect thank you smarter every day for the superjet that's very kind unnecessary but kind did i miss any i should really make sure i didn't miss anyone else so hold on i is let's just turn it off completely for right now visual code studio tools auto complete I was JavaScript well I guess I'm just gonna turn this off right now I like tab completions but let me just turn this off okay now still doing it let's let's see if I restart a Visual Studio code was what the doctor ordered oh this by the way is what programming really is the instructions do not match the behavior let's actually this is unlike the unity website someone's got no oh editor accept suggestion on commit character false okay thank you me I am so me let's try by the way so Visual Studio code this is a nice this is a bit of an aside if I go to preferences settings this is like the interface for changing the settings thank you new made you mosa I'm gonna what I'm gonna do it first of all it's very nice to people are super chatting me I will go I think I have a way of checking all of these after later you will hold your donations until next week when I'm doing my fundraiser okay open settings JSON you can also actually just edit the settings through here and I'm going to try what me I am so me suggested which is editor doc look at this this is what I want the autocomplete thank you very much whoops I need more space here to see this editor dot except it went away fine except suggestions I have this JavaScript dot suggest enable this false that's interesting suggestion on commit character false comma goes here in curly bracket okay let's just restart Visual Studio code one more time but it's not as bad now oh it's just giving me like this is better it's actually giving me like p5 things Oh it'll bring up the suggestions that just won't fill it in when you do all right that's fine that's fine the nice thing is here for some reason it was giving me crazy stuff but now it's actually giving me p5 suggestions like that's what I want all right I think we're gonna move on let's also install this update whatever it is okay all right yeah it looks like it's only pulling stuff that's in the current file which is as far as I'm concerned great and I lost my cap to this marker all right so let's let's try to let's before I get back into the coding I think maybe I should also clarify Fourier series versus Fourier transform oh yes yes yes yes yes Fourier series is for periodic chto signals and a Fourier transform is for a periodic signals for days series is used to decompose signals into basis elements while Fourier transforms are used to analyze single another domain ok ok so I think I'm at a point hopefully this is a good answer that makes sense to me and you can see here periodic function by discrete sum of complement for you is used to represent a general non periodic function right so ok so let me just bring this up really quickly so that people so I don't I don't confuse people who are watching the video later okay I'm back I fixed this autocomplete thing that was bothering me in Visual Studio code I'll put something in the description about how I did that but I also want to mention it in the chat I'm thank you to honor who mentioned who wrote you are using Fourier series and Fourier transform interchangeably but they are not the same thing so thank you so much for that comment applause no no if you can hear that there's like a presentation going on out there and people just started applauding just right so I don't definitely don't applaud for me so um I will I will post some links also in the video's description for more reading about this but in short the Fourier series is for periodic signals which is what I'm doing exactly right now to create this square wave which is periodic verses the Fourier transform which is for a periodic signals another way of thinking about that is to represent general any general non periodic functions so hopefully as I get further down this road I will come back to this but and and also in the chat I'm smarter every day writes Fourier transform is for swapping between frequency domain and time domain which is an also a really nice way of putting it okay but what I am doing in this video is implementing the Fourier series the periodic series of two to two that add up together to the square wave pattern okay all right let's get back to the code so here we go so I have success step one I have my circle passing around and you know what I think that I probably should I think that I probably should not put this I'm gonna have it go the I should wait a second yeah I'm gonna have this not go the the correct order action I may have it go this because I don't know if the negative numbers gonna mess things up okay all right next up next thing that I need to do and if we go back to this particular video is how can I take this circle that's moving around and then draw the resulting wave pattern and this is actually kind of a much simpler problem than you might think because basically what I want to do this is moving in two dimensions X is oscillating back and forth Y is oscillating back and forth and both those oscillating at the same frequency with the same amplitude in the same phase the starting together is moving along the path of circle so I just need to take the Y value and and graph that along the x axis so the way that I'm gonna do that is I'm gonna add an array to my code I'll call it wave and it's going to be an empty array has nothing in it and what I'm going to do here is every time I calculate a new Y value I'm gonna say what wave push Y so I'm just gonna save that particular Y value so now all I need to do is say you know for let Act you know I'm not gonna use X I equals 0 you know eyes less than wavelength I plus plus let's draw a point at I comma wave index I right so all I'm doing here is saying let's just draw all of those height values those Y values from kind of x equals 0 to as many as them as I get so if I do this you're gonna see look at that there's that wave pattern going all those points are moving up and down and you can see how the height of that wave is the same as the thing passing around okay but this doesn't look so great so what I want to do is I want to instead use begin shape and end shape this will this and then say vertex so this will actually like tie it all together and I think if I say no it's actually I'm not a minute I'm gonna leave the fill in there for a second because it's kind of cool so that's actually like trying to fill in the shape which is that sort of a nice pattern but I'm gonna just say no fill I'm gonna do this refresh the page and then also you know why not translate just to translate this a little bit over like 200 pixels and we can see this and then I guess I could also draw a line would this make sense a line from uh X Y X minus 200 this is weird what I'm doing now to the first point wait there's people timeout for it's like it what am I doing here I I just like thinking what do I wait what do I want it visually to do let's look at this Wikipedia thing yes sorry I want to draw a line yes I want to draw sorry I got confused while I was doing I want the end of the line to connect to where that is of course okay so what I want to do is draw a line so I need that first I need this first value so I have X minus 200 comma Y 2 I comma wave index 0 and actually it's not I it's zero so this is just this this I know is the very first point in this loop and since I translated over I've got like back up with my x-value this is very awkward [Music] oh no no I don't want it to connect to here what am I doing wrong why is what I'm doing different oh this is oh I'm doing it backwards I know what I'm doing I doing it backwards I actually don't want to I mad I'm appending to the end of the array so every new value I'm appending to the end I want to add it to the beginning so instead of using push there we go instead of using push I want to use unshipped so unshifted a JavaScript function a weird name for it but push just adds this thing to the end of the array one add it to the beginning well that was that was a mistake there we go this is what I'm looking for there we go okay so now I have the line connected there now one thing that's a little bit of an issue here is that I'm just like adding points and adding points and adding points and adding points and never getting rid of any points so I also should probably at some point I should say something like if wave dot length is greater than like I'm just going to make up some number right now I could do a calculation of how many points I need to the end of the canvas but just to move more quickly here I'm gonna say wave dot pop so that would just like if it's getting more than 500 is gonna like delete the last one off the end and now we should be able to say like I should be able to look at wavelength 152 so clearly I only need like I don't need more than 250 so let's redo that again and we'll get like 250 points you can see it's there we go I just want to make sure it stops at 250 yeah there we go so to stop at 150 okay how we doing okay sorry this I just I need a second little water all right let me think what the next Lex step is all right okay all right all right okay coming back let me disciple the camera while I'm taking a minute here okay there's a lot of noise going on in the hallway all right we are at we are at this spot now comes the exciting part I mean this was hopefully all somewhat exciting but to me how do I suddenly go from I have one circle with a point around it to another circle that's kind of like there with another point around it to another circle that's like there with another point around it how am I going to add up these circles and continue this path of X Y along them with all of these points rotating and spinning and guess what I've actually done this before I'm just remembering now I have a video on the fractal spirograph let's see if this comes up yeah the fractal spirograph I actually did this already in the fractal spirograph which was this way of doing exactly this to create a fractal pattern which I should go back and revisit this but so we'll see if that's how this compares to that so let me go back to the code here and so what I want to do so first of all before I do this I think I need to think a bit more formally about these functions so before I was just saying radius cosign of time radius sign of time but these functions actually map to these values on Wikipedia here so if theta is my time basically what I'm saying is that I want to and and the the the value multiplied by that is four divided by sorry theta is my time and four divided by PI is basically my radius in a way here kind of conflating some things but I can start to use this particular series to understand the ratio of the radii and the frequencies between these these different oscillating circles okay so let's say what if I what I do is I say four divided by pi times cosine of what was it again one times time so I'm going to do this I'm going to just change the Y here and then what I'm going to do is I'm also doing to say radius times that and also I missed something four divided by what one time so this is confusing because there's a 1 here 1 times angle 1 times pi so I'm gonna say 1 that that's 1 times time 1 times time and this is 1 times pi and this is 1 times pi so the number that I need to change for each circle is that 1 so let's just see what this actually yields and I'm gonna go back to here well it's sort of it's the same thing but now the fact that I have that radius was 100 it's like everything is way too big and so what I'm gonna do is I'm gonna change this is really more like a scaling factor at this point I'm gonna change this to 20 and now we can see whoa boy that's still really well let's just change this to 10 yeah that looks better and then what I need to do here is this number here so I'm gonna say I really what I should be saying is this this need this hold on this is gonna get calculated here I will refer to this later let's put this in here and then let's make this back to this because I don't really need let's like to make this back to here okay and for time divided oh oh this should be dip one time spot why is it doing that to me I don't want that far I want these divided by each other visual studio code is too smart for my own good there we go there we go that's what I wanted that's why it was giving me something crazy anyway okay radius is not to find a sure it is where Oh huh radius oh this is the point ah the circle now I need to draw the circle next this is when things are going awry and let me put this here there we go and now there really of course the out was that of course I had the division in the wrong place I have this tiny little wave so let's go back and make that about 25 which I think would be now basically I hope it's divided by pi ah this is going remarkably well there we go okay I'm happy with where I am now okay so now I have that first circle the reason why I am doing this the reason why I'm putting this making all this work because I want this to be n I actually want this to be a number that changes right first first it's 1 then it's 3 then it's 5 then it's 7 that's not too hard to figure out right and what I want is to start X with and Y both at 0 and just add this stuff together so X plus equal X y plus equal so I want to and then what I want to do is I want to loop n so n is going to go from one I'm gonna say 0 actually and because I you got a count starting with 0 n is less than 2 n plus plus and then and this really by the way I should call this I because what I'm really saying is what I N is how do I do 1/3 and this is pretty easy I multiply by 2 and add one N equals I times 2 plus 1 right when I is zero I get 1 when I is 1 I get 3 when I is 2 I get 5 so now if we add these together and I'm just doing two right now and speaking of which I should move this all the way down to here and I'm gonna take I'm gonna take this out for a second and then I got to go back here and there we go okay so something is wrong I kind of got things close like look at this interesting weird crazy pattern that I've got wha what is going on so I definitely I definitely messed something up but oh but but let's see if we can figure that out okay so the line should not be going from so I should be actually keeping track of previous X is X and previous previous Y is y so I I don't I'm gonna like take out the wave for a second because I'm gonna have to change where I'm viewing here and then I'm going to just say a previous x equals x oh no and then pre and then previous x equals x previous y equals y and then the line is is going from those like that's not always going from zero zero it's going from the previous XY so now that's right the other circle also needs to have its Center be at previous X previous Y and there we go so now I have this I have this circle spinning around this circle spinning around this circle there's only two circles but in theory if I change this to like five there we go now we're now we're getting somewhere and actually it would be sort of fun I really think that I should think about how I'm drawing this a little bit better so for example I think I want these circles to be much lighter so let me give them a little alpha and then the points should also be I think the points are almost like less relevant I almost don't want to draw these points let's just because I have the lines now so let's see what happens if I take this out and I do this oops but I want the line to be full brightness there we go so this is what I'm looking to draw so there we go so I now have this particular series with every circle next to rotating around every other circle and I the I am using the values from the particular fourier series for a square wave okay so now and I feel like this should be bigger it's so small let's go back to having this be 100 and let's actually not let's just see how this looks and let's we can also I'm being like neurotically silly about let's move it over a little bit okay oh I don't want it to go off the screen though so let's leave it there split the difference 75 okay and then have to go back a little bit this is very silly what I'm doing okay 150 there we go okay so I know this is hard for you to see let me zoom in on it so this is we go so now guess what we're basically done right before I have to put the wave back let's see what happens if I just put that wave back like what happens I put it back well what's going on like I'm getting some crazy thing here I don't even know what's going on so what I need to do what clearly is happening is I am not getting for why the correct Y values and drawing it to the correct place so I've got to fix that even I like this interesting pattern I've got to fix that if I want that square where you can sort of see the square wave pattern here so what I want to do here is oh I'm pushing all the values I just want to push the last value actually this is gonna be a much easier fix I think I just want to push the laughs value after the loop is over and there we can see there we go but I don't know why this isn't shifted over did I lose that somewhere yes so this I need to do this this is actually going to be all of this was actually fine and there we go we are done this is the Fourier series for a square wave in JavaScript programmed in about oh I'm not visualizing the middle line this is a good point well I don't know if that's what but what smartereveryday is asking in the chat but I I should add one more thing to this because this is going to become relevant later in my mind's eye of how I'm going to do more videos on this so right now I am visualizing the resulting wave pattern also I got to do a few more things will you please bear with me I know this videos already about 70,000 hours long but let's at least add one slider and I'm going to use the and so I'm gonna have a slider that gives me values between 1 and 10 and I'm gonna start it at 1 and what I'm gonna do is I'm gonna take a slider dot value so basically I'm going to have n be slider dot I'm gonna have n control the amount of iterations of the Fourier series itself so now you can see there's just one so I can use this slider to add 2 3 4 5 6 and this is 10 and I could this is fun that I can actually do this in real time so now you the viewers of this video will have so many more creative and interesting ideas about how to make this prettier how to create more interactivity there's so many but this is just an inkling right every system that you build with code has a bunch of variables and parameters there's no reason why you couldn't make those interactive you couldn't even think we could make the number of iterations that's to a sine wave itself like what would happen there that would be crazy but now you can see up to 10 we can see how it's converging and I you know I don't know how far I want to push this let's push it a little let's try let's put it at 100 and that's zero all the way up to 100 performance-wise it's fine it's happy to do 100 there we go look at this look at that square wave all that is that is like nice and square I've ever seen this is making me so happy I cannot explain to you I feel like this is a thing that's been in my head for years but I never actually like sat down to program it course I am standing right now but close enough all right so one more thing that I want to do I would really like to also see this path here like what I would like to trace out the path of this of what these endpoint is doing not map to only the x value but also the Y value so the way that I might do that is I might say a let path another array this is I think going to be a little bit easier and I'm going to say path dot push this I can add to the end and I'm going to use create vector because I need to store both an X and a Y so in this way if I only needed the Y value because the X values are fixed with the path I need both the X and the y value because I want to visual that that path well we'll see how high we can get it to go in JavaScript before like my computer explodes okay so that now what I should be doing and then I just need another one of these thingies by the way that's the technical term for this this thingy so I want to do another loop I want to do it actually before I translate and I want to just instead I'm gonna do path dot length and I'm gonna say path index I dot X and path index I dot y yeah okay is this right my brain is starting to melt oh yeah there we go look it's drawing the path of the circle I move it up to one now it's drawing Napa now of course it's like drawing over itself a million times so every time its cycles past two pi I can resize should reset it [Music] what's going on here time n times time oh but when n is one that's one full cycle I mean this is later is a little bit silly but I'm gonna say if time is greater than 2 pi just reset the path to nothing and then reset time back too zero this I'm sure a more thoughtful way to do this but let's just see if that works like it's drawing the path and then we're not going to really see it clear yeah it cleared right so that's exactly what I want and then now if I do a couple iterations we can see and this is sort of crazy what it's doing like I'm seeing it draw that it's it's draw that path I need more I need more space any more pixels Mozart let's get myself let's oh I should end this video ok so I'm gonna stop here I'm gonna do some more in during this life this is so confusing to explain thank you for watching this coding challenge I'm still talking a second and that's your edifice right okay hold on let me just put this back to something reasonable all right thank you for watching this coding challenge visualization of the Fourier series for I'm making a square wave check this video's description for a link to the coding train webpage with this challenge on the code for it and then if you make your own variation of this please share it with me you could contribute it right there so what are some things you might do number one is why don't you try doing this sawtooth wave could you take the code that I wrote and make it do this that would be a nice exercise to try what other kinds of interactivity can you add to this to in terms of changing the colors changing the different parameters changing the view of it what happens if you do this like in 3d like right could you have like some kind of like point oscillating over three dimensions in a sphere and then map that that would be cool so III look forward to seeing what kinds of things you create ask your questions and all that nonsense it's not it isn't I mean whatever goodbye see you next time all right that was just my end of the video thing for when this gets edited I feel like I'm having I there's like a lot of new viewers I'm getting the sense of so I'm trying to explain my weird process but I'm not doing that well at all so let's let's see how far we can push this so first of all let me let me give myself a little bit more let's all right let me see I need to save a snapshot of this but I am going to I'm trying to think of what I want to do and then I want to do the toothpick challenge what time is it always noon oh I took a long time it's gonna be a really long video okay I need i plus equals to not I plus plus as alka says oh you guys are having it you all are having a chat about something else in there alright so let's see let me let me get myself a little bit more space here and really what I need is more width and I should if I'm really thinking about this I should have everything be relative to like the size of the window but I'm not gonna program that right now let's just try putting this up to like 500 and see what happens oh I lost the and then let's translate this over like a bit more this should obviously be a variable there we go okay so we're gonna give this a try we're gonna see like how the JavaScript performs as I move this up and maybe what I should also do I should probably like console.log what the number is but that's fine there that's 500 what is something is like very weird but I'll take it I just when I want to turn off the I wonder if I did something with the path incorrectly that's confusing me let's turn that off there we go let's push it up to 500 [Music] hello to consult Keith young apparently welcome to all the new viewers dan you could have the user be able to change the riemann function yes I could all right this is crazy all right Bert make the first circle set to fiy try to make a 4pi limit people are giving me all these amazing suggestions I'm gonna move on I think it's time to do the toothpick I want to do at least two things today plus I said I was gonna unbox both your couple so I think I'm gonna leave this at where it is and I'm gonna move on and do the toothpick challenge but thank you everybody make the path fade yeah I'm gonna do that you know what I'll do the toothpicks in processing because people have been clamoring for a processing and since I'm having trouble with the p5 web editor anyway I will have to use array list which is always really awkward but that's fine okay so I'm gonna close out all this stuff I am going to put this back to what it was [Music] okay so I'm gonna leave the code like this [Music] alright so people are asking what did I mean by Homer Simpson so my goal my new goal in life is to be able to fight google Fourier series and homework Fourier transform maybe there we go amazing how things work is to recreate this and I'm just gonna skip ahead pretty far here you can see look at this this is using like basically doing exactly what I did but on this completely arbitrary path of Homer Simpson drawing like this like makes my mind and and so if you watch the smartereveryday video what dhoka did is - what doe guy did was recreate the smartereveryday logo so I suppose I would love to in JavaScript maybe recreate I don't know this something a rainbow this clouds something like that one of these characters something like that so that's what I'm gonna do can we take a break ridiculous can we take a break before the toothpick yes because I also need to go get some more water so I'll probably take a few minute break and so actually what I so one of the things I really want to do is um create some I need a like a video that I can play while I'm taking a break that's like be right back but I am going to right now just go toothpick number file let's go here let's find a nice that's good and then I also want to go here and I want to go where it here here okay this is by the way quite possibly my favorite website in the entire world look for Homer Simpson cycloid from Santiago let me see if I can there's a way that I'm so sorry sorry look for Homer Simpson cycloid from Santiago Ginobili writes with a super chat Vitor Nogueira there's a way that I can see all of the super chats I think through an interface that I have here let me just try this I think if I go here no that's for me to give myself a super chat somewhere I saw that there's like a way that I can have a page actually by next week if I could get the super chat for good thing I want to have something I want to program some stuff where like a little thing would happen when there's a super chat if it's a donation to the processing foundation I can't find it I don't know how YouTube works but if I go here here no I can't find it I can't find it so I apologize if I've missed people's super chats I can definitely see them later and yes I'm using the invisible computer that's where I look at your chat and also the slack channel that's going for patron patreon you should do it with drawings from the quick draw data because they already give you the right path inputs says me I am Sania this I should do for next week so quick draw data set what's the most holiday II thing in the quick-draw data set is it maybe like snow snowman I'm guessing I forgot what the so yes so let's let's work on that coding train enthusiasts let's try to figure out a way to do that the quick-draw data set is right Thank You AJ 3600 okay Wolfram Alpha can give you an formula to draw images to interesting that's interesting okay so I'm gonna do the toothpick patterns which is here and here here I want a a 1 9 a 1 3 9 2 5 0 a 1 9 2 3 5 0 is that what it was a 1 3 9 2 5 0 search that's this sequence so I have this sequence which is this sequence which is this okay this is and then let's do this in processing so processing is a Java based program environment very similar to p5 in JavaScript but it's a downloadable desktop thingamabob hi vocabulary as it gets closer to lunchtime my vocabulary really starts to fade it's not good never attempt complicated fractal recursive coding challenges before lunch alright so I'm gonna take a short break I know people like the this stop song as always I always forget this stop [Music] like solution I am so good with technology okay I'll put on something else for you all right I'm about to mute my microphone and I will be back in about five minutes [Music] [Music] [Music] [Applause] [Music] okay I'm back how is that longer than five minutes it is time ups overhead camera that was about ten minutes [Music] [Music] one more coding challenge for today and then where did I put my eraser [Music] okay so toothpicks toothpicks toothpicks okay this one's good this is I'm really excited about this hopefully every what's going on here yeah all right maybe pouring all the two things out wasn't the right idea we're not over here yeah I don't know it here and then okay all right so all right let's try this a little bit ourselves so I'm gonna try as best I can to make this toothpick pattern that I learned about from this numberphile video oh you get the old I mean mine here okay wait I don't know this is not going well yeah so the idea here this is almost this is like this is just like when we played the universal paper clips game on the coding train let's see how I am so mechanically challenged it's so sad I will definitely be able to ironically program this faster then I could possibly make the toothpick pattern let's just try to I'm gonna try to fill up at least the space that you can see so where do I need to add some definitely want to go here one go here yes you are now watching a live stream of a person arranging toothpicks on a desk I think I've run out of space I guess I could go up here right cuz there's still more that you're seeing oh it's oom din again every time what does go just the camera like oh you know what it is the camera look at this could it be just the weight that the fact that the camera is pointed down and mounted that the gravity is actually zooming it back out zooming it in is that what's going on it's like why is there no space for my toothpick fix I wasn't doing this in the right order now okay I give up okay there's like a ring man joke in here somewhere - I think but okay it didn't sue min it didn't what's going on is it just like slowly over time yeah like if I pull it down it zooms in if I yeah I don't know what's going on gravity is a thing hmm okay anyway this is not really that relevant so first of all welcome new viewers apparently I don't know how many people are watching right now but I seem to have a lot of new viewers thank you I am a person who wastes a lot of time on a live stream that's supposed to be about programming I guess but really it's just about a lot of nonsense around toothpicks and random numbers and brain-melting out of ear things and so here we are so I am now going to attempt to do a coding challenge to implement this particular visualization of the toothpick pattern as demonstrated in this recent numberphile video I will be using this online encyclopedia of integer sequences by into a Sloan who is featured in the video this is the particular sequence that I'm looking for I think is this a 1 9 2 3 5 0 a 1 9 - oh no 3 a 1 the wrong one 8 let me copy it a a 1 3 9 2 5 0 a 1 oh boy this is not the right one a 1 3 9 2 5 0 totally on the wrong - to make sequence there we go so if I do my programming correctly I should get the sequence a number here we go here we go okay here we go mmm stretch stretch always important to stretch when you're programming Oh myself there okay hello and welcome to Makoto challenge toothpicks I know it's a little weird what I'm doing I'm really doing a coding challenge about toothpicks and in fact I have all these toothpicks on my desk over here and I'm trying to I thought oh man I have this really amazing video where I arrange them and I just I can't I can I'm terrible at this sort of thing so I'm gonna but but I do have an overhead camera which is exciting there's some possibilities there so what is this toothpick pattern terrific toothpick pattern so first of all you I would suggest pause this video right now go and watch this wonderful numberphile video which explains the toothpick pattern and you can use it to generate interesting fractal like visualizations in a two-dimensional space this actually comes from the research of NJ Sloan who is the founder of my absolute favorite website I mean I don't know oh there's other wonderful websites so I don't know I don't want to play favorites here but the online encyclopedia of integer sequences is a pretty awesome website it's just a website of sequences of numbers and I've used it before and there's so many things to explore in terms of these sequences of numbers but one of these a particular sequence of numbers comes out of this toothpick sequence Omar pols toothpick sequence so this is a nice interactive demonstration of the toothpick sequence you start with oh wait wait wait wait we could do this you start with a single toothpick unless you say next and you put two toothpicks consume you doughnut to to fix you put two toothpicks like this on the ends and then you say next and I also put toothpicks on the but the next step is the key step so once I get to here and I say next again notice how no toothpick goes here right toothpicks can only go on eight what's called a free edge an edge that's not touching any other toothpicks so this is touching here this is touching here I can actually point over this way I don't know I don't know the best way to do this let's get rid of that camera shot but so and then if I keep hitting next look at this I keep going and going and going and going and going and going and I can adjust the scale and I could actually just say run and move so I want to make this in the processing programming environment which is a Java based program vironment can I make this so a couple things one is this is fun to play around with you can play with different you can play with different parameters you can render out to a PDF and in addition what's going on here why is this a number sequence what's kind of fascinating about this and if you watch the numberphile videos can you create an equation a formula to sum all the given toothpicks at any stage of iteration and that's exactly what this particular number sequence is which I will now do a dramatic reading of because I like to read number sequences 0 1 3 7 11 15 23 35 43 47 fifty-five sixty seven seventy nine ninety five hundred twenty three years 55 her 71 her 3500 three 195 207 223 150 120 day three three 347 eighty three 423 483 571 651 683 687 690 five six seven 719 735 763 795 15:31 895 okay that's good enough let's start coding so the first thing that actually did I think I wouldn't let me save this call it toothpicks let me make sure let me minimize some of this other nonsense that I'm not using move this over here let me make a window that's 600 by 600 let me draw a background that is white and let me hit run and we can see there it is there's my window this is where I need to draw the toothpicks so I think what I want to do is you know skip a few steps here like I might but you know if I'm really trying to do this the first thing that I might do is just literally draw a line but I know that I'm gonna need some kind of toothpick object this is a good case of object-oriented programming because I need to create a class that describes what it means to be a toothpick what does it mean to be a toothpick then I can have an array of many toothpicks okay so that's not going to work neutab call it toothpick I'm going to say class toothpick and what do I need in the toothpicks so I know that I need a toothpick I need to have two end points what's the XY location here and what's the XY location here so I'm gonna call those a X a Y B X B Y and I'm gonna write the constructor and the way that I'm gonna do this the way that I think is gonna work the best like when I create a toothpick what I'm going to do the toothpicks can only be horizontal or vertical so I'm gonna create a toothpick by giving it the center point and then giving it a value like one or negative one whether it's horizontal or vertical so in addition it is also going to each toothpick will have a variable called dir for direction or orientation so I'm gonna give each toothpick and X and I'm using integers very specifically because I think this is gonna make my life easier to sort of almost think of this toothpick as living on a grid and you can't have spot 1.37 or to point like I really want to like be as close to pixel perfect as I can so and I also I mean this was really a global variable for the whole system I'm just gonna make a variable called length for how long a toothpick is and I do want an odd number because I want to be able to have that center point be perfectly have each half of the toothpick be equal in size so for example if I had a toothpick of length 9 then the center point is at five no four zero one two three five six seven eight hey hold on let me explain why this is important if I have something of length three right this is the cent this is if the total length of this is three this is the center I have one spot here in one spot here if I have something that's of length five then I've got two here two here and a perfect Center so this is going to be important in terms of I think that sort of evenness of how I place them the toothpicks and we could probably make a difference in the code that accounts for that but it's gonna make my life easier two things wait there's a toothpick stuck in my computer ah okay I'm gonna get it out to think no there we go okay all right so length let's just start with a length of 9 and what I'm going to say is that oh and I get to get a direction so I'm gonna say that if the direction oh so first I'm going to say that and let's just call this D Direction equals D if the direction equals one let's make that a horizontal toothpick so then a X should equal X plus length divided by two and a y no sorry and B X should equal owed so a X should be X minus length divided by two whoo and B X should be X plus length divided by two and then the Y's are the same a y is y and B Y is y and then let's make a toothpick that is vertical so I'm gonna do all the same stuff but these are now going to be with the Y higher and lower and let's get rid of this white space here and so now then I'm gonna write a function called like show and I'm gonna say I'm just gonna draw I'm gonna say stroke zero let's make it a little stroke weight like two just so we can see it and then I'm going to say line from a X a Y to B X B Y so this is the idea of a toothpick a toothpick has two points a and B a XY Y ax ay Y B X B Y and it has a direction just to be clear about this because this is so fundamental this is the toothpick this is point a X a Y this is point B X B Y but also the toothpick could be written in this orientation as well okay so now in my main program I'm gonna make an ER I know I'm gonna need to have a list of toothpicks so I'm gonna make an ArrayList full of toothpicks let's call that pics equals new ArrayList toothpick now if you've if you're coming from all of my JavaScript video tutorials this is a pretty weird thing that I've written because in essence if I were doing this in JavaScript why does it not know [Music] errors wait what did I do wrong timeout for a second wait a sec what did I do wrong here Oh toothpick capital P also does this code to a good size and I think it needs to move over a little bit silly me I have a capital P there for no reason so what I was saying was if you've come from my JavaScript videos you would see me do something like this like making an empty array that I'm gonna fill in JavaScript is super simple in Java which this which processing is built on top of I've got to use this data structure called an array list I don't have to there's other data structures which I need to specify what's going in it toothpick objects and then I need to create it so so there now what I want to do is I want to say pics add a a new toothpick which I'm going to put at 300 300 and you know what I'm gonna put it at 0 0 and I'm gonna give it a direction of 1 because what I'm gonna do here is I'm gonna say translate with / - I'm always going to think of the center at the center of the canvas as 0 0 so I need to translate to that Center and then I'm going to say for every toothpick T in pics T dot show so this is now a loop where I'm just gonna say whatever toothpicks I have so I'm starting with 1 toothpick I made a class object-oriented class a template for a toothpick then I made an actual toothpick 0 0 I can't remember it's 1 is either this way or this way and then I'm saying whatever toothpicks I have show them all and so now if I were to run this again we can see there's my toothpick and let's make the length let's let's have length be kind of like a global variable over here and let's have that be something more like 63 let's run this again we can see there's my toothpick and by the way I could do something like this I mean I you know as an exercise I could just make a ton of random - thanks but that's not what I want to do what I want to do is each cycle right I want to say what are all the existing toothpicks check every existing toothpick look at its endpoints or is that a free end point and if there is make a new toothpick there so a nice way to do that in the draw loop is to start by actually saying make another empty ArrayList I'm gonna call it next so this is kind of like the next generation of toothpicks is another new boy's a lot of typing going on here with these array lists I'm gonna make a new list of toothpicks the next list and as I go through all of these existing toothpicks what I want to say is I'm gonna say like I'm gonna you know what I'm gonna do I'm gonna ask the toothpick to create I'm gonna say call create I'm gonna say I'm gonna name these create a create B it's probably a better name for that I'm trying to think but what I mean is let's have the toothpick itself it knows about its edges maybe I need to when I call those functions pass in an array to all of the existing toothpicks like hey check yourself before you wreck yourself know check yourself against all the other toothpicks to see if your edges are touching any of them and if not make a make a new toothpick ah and these should be and then I should say toothpick this should this function should return to new toothpicks I'm going to call them a and B I should probably call them if I'm being consistent here like next a and next B so right and then so okay so what if then then I want to I think I'll do is I'll have this function I'm kind of planning this out as I'm going this might be a bad idea we'll find out I'm gonna have the function if the endpoint is not actually free just return null so it will return a new toothpick if it's a valid endpoint edge if it's not it'll just return null so what I'll say they hear is if next a is not equal to null then next dot add next a and this probably way I could do this with one function or something and if next B is not null add next B and then at the end what do I want to do I want to say I think toothpicks dot add all next so I think this is the ideally I haven't really written the code for doing this yet but this is the idea for every existing toothpick and here's the thing I don't want this would be problematic if I didn't I think there's a couple reasons why I want this next ArrayList and III did sort of think about this in advance like you might be thinking why not just add them to the existing list of pics well one thing is if I add stuff to the end while I'm iterating through it if things could go pretty awry also visually what I want to do I might want to draw the new toothpicks each time like as a different color there might be some separating out what the next generation of toothpicks is from the current generation might actually be somewhat helpful okay so now what I really need to do is write this these create functions so let's say let's first write the create a function so with this function it gets another ArrayList whoo I'll call these others and return null here so the idea of this function is that it's going to compare this toothpick this toothpicks against all the other toothpicks to see if it's if yeah so I saw a message in the chat and I maybe I did another capital P Ulmer is asking do you really need to redraw everything you're just drawing new pick yeah I could just draw the new toothpicks the reason why I want to redraw everything is cuz I'm going to do this thing so sorry I felt like I had to answer that question sorry I'm getting a little bit exhausted here it's so hearty 12:30 whoo all right let me try that again the idea of this function is I want to check this toothpick against any other existing toothpicks to see if they're sitting on the edge and if they're not I'm gonna create a new toothpick on the edge so here's how I'm going to do that I'm gonna say for every tooth pick other in others if and let's try let's so I'm gonna write some pseudocode for a second if this pick is touching other and also I first I want to say actually by the way if other is not equal to this like I only want to check yeah I don't want to check this if this toothpick against itself and I'm gonna say oh this is boolean available so I'm gonna assume the pick the toothpick is available so and then I'm going to look through all of them and if I find that it's edge is touching any other edge then it's not going to be available so how am I going to do that so I let's write a separate function how am I gonna do that let's write a separate function and let's just write a function called something like boolean equal and it takes two points can I go back and have I I need a second my brain is like hurting me I know I shouldn't do these new those are the chat is I probably shouldn't look at the chat cuz because I I've got it I know what I'm doing here it's not you'll see that it's not N squared all right I'm not sure I'm gonna go back to where I was writing this function so alright alright so I'm gonna write a function that returns true or false for two for two two arbitrary points so so what I'm going to do is equivalent or like cut intercept I'm trying to think of what I want to do I'm trying to decide whether I want to do this with like with like two objects and maybe I should put like maybe I should actually have a function in here like intersects another toothpick and then I could say if others not equal this and this and this does not intersect in this intersects other yeah let's do that okay sorry about you I'm making this editing complicated yes and Aaron is saying check only the newly added toothpicks I definitely I'm gonna that's gonna be a really important optimization so I will do that but I've gotten there yet okay so first let me actually I think what would be I think what would be helpful here is in addition to checking to make what I want to say is as long as the other toothpick is not this toothpick and the other toothpick I'm going to say dot like touches this toothpick then available is false so it's not available so this is not an available spot so now I need to write a function that can one tooth can check against the other one and I'm going to write that in here I'm gonna say boolean touches another toothpick and basically like how do I know if I basically want to check to see if two endpoints are the same and because I used integers I'm good actually check for a quality here I want to do like a distance thing so I can actually just say if other dot X ax equals this dot a X and other does a y equals this dot a Y return true I could write this as one statement but I'm just going to do it this way for a second and then let's check the B values OBO there's four possibilities here though oh I'm making this so silly this is one of the silliest functions I've ever written [Music] because there's four possible right because then a could also equal B and be good also equal a and this we should write so ax equals ax a y equals a YB x equals B xB YB b y equals b y a x equals oh boy this is getting really bad let's go over here for a second right I have two points ax I I have a 1 and B 1 Oh this camera is off let's take a minute to actually like really figure out what's going on here right because I have to it with two toothpicks I have a one and I have b1 and I have a 2 and I have b2 so I want to make sure so I have 4 points I want to make sure that a 1 and a 2 are not the same that a 1 and B 2 are not the same I want to make sure that B 1 and a 2 are not the same and that B to know that B 1 and B 2 are not the same so yes there are four possibilities here and if any of those are the same and by the way this is this could a could be this one could be this and other could be two right it's not one and two are this in other so what I'm doing is checking to see if other a is equal to this a or if other a is equal to this B or if other B is equal to this a and if other B is equal to this be so insane I'm really doing a horrible job at this return and then if none of those are true we're gonna return though oh I I should be taken to the coding sanatorium right if none of these are true return null why why what what what error could you possibly look at you possibly have to complain about and why is oh I'm zoomed in Matthieu you said a other a is equal to this be other a other a this a other a is equal to this be an end point can also touch a center let's get roll it off now we're turn off boolean yes return false thank you oh yeah no you know what so someone in the chat is suggesting that they can also touch a center and while that's true well that's true I never have to check for that because I'm always placing them at the center and so and so and and so once I whenever I add a new toothpick it's never the new toothpick its endpoints are never going to be touching another toothpick Center and I only need to check the new ones so that's an important important one I should use vectors instead of integers I know I know right I know I know okay oops all right so this error is because I need to return false and I am also getting the question about couldn't a toothpick be touching the center so here's the thing there's also another really important piece of this that I kind of have in my head but I don't think I really like to talk through which is that now I need to check this toothpick or its end points free yes now I don't ever need to check this toothpick again once it's been added I actually don't need to check it again and so the idea of a toothpick touching another toothpick Center is actually irrelevant and I don't think touching or intersecting these are actually gonna be at exactly the same point the way that I've done the math so I know maybe I should say intersecting you're touching but I don't actually have to check this out I don't think we'll find out we'll find out if I have the correct code okay so now here so now if if okay oh you know what oh oh I went I went so off the beaten path the way that I've written this oh oh the way that I've written this I'm gonna go back the way that I have written this I actually I wrote two functions so this is just this is actually irrelevant in this function because I'm checking a separately from checking B so what I want to do oh let me go back I'm gonna do this a different way boy this is gonna be a fun editing project an endpoint with a toothpick yeah I just want to check the endpoint I'm actually not checking to toothpicks I'm checking an endpoint with all the other toothpicks I have other stuff to do today people I think once I get the core idea of this down though it's gonna go really fast all right yes I'm sorry everybody I'm literally doing this again simplifying so I don't want any of this discussion about this and other an a and B and four possibilities whatever whatever all that is irrelevant I'm gonna do this in a different way it's slow mode K week - is slow mode off no but I think it actually might be I thought I'd put it on five seconds do I need to fix slow mode this is great it's good for me to have all these new viewers and have it I don't know what the f is for is this some kind of thing that I don't understand let's see a live control room I don't know how to find the slow mode thing use point objects instead of toothpick objects FFF okay I don't know what the f thing is I will I'm gonna I'm gonna push forward okay okay now because I've written this and kind of what is now arguably a silly quo so to fix wet fly somebody slow-mo that down I hope you could see that do we have smarter every day's like slow-motion camera somewhere available okay if it because I wrote this in a sort of silly way I'm writing a create a and create B function what I actually just want to do here is check the a and point against every other toothpick to see if two toothpicks have the same end point as each other to see if they're intersecting at that same end point and you know somebody did ask about toothpicks put a toothpick right I'm looking for the case where this is toothpick one and this is toothpick two and this is like point a and maybe it's the same as point A or B of another toothpick this is what I'm looking for but it is the case that toothpicks could also be intersecting the center of another toothpick but I'm pretty sure I don't have to check for that because once I add a toothpick if I add two more toothpicks sure this toothpick is intersecting here at the center of these two toothpicks but it done like I never have to check this toothpick again once I have added something that toothpick I can call it quits and only check the endpoints of these new toothpicks and by definition there can't there could only be the way this algorithm works out is you know these two are the two toothpicks here are intersecting at the end point so I'm pretty sure that's how it's going to work if you if you look at the demos of it and how it works I don't think I need to check the center okay at least I'm trying to convince myself so as long as it's not the same toothpick and intersects I'm going to write this rather awkwardly I'm gonna say intersects a X a Y with other with other then available is false and so maybe what I want to do is say like other dot intersects a X a Y so this is actually like o equals false so maybe this is kind of like a function inside inside of the toothpick class that it can check if it's intersecting any generic point so this is a little bit confusing what I'm doing when I write a boolean function that says intersects any arbitrary XY and I can say basically if a x equals x and a y equals y that is the case where I should return true otherwise if a be x equals x I'm just checking both points and again you know easily there's a 5ever way to do this I'm also going to return true otherwise is turn fall so basically this is the idea and these are integers and I can check for equality here because I'm doing all integer math if I had used P vectors and floating points I'd be worried about then I have to use the distance or something but as long as the a point and the B point of this toothpick is not equal to this X arbitrary X&Y point that I want to return false so now here comes the fun part this fun emoji if it's still available then what I want to do is return a new toothpick and the new toothpick Center the new toothpick Center is where it's at that point so the new toothpick is at a X a Y and it's Direction is what its direction as always the inverse so if this one's one this one's negative one if this one's negative one this one's one so it's just Direction times negative one otherwise otherwise return null ok so now we're going to go back here let's forget about next B let's forget about create B I also want to do something I'm gonna say no loop I want to control looping and then I'm gonna add mousepressed and in mousepressed I'm gonna call redraw this is so I can click the mouse through every frame so let's see if this works let's see if I can kind of condense the code a little bit so we can look at more of it at once and now if other does not equal this and other into I'm missing a parenthesis there let's go back here let's run this okay so now if I click I got a new toothpick I got a new toothpick new toothpick new toothpick so this is actually working but it's just doing that one endpoint so again I really should there's no reason for me to have two separate functions here but why not what I'm going to do now is in the toothpick I'm kind of just this is Terrell I do not like this at all do you not like copy pasting I'm gonna just call this create B I'm gonna say B X B Y and B X B Y so this is exactly the same function but checking the B endpoint and I could do this because a toothpick only has two endpoints but this doesn't scale this you can't generalize this to any kind of shape with any end number of endpoints so definitely gonna have to rethink this for maybe a future video I might make what look at that that kind of looks like the toothpick pattern so in some sense we're done but a couple things I want to do number one is I would like to I need to I there's a big optimization I can make here which is to only check the new toothpicks so one thing that I'm going to do is let's make these two different loops just two let's separate out the drawing from the like picking the next stuff the other thing I should do is when a toothpick is a new toothpick so let's call it a new new pic oh that's weird is true so and then the what I want to do here is when I draw it let's try it let's just try this for a second if it's a new pic say stroke let's make it blue and then by definition then new pic would be false so I just want to and actually let me not do that here so this should be now they're all blue okay so they're all blue when I knew all the new toothpicks are blue and then what I want to do here is I would say if T is a new pic like again I could probably keep it in a separate list but whatever if T is if T is a new pic and then then I could do all this checking and then say it's not a new pic anymore all right so this is this is going to limit all of the checking to only the toothpicks that were actually new the previous time and I could keep the next ArrayList from one cycle to the other but this I think will do the trick right now blue you can see this one is no longer blue only these are blue only these are blue so in theory I have now optimized this a bit faster okay so now going back to the code I can to get rid of this no loop I can let it just go on its own and we can see it's sort of filled up the screen really quickly so this is what I want to do here I want to use the scale function to as it grows sort of zoom out on the drawing so scale is a transformation that can scale what I'm seeing so for example if in the draw loop here I just say scale 0.5 you can see there it is at half the size if I say scale 0.1 we can see now we can see all those toothpicks and being added at a much lower scale okay okay so how do I have that dynamic so the way to have that dynamic is one way would be let's try to figure out maybe what the what toothpick is furthest to the left edge and furthest to the right edge so what if I have some global variables like min X which is equal to zero and and Max X which is equal to width oh and actually these should be negative so I because I'm because I am considering this around zero min X would be negative with / - max X would be positive with / - so negative 300 that's the sort of a minimum and maximum range to start so I could say of the difference is this the scale the scale that I want let's call that like by a factor is the maximum X minus the minimum X divided by the width right or actually width divided by that right because if the distance between the the furthest toothpick to one side and the furthest 2bic to the other side is twice as long as the actual width of the window then I want to scale it to 0.5 so but of course I need to find out these maximum and minimums so the way I can do that is I can actually just right here since I'm looping through all the pics and you know in theory like I'm going to get the scale for the next round but that's fine min X is the minimum whichever is smaller between the current pixs let's just use one end point I mean I could probably check both end points but let's just make sure this works and the current min value and the maximum is whatever is the biggest between B X sorry sorry ax and Max X right I think this should work factor is what did I get did I get like a the value of the local variable factor is not used well sure Oh scale factor true but that's not the era I'm getting but / 0 min max X minus min X Oh whichever one's bigger oh no no no no no no this has to be max X like right hand that run for a while there okay yep oh you know what are these these are all integers ah these are all integers so integer math is gonna give me zero there we go okay so now I am scaling inter and according to and you know as you dude these are getting I'm scaling according to the distance between the sort of like furthest toothpick and the furthest toothpick along the x-axis I could do this along the y-axis there's probably a lot of smarter ways to do this but this will work right now so the other thing that I might like to do is calculate this factor you should probably store this as a global variable also because I kind of want to use it and you know what I could actually do I could just do this I could I could pass it in here because what I want is also the stroke weight to be maybe inversely proportional to the factor so like as the factor is getting smaller I want the lines to be thicker so that maybe they show up better yeah I don't know if this is really reading but like as they're shrinking the lines are getting thicker goodbye YouTube compression algorithm but you can see the idea here so this is gonna run really slow I have not super optimized this but what would be fun to try is and maybe I should just make them a little bit thicker like two times that what would be fun to try what I would like to do is to see if I can make a nice full screen version of this in p.2d will that help so here we go here is the tooth I'm sure the YouTube compression algorithm is making this impossible to watch but here is the tooth pick number series from the numberphile channel visualized using Java in processing now it's running super slow I kind of what I want to do but I should check the number series so let's actually check that number series let's do print one more time print line what do I want to do I want to check how many toothpicks there are pix dot size and let's change the frame rate to 1 and let's open up the console let's put it back to a smaller size and let's open up the console so I can see this better all right so here we go 1 3 7 11 15 23 35 43 47 55 6779 195 120 is this right I really hope this is right let's check I hit stop what stay yes okay let's go back to that number sequence site cross-check this I didn't use 0 1 3 7 11 15 23 35 43 47 55 67 thank you so by the way you should watch that numberphile video you should look at these you should try there are so many other ones and there's different shapes toothpick on a hexagon whoa a reset reset reset look at this oh no wait wait hold on reset reset toothpick on a hexagon oh boy whew so there's so many interesting possibilities here of things you could try let's look at there's one that's like a nice maybe it's the e toothpick that's kind of like snowflake like yeah look at this one oh that's so I really wanted so maybe next week for my holiday special I'll try to do this one but you should explore all these Washington of her file video expand this refactor the code make your own version I will release a version of this that also runs in JavaScript that you can do that to run in the web browser so you can check this video's description and share with me your variations in color and animation and how you think about doing this I can't wait to see what creative stuff you make ok good bye ok this has been a 2 and a half hour live stream it's 1 o'clock and I'm looking at my email which I should not be doing time to unbox use a map Elmer is saying use a map data structure where the key is the endpoints and the value is the number of toothpicks touching it Oh interesting that's a great idea don't forget to scale against height yeah you know Iran is saying you're still checking every newly toothpick against all of them I am but I don't know if I that I don't know what's an optimization around that like which ones can I skip I am I just checking like the last round Oh am I only checking in the new ones against the also the new ones no hold on let's look at this oops right so the next toothpicks clearly I mean they're intersecting against this toothpicks from their current round same here but these toothpicks hit the end point of this toothpick which is from a previous round so I think I do have to check I think I have to check I can't just check the new toothpicks against other new toothpicks yeah so I'm not sure thank you graven developed mole this dot channel dot donate that's cute I love that why is this really showing up time to unbox that uke yeah I did say I was gonna do that I definitely can't do any coding I am done coding I am actually recording this to disk amazing and you just just so I make sure it captures for once I remembered color the toothpicks based on their XY mapping between 0 and 360 for hue that way you get a rainbow you should do that swirl studios and then submit it alright you asked for it you're getting it overhead camera not not a sponsor buzz marketing this ukulele company so the previous ukulele was a very inexpensive ukulele that was less than $30 this is a bit more is not a super expensive one but it's a should be a bit nicer with nicer strings it's also concert size it's a little bit bigger instead of soprano which so I can play some holiday coding songs on it next week and it comes with some accessories like a tuner right definitely gonna need right now a strap ooh there's actually a strap how interesting I wanted to find a rainbow ukulele but all of the ukuleles that had crazy weird patterns on them seem to not be of high quality if I put a sticker on this ukulele is that going to cause a problem and then this in theory is the strap do I unscrew this and so mechanically challenged how do I attach this to that maybe I don't need to worry about the strap right now but there are these two right the strap goes on these things okay so that's the strap else do I have some sort of oh my god pick case and a pic never used a pic with a ukulele oh by the way I am NOT a musician and I have extra strings please read other side before contacting or returning the ukulele please do not return it to the retailer okay alright there's some nice information this is a tuner a ceg right do I need a bat I'm ight need a battery for this shoot you may need to flip the battery around okay oh there's a battery in here there's two batteries wow you really thought of everything except for the fact that I am completely mechanically challenged push the metal through the strap hole and it should stay so which way does this go one side is the positive side this is the positive side positive side goes goes which way negative side does it say here well we'll just try it one way let's try it this way this is my best guess very little chance this is right you know what yeah this has got to be this way right it's kind of click on in there there we go okay maybe that's not right well good thing I have all these toothpicks ah must be the other way yep now the tuner is on and [Music] this should this one see ace this should be gee I still want to do that coding challenge [Music] really right a yes sorry everybody [Music] should I say for you so many of the chats on the AE a AE see I have a sexy [Music] sorry attitude alright so this is ready for a me gotta tune it bunch of Dimes hopefully it will hold its to fairly recently but this will be ready for next week so send me your I've got twenty one I should get rid of this here 21:21 Christmas songs I suppose I could try to learn some Hanukkah songs or some other holiday songs for other holidays around this time of year some of them are easy they're like two chords like jingle jingle bells probably three chords right well let's go to it let's find that any song that I have in this book you can send me new lyrics [Music] [Applause] [Music] so uh-huh right so now it's pretty easy gingka files so in order to solicit your donations I will be making a fool of myself and embarrassing myself next Thursday playing coding holiday theme mute coding themed holiday music on this ukulele while on a live internet stream so thank you all for tuning in thank you for watching the coding train this has been a lot of fun I don't know I feel like the Fortier thing worked out pretty well but I feel like the Fourier thing worked out pretty well but it was kind of long - big thing was kind of a mess I don't know unknown gamer asks is it hard to learn ukulele in comparison to guitar easier I would guess easier because I never like I started trying to teach myself that ukulele like three months ago something like that somebody find when I first did it in a you know annakodi trade so I have I can play the piano a little bit well [Music] all right okay uh I'm exhausted I'm gonna go have some lunch answer all my emails thank you everybody for tuning in welcome new viewers if the today was the first time you watched Thank You of today was like the hundredth time you've watched thank you you can I would love to hear any feedback you can let me know on Twitter [Music] I'm gonna clean up all these to fix later oh my god and I will see you all ah in a future coding Train episode uh so also if you don't know I will make edited versions of these two coding challenges they'll come out sometime next week I have to fix my shirt now and I will uh well thank you for watching this has been wonderful I've really enjoyed being with you today and I am going to click the stop streaming button oh no it's over here someday I'll have an outro coming soon someday and here we go I know so sorry you just joined you as soon as I stop this you'll be able to watch the whole thing back if you feel so inclined

Channel: The Coding Train

Views: 31,729

Keywords:

Id: pKyU92cza0Y

Length: 166min 30sec (9990 seconds)

Published: Fri Dec 14 2018