Sothatintheway, drawLoop's tracksmelikenootherfunctionsomewaydrawyou I don't wanttostopcodingNowyouknowthissongisdedicatedThioprocessingmyfirstlove, MyoneTrue, huh?
HappyFebruary 13 oneofmyfavoritedaysoftheyear.
First, he's not I did.
Youhearthatrattle?
Itistheukulelebecauseithas a weirdrattle.
Andso, mebeingthemechanicallymindedpersonthan I amverymechanically, youknow, reallygoodwithtoolsandbuildingandputtingthingstogether.
That's sarcasm.
YouhearmyvoiceTerrible.
Itallthatstuff.
I foundthisscrewdriverand I triedtighteningallthesedifferentscrewsthat I foundalloverthisthing.
But I don't know, stillrattles s Soifanybodywantstosubmitotherloveodestoprocessingormaybethe P fiveJsorothertypesofprogrammingthings, I willsinkthoselateron.
Today's heartthemedcodingtrainepisode.
Allright, sowelcome.
Goodmorning.
MynameisDanonboothCodingtrain.
Um, thisis a livestreamthatnowhappenseveryWednesdayat 10:30 a.m. Eastern.
Believethat I haveanactualregularlyscheduledtime.
AllofyouhavebeenaskingComeherenextweekatthisexacttime I willbehere.
Speaksupforwhat?
I cancel.
Somethinghappenslikesnowtourforlike, a beatingcameupthatday a differentday.
Hopefully I haven't.
I can't bringmyselftoactuallyputonthetopoftheYouTubebannerlikeeverywentliveeveryWednesdayat 10:30 a.m. Because I'm afraidthatwilljinxmyself.
Sothisis a, uhthisistheresultofthecodingchallengethat I didlastweek, and I don't rememberwherewhatthesettingshereissomewhatarbitraryintermsofthefadingandtermsofsomeofthesevalues.
Letmerunthisagain, So I kindofwantedtocontinuewiththisthisweek, But I don't know.
Thingsdidn't gowellformeinthelastweekafterputtingthiscodetogether, but I dowanttotalkabouthowtheystillwanttodosomefollowupvideosaboutthat.
So, uh, letmebeginbytalking a littlebitaboutfluidsimulationandwheremyheadisthatwiththat.
So I want I wanttotalkaboutIfyouthinkso.
Thisiswhatyou'reseeing.
HereistheresultofmeportingcodefromMikeAsh.
It's a bloggerpostcalledFluidDynamicsorfluidsimulationorsomethinglikethatforDummies.
Butwithchangingthewayyourenderthedesignchangingthevariousparametersofthedesign, youcouldprobablycreate a varietyofdifferentkindsoffluidlikesimulations.
However, thisisnotmanypeoplehavegonebeforemetocreateversionsofthisinmorethoughtfulandsophisticatedways.
Somyoriginalplanwasjust a portthecode, which I didthenextstep, I wasgoingtotrytorefactorthecodeondhe.
I startedworkingonthat a littlebit.
I wanttoshowyouwhere I gotto, becausemaybesomeofyoumighthavesomesuggestions.
So I'm gonnagotogethubdotcomslashsiftShiffmanslash c f d.
The C F.
D standsforcomputationalfluiddynamics.
Andtheseweresomeliketheseweresomethingliketestbitsofcodethat I puttogetherbefore I didtheactualLifestream.
Sothislookslikeitis a particlebasedfluidsimulation, whichisreally, reallywhere I wanttoget, too, withallthisstuffon, andyoucanseethepathofthesedotskindofmovingaroundthiscircle, can I movethatcircle?
I canmovethecircle.
That's kindofcool, I mightsuggestitsurprisedmethatitwentthecolorofthebackgroundwhen I clickedit.
So I mightif I weregivingmyquickoffthecufffeedbackhere.
I mightconsider a differentcolorchangeforwhen I clickanddrag, but I canLet's try.
Andthisisverycommonin a lotofdifferentSilerautomataalgorithmsthatinvolveddataon a gridondhe.
Thenalso, there's thisideaofdensitywhichwhich I mightthinkaboutrenamingtodiebecauseit's theamountofdieatanyspotinthefluid.
Andthat's howweendupvisualizingwhetherwe'reusing.
We'vemappedthatamountofditua, Hugh, orto a brightnessvalue, andthen s isthepreviousamountofdie.
So I hadthisideathatletmeletmeand I wasgonnadothislive.
But I thought I wouldtrythefirststepsofit, whichyoucanseehere.
Andthisismyfluidrefactor.
Andif I gohere, I hadthisidea.
Okay, Well, whatif I hadlike, thisideaof a velocityobjectanditwasactually a p vectorobjectandthevelocityobjectknew a currentvelocityin a previousFlossie.
Sohey, I'm justtryingtogetsomenewvariablerenamingtomakethecode a bitmorereadable.
Butalsoandthenif I had a diobjectwhichwouldjustbe a scaler.
Thisisnot a newidea, andinfact, researchingthis a bitmore.
I foundanotherlibrarycalledpixelflow.
ItslastcommitwasprettyrecentthatOh, no, that's notthereasonthat's a yearago.
Lastcommitwas a yearago, butyoucanseeithas a lotoffunctionalityforthis.
Theseideasondheifyouyoucandownloadand I actuallyransomtheseexampleswhicharequiteOh, herewego, Uh, whichyoucanseearequiteexcitingandamazing.
Sothisisaninterestingpossibilityformetolookintoactuallyjustusing a librarywhereallofthishasalreadybeensortofrefactoredandreorganizedin a waythatmakesitusefulforfor, like, makingtheprojects.
Thereisalso M s, a fluid, whichis a librarythat I usedmanyyearsago, whichistheexactsamealgorithmthat I implementedbutthoughtfullypackagedinto a librarybutnotcurrentlycompatiblewithprocessing.
Threequicklychecked.
I thinkthiswouldrequire a smallamountofworkworkthat I couldactuallytotoupdateittoeworkwithprocessingthreemoreeasily, Sothat's a possibility.
But I I'vebeenintouch a littlebitwithGabriel.
WhymouthwefindGabriel?
WhymouthonTwitter?
Um, Gabriel.
Why?
Mouthis a researcherspecificallyinfluidstructureinteractionsbasedintheUKThisisthewebsiteandGabrielwhy?
Mouthhascreatedsomethingcalled a lilypadprocessing, whichisand I'm onlyjustdownloadthis.
I'm gonnaLet's let's take a moment, causethiswillactuallyjustrunrightoffthebat.
Thepackagecontrol p fivedoesn't exist, whichmeansthisisdependentonanotherlibrary.
Ifwequitthis.
These, bytheway, isthere.
Sosketchimportlibrary, addlibrary.
I'm gonnaaddcontrol P five, whichisinterfacelibrary, whichit's muchhardertodointerfaceelementsinanelegantandflexiblewayandprocessing p fivejazzbecauseyou'reinthebrowserbeingabletomanipulatetextboxesandbuttonsandslidersandcreateaninterface.
There's somanymorepossibilities, giventherichsetoffeaturesthat a browseraffords.
Um, okay, soletmeNow, tryrunningthisagain.
Sotherewego.
Okay.
Sowecanseethisis a similarideaofyetanotherfluidsimulationexample.
Firstofall, I got a lotofstufftime I couldreallyspendonthisfluidsimulation I'm sofascinatedby.
I wanttoOh, I wantto, umuh, but, um, soonepath, whichmyoriginalpathwastokindofrefactormycode, makeit a littlebit.
Trytounderstandhowthealgorithmswork a littlebitmoreandexplainthosethingsthatwilltakesometimeandresearchonmypart, whichis a littleatypicalforhow I dothingswhichismoreflybytheseatofmy, uhumpants.
Sothat's onepossibility.
Theotherpossibilitywouldbetoleavethatfluidvideoaloneandgostraighttousing a library, whetherit's pixelflowandit's a fluidorlilypad.
Allthree.
Sothat's what I'm lookingforthoughtsandsuggestionsabout.
But I'm goingtoleavethat, umNow I'm I likelookingoverhere, and I'm seeingsomewouldsayheisnotlookingatchatquestionMark.
Sono, I amnotlookingatJackexceptforeveryoncein a whileand I tolookatthat.
I willjustmentionthat I make I havesomevideosthatairforcourtsthat I teachat N Y u thatareunlistedbecauseThey'respecificallyonlyforthatcourse, butthey'rejustatadministrativevideos.
Mysortoftechniqueforthewaythat I doitiswhen I havecontentvideosfor a course.
I havethosepubliconYouTube.
Okay.
Umokay.
Um, whatam I tryingtodo?
Right.
Sowhatam I doingtoday?
Uh, whatam I doingtoday?
So I wantto, um, letmepulluptheOh, mygoodness.
Simon.
Wow.
Sofirst, letmetalkaboutSimon.
Simonis a viewerofthecodingtrain I'm gonnado, Simon, andwe'regonnagetSimon's YouTubechannel, andwe'regonnaclickoverhere.
ThisSothisis a veryfamouspatterninmathematicscalledcardioaid.
Thereis a videoonthemythology, a YouTubechannel, whichis a fantasticyoutwogentlemen, mathematicsaboutusingtimestablestotovisualizethiscardioaidshapethecardioandshapeappearsin.
AmandaBroughtsaiditappearsanddiagramsoff.
Kindoflikepatterns.
There's a newexplanationinthisvideoofhowyoucanseethecardioandpatternin a inthetopof a coffeecupbasedonlikethewaythelightbouncesoffofitandreflectsoffthecoffee.
AllsortsoffascinatingstuffHereSimonSimoncreated a created a poster I havewhich I havedownstairshanginginmyoffice.
I should'vebroughtitupheretoshowyouvisualizingallofthetimestablesininprocessinginspiredbythisparticularvideo.
AndthisisSimongiving a presentationaboutitatprocessingCommunityDayAmsterdam.
Sothesearemytwoinspirations.
I thinkVaiHeartalsohassomevideosaboutthecardiooIdum, andaboutGeneral, generallyspeakingbyhearthasamazing, wonderfulonemindfillingsoulbeautifyingvideosaboutmathematicsanddifferenttypesofthings.
So I encourageyoutocheckouttheworkofbyheart.
Ifyoudon't already, Um, I neverlookatthechat.
Esoslowmodeisnotagain.
Notonagain.
I know I'm forgettingtonotputslowdowninthechat.
Well, we'llseeif I needto.
We'llseeif I needThioWe'llseeif I needtopullthiscarover.
Kidspullthecarover.
So I wouldliketodothis.
UmAndso, inhonoroftryingtoavoidsayingValentine's DayButterstosay, Valentinetoday, onceinhonoroftomorrow, I wouldliketomake a heart.
AlthoughyoumightbewatchingthisonFebruary 14thorsomeotherdayinthefuture, I wanttoexpressmyloveforprocessing, processing, a programminglanguageandenvironmentthatstartedin 2001 CreatedbyCaseyReeseandBenFry.
Processfoundationdotorg's and, um, I forgottoblowmytrainwhistle.
Atleastthere's notimerrights.
Nate.
TheLet's Let's let's movethisalong, people.
Hello, I'm here.
It's February 13th.
I amfeelingthelove I wouldliketoexpressmyloveforprocessingmyfirstprogramming.
Lovemyonetrueloveprocess.
E expressitbycreatingthis.
Thisis a famousshapeandmathematicscalledtheCardioaid.
If I'm pronouncingthatcorrectlycardio, I'd likeheart.
It's kindoflike a heart, andtodayitmightbesomeothervideosafterthisonewhere I makeallsortsofheartpatterns, but I justwanttomakethispattern.
Ifyouwannalearnmoreaboutthisshapeandwhereitappearsinmathematics, I wanttopointouttoyouthiswonderfulYouTubechannelcalledmythologyer, mythology.
Orhas a videocalledTimesTablesMandelbroughtandtheHearttheheartofmathematics, withmathematicsandprocessingandcodeandallthatsortofstuff.
Now I shouldalsopointoutthatrenderingananimationofthesetimestablesinprocessinghasbeendonebefore, onmostnotablybySimonTiger.
Andoneofthings I loveaboutCrossingthisyeariswherethere's beenthisworldwidesetofcrossingcommunitydaysrecentlyinAmsterdam, SimonpresentedhisworkoncreatingthisverylargeposteraboutthetimestablesprosecutedAmsterdam.
I wasjust a prosecutortodayinNewYorkovertheweekend.
Myheartisdefinitelyfullof, like, loveandwonder, withallthethingspeoplearedoingwithprospectsofthisvideoisdedicatedtoallofthepeoplewhoareworkingonprocessingand p fivejazzandfellowshipsandeverything I loveyouallknownoweverything's gonnagowrongcause I startcoding, youknow, Sothisthisshapeyoucanfinditinlookingatthewaysoflightreflectsaround a circle.
Everybody, um, Sowhatitusedtobe, I swear, inanoldversionofprocessing, wherever I wouldleavethewindow, itwouldkindofrememberitandThenwhen I wouldrunitagain, itwouldendupthere.
Itjustdoesn't dothatanymore.
Itreallymakesmecrazy.
There's probably a way I couldmodifylikeyoucando.
Like, I don't getlostinthis, butjustgiveme a second.
Justcurious.
No, itdoesn't workanymore.
I havetoinvestigatethattry.
Allright, allright, allright.
Soletmestartwritingsomecodecircle.
Okay?
Sonowwhat I needis I need a numberofpoints.
Soletmecallthislike, thisiswhatThisscale, thedevisedor I knowwhattocallthis.
Totalpoints.
Justcall a total.
Allright?
So I'm gonnamakeitafloat.
Let's keepitasanintruderforrightnow.
I'm gonnachangeitto a floating a littlebit.
You'llseewhy.
Sonow I'm goingThio, I needtodo a loopanddrawallthosepoints.
I wantthecenterofmy, uh, visualization.
I wanteverythingtobewell, I wanteverythingtobeorientedaroundthecenter, goingtotranslatetothecenterwithdividedbytwoheightdividedbytwoonandthenthisiswherethatpolarcoordinatesthingcomesin.
I needtofigureouttheway I'm goingtofind.
Allthosepointsisright.
Therearehowmanyslicesofpiehere?
123456789 10.
Howconvenient.
So, beach, oneoftheseanglesistopidividedby 10.
Sothat's howmuch I needto.
That's whereeachoneofthesepointsgoes.
So I'm goingtosay, uh, a Delta, thesortoflikeDeltaangle, we'lljustcallitDeltaequalstwopi, dividedbytotal.
Andthen, um, anotheractually, anotherthing.
Thatway I coulddoit.
I couldjustusemapso I couldsayangleequalsmap I, whichgoesbetweenzeroandtotaltwobetweenzeroandtwo.
Piemightbeaneasierway.
Theydon't actuallyneedthisdelta.
Andthen I need a radius.
Sowhichisbasically I needtoknowlike, Well, howwhatistheradiusofthiscirclethat I'm visualizing?
Andthen I wanttosay X equalsourtimescosignoftheangle.
Whyequalsourtimessineoftheangle.
And I willreferyoutomyvideoaboutpolarcoordinatestounderstandtheseparticularformula.
Um, pasta a second.
I seethatthere's somesuperchatsflyingby.
Thankyousomuch.
When I finishthiscodingchallenge, I will.
Thankyoumoreproperly.
Thankyou.
Umandthenthenextthing I justwanttodoisdraw a point.
So I'm gonnasay I'm gonnamakeitinlips.
Fill 2 55 Ellipseat X Y andOh, thankyou, BenFry.
I'm goingtocallthiscircle.
There's a circlefunctionnow.
Uh, 16.
I loveusingthese.
Okay, solet's see.
Whatdo I get?
Therewego.
Look, youcanseethere's my 10 dotsaroundthecirclenow.
I probablywanttobeabletoseethatcircle.
Thatwouldbenicetoo.
Soletmesaystroketo 55.
No, Phillipsandthistranslateneedstocomebeforedrawingthis.
I justwanttodraw.
I knowit's a circle.
It's a circleat 00 aretimestowritebecausethecirclefunctionexpectsthediameters.
Theradius, timestwo.
Sonowwecansee.
Therewego.
I havemycirclewithallmypoints.
Now I needtodomymaththing.
Allright, So, uh, I'm gonnahave a value.
I'm gonnacallthisend.
So n isgoingtobeWhatisthetimesamountthat I'm goingtomultiplyeachnumberby?
Sothere's total.
There's a lotofdifferentparametersinthesystem, andyoucanplaywiththemtocreateallsortsofdifferentkindsofpatterns.
Hopefully, we'llseesomeofthosebythetime I gettotheend.
Butrightnow, I'm gonnamakethis a twotimestabletotrytogetthatheartthatcardioaid.
So I'm gonnacallthatelectricalhadfactor.
Let's callthatfactor.
Um, let's I'm gonnaputthatuphere.
Thinnedfactorequalstwo, and I'm surethere's a niceway I coulddoallthistogether, but I'm gonnadothisas a separateloop.
Sonow I'm gonnadothisagain.
Obviously, I'm just I willrefactorthislateras I liketosay, butwhat I wanttodois I wanttosay a is I like I wanttogofrompoint A topoint B, whichis I timesfactor.
Thoseareessentiallymyindicesoflike, where?
Where I'm connectingthelines.
Sozerogoesfrom 01 goestututugoestofourandthen I need a functionItactuallythiscouldbereallyusefulformetowrite a functionthatreturns a p vector, Um, givingmethe, uhgivingme a given a p vectorforanygivenindex.
So, uh, sogetvectorforanygivenindexandthenSobasically, I couldsaytheangleismapthatindexbutwhichgoesbetweenzeroandtotalbetweenzeroandtwopiandthenthevectorequals a new P vectoratandthiswouldbe a globalvariable.
Are, um I cannotsetthewithupherebecauseitdoesn't knowwhatthewithisgoingtomake.
I couldmakethatargumenttothisfunction, butjustgonnakeepthatas a globalvariablemake a newpeopievector.
AreareTimesCosign.
Actually, P factorclasshassomethinginit p vectorfromangleanglethatwillmakethevectorpointinginthatdirection.
Andthen I justwanttomultiplyitbythearetosetittobethatandthenright.
So I'm usingsomevectorstuffhere, which I realizeisnowmaybe a littlebitbeyondthescopeofIfyouwerecomingtothisvideo, justwithoutknowledgeofhowthe P vectorclassworksinprocessingorin P five, whichis a P fivevector, it's justanobjectthathasan X and A Y.
Soit's a nicewayformetostorethe X and Y together, and I canmakethe X and Y componentsfromanangle, andthen I canscalethatbymultiplyingitbysomeradius.
Soin a multipliedbyourandsayreturnourandthenactually, since I'm hererefactoringthis, I couldsayrighthere p vector V equalswhat I callthatfunctiongetvectorbasedoneyeonthemissionbellsay v dot x v dotwhite.
So I basicallyjusttookthatcodeandputitinto a functionthat I'm probablygonnaneedtodothisquite a bit.
And I don't wanttoreturnour I wanttoreturnveywell, thisislikewhat I'm doingsofar, I thinkthismightactuallywork.
Okay, sonow I wanttosay, getvectorfor I andthengetvectorfor I timesfactor.
Butguesswhat?
It's notjusthightimesfactor, right?
Whatsuffer?
Sowhy?
Oh, thiswouldbe a P vector.
Thisshouldbe a p vector.
Soit's notjust i timesfactor, although I guess I couldrewritethisfunction.
Itdependsonwhere I wanttoputthis.
I'm gonnaputithere, So I needsomewheretodealwiththefactthatwhen I dosixtimestoo, I get 12.
But I reallyjustwanttobecause 12 dividedby 10 isoneremainderto 12 module.
0 10 istothemodule.
Oh, operator, which I have a video.
Thankyou.
Go 11 aboutmodeloisalsolinkednow.
Okay, They'resomewherein a cornerofthisscreen.
Okay, sonow, righthere.
I couldjustaddthathere, MaDjalototal.
Allright.
So I don't think I'd actuallydrewthoselines, butthisisstillworking.
That's there.
Now, I shouldbeabletosayline a dotExe a dot y b dotexe b dot y.
It's backwards.
Whatdoesthatmean?
It's notbackwards.
Oh, because I startedoverthere.
Interesting.
So a couplethings I coulddo, I couldjustcalllikethescalefunctiontoflipittheotherway.