babylon.gui.js 759 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328332933303331333233333334333533363337333833393340334133423343334433453346334733483349335033513352335333543355335633573358335933603361336233633364336533663367336833693370337133723373337433753376337733783379338033813382338333843385338633873388338933903391339233933394339533963397339833993400340134023403340434053406340734083409341034113412341334143415341634173418341934203421342234233424342534263427342834293430343134323433343434353436343734383439344034413442344334443445344634473448344934503451345234533454345534563457345834593460346134623463346434653466346734683469347034713472347334743475347634773478347934803481348234833484348534863487348834893490349134923493349434953496349734983499350035013502350335043505350635073508350935103511351235133514351535163517351835193520352135223523352435253526352735283529353035313532353335343535353635373538353935403541354235433544354535463547354835493550355135523553355435553556355735583559356035613562356335643565356635673568356935703571357235733574357535763577357835793580358135823583358435853586358735883589359035913592359335943595359635973598359936003601360236033604360536063607360836093610361136123613361436153616361736183619362036213622362336243625362636273628362936303631363236333634363536363637363836393640364136423643364436453646364736483649365036513652365336543655365636573658365936603661366236633664366536663667366836693670367136723673367436753676367736783679368036813682368336843685368636873688368936903691369236933694369536963697369836993700370137023703370437053706370737083709371037113712371337143715371637173718371937203721372237233724372537263727372837293730373137323733373437353736373737383739374037413742374337443745374637473748374937503751375237533754375537563757375837593760376137623763376437653766376737683769377037713772377337743775377637773778377937803781378237833784378537863787378837893790379137923793379437953796379737983799380038013802380338043805380638073808380938103811381238133814381538163817381838193820382138223823382438253826382738283829383038313832383338343835383638373838383938403841384238433844384538463847384838493850385138523853385438553856385738583859386038613862386338643865386638673868386938703871387238733874387538763877387838793880388138823883388438853886388738883889389038913892389338943895389638973898389939003901390239033904390539063907390839093910391139123913391439153916391739183919392039213922392339243925392639273928392939303931393239333934393539363937393839393940394139423943394439453946394739483949395039513952395339543955395639573958395939603961396239633964396539663967396839693970397139723973397439753976397739783979398039813982398339843985398639873988398939903991399239933994399539963997399839994000400140024003400440054006400740084009401040114012401340144015401640174018401940204021402240234024402540264027402840294030403140324033403440354036403740384039404040414042404340444045404640474048404940504051405240534054405540564057405840594060406140624063406440654066406740684069407040714072407340744075407640774078407940804081408240834084408540864087408840894090409140924093409440954096409740984099410041014102410341044105410641074108410941104111411241134114411541164117411841194120412141224123412441254126412741284129413041314132413341344135413641374138413941404141414241434144414541464147414841494150415141524153415441554156415741584159416041614162416341644165416641674168416941704171417241734174417541764177417841794180418141824183418441854186418741884189419041914192419341944195419641974198419942004201420242034204420542064207420842094210421142124213421442154216421742184219422042214222422342244225422642274228422942304231423242334234423542364237423842394240424142424243424442454246424742484249425042514252425342544255425642574258425942604261426242634264426542664267426842694270427142724273427442754276427742784279428042814282428342844285428642874288428942904291429242934294429542964297429842994300430143024303430443054306430743084309431043114312431343144315431643174318431943204321432243234324432543264327432843294330433143324333433443354336433743384339434043414342434343444345434643474348434943504351435243534354435543564357435843594360436143624363436443654366436743684369437043714372437343744375437643774378437943804381438243834384438543864387438843894390439143924393439443954396439743984399440044014402440344044405440644074408440944104411441244134414441544164417441844194420442144224423442444254426442744284429443044314432443344344435443644374438443944404441444244434444444544464447444844494450445144524453445444554456445744584459446044614462446344644465446644674468446944704471447244734474447544764477447844794480448144824483448444854486448744884489449044914492449344944495449644974498449945004501450245034504450545064507450845094510451145124513451445154516451745184519452045214522452345244525452645274528452945304531453245334534453545364537453845394540454145424543454445454546454745484549455045514552455345544555455645574558455945604561456245634564456545664567456845694570457145724573457445754576457745784579458045814582458345844585458645874588458945904591459245934594459545964597459845994600460146024603460446054606460746084609461046114612461346144615461646174618461946204621462246234624462546264627462846294630463146324633463446354636463746384639464046414642464346444645464646474648464946504651465246534654465546564657465846594660466146624663466446654666466746684669467046714672467346744675467646774678467946804681468246834684468546864687468846894690469146924693469446954696469746984699470047014702470347044705470647074708470947104711471247134714471547164717471847194720472147224723472447254726472747284729473047314732473347344735473647374738473947404741474247434744474547464747474847494750475147524753475447554756475747584759476047614762476347644765476647674768476947704771477247734774477547764777477847794780478147824783478447854786478747884789479047914792479347944795479647974798479948004801480248034804480548064807480848094810481148124813481448154816481748184819482048214822482348244825482648274828482948304831483248334834483548364837483848394840484148424843484448454846484748484849485048514852485348544855485648574858485948604861486248634864486548664867486848694870487148724873487448754876487748784879488048814882488348844885488648874888488948904891489248934894489548964897489848994900490149024903490449054906490749084909491049114912491349144915491649174918491949204921492249234924492549264927492849294930493149324933493449354936493749384939494049414942494349444945494649474948494949504951495249534954495549564957495849594960496149624963496449654966496749684969497049714972497349744975497649774978497949804981498249834984498549864987498849894990499149924993499449954996499749984999500050015002500350045005500650075008500950105011501250135014501550165017501850195020502150225023502450255026502750285029503050315032503350345035503650375038503950405041504250435044504550465047504850495050505150525053505450555056505750585059506050615062506350645065506650675068506950705071507250735074507550765077507850795080508150825083508450855086508750885089509050915092509350945095509650975098509951005101510251035104510551065107510851095110511151125113511451155116511751185119512051215122512351245125512651275128512951305131513251335134513551365137513851395140514151425143514451455146514751485149515051515152515351545155515651575158515951605161516251635164516551665167516851695170517151725173517451755176517751785179518051815182518351845185518651875188518951905191519251935194519551965197519851995200520152025203520452055206520752085209521052115212521352145215521652175218521952205221522252235224522552265227522852295230523152325233523452355236523752385239524052415242524352445245524652475248524952505251525252535254525552565257525852595260526152625263526452655266526752685269527052715272527352745275527652775278527952805281528252835284528552865287528852895290529152925293529452955296529752985299530053015302530353045305530653075308530953105311531253135314531553165317531853195320532153225323532453255326532753285329533053315332533353345335533653375338533953405341534253435344534553465347534853495350535153525353535453555356535753585359536053615362536353645365536653675368536953705371537253735374537553765377537853795380538153825383538453855386538753885389539053915392539353945395539653975398539954005401540254035404540554065407540854095410541154125413541454155416541754185419542054215422542354245425542654275428542954305431543254335434543554365437543854395440544154425443544454455446544754485449545054515452545354545455545654575458545954605461546254635464546554665467546854695470547154725473547454755476547754785479548054815482548354845485548654875488548954905491549254935494549554965497549854995500550155025503550455055506550755085509551055115512551355145515551655175518551955205521552255235524552555265527552855295530553155325533553455355536553755385539554055415542554355445545554655475548554955505551555255535554555555565557555855595560556155625563556455655566556755685569557055715572557355745575557655775578557955805581558255835584558555865587558855895590559155925593559455955596559755985599560056015602560356045605560656075608560956105611561256135614561556165617561856195620562156225623562456255626562756285629563056315632563356345635563656375638563956405641564256435644564556465647564856495650565156525653565456555656565756585659566056615662566356645665566656675668566956705671567256735674567556765677567856795680568156825683568456855686568756885689569056915692569356945695569656975698569957005701570257035704570557065707570857095710571157125713571457155716571757185719572057215722572357245725572657275728572957305731573257335734573557365737573857395740574157425743574457455746574757485749575057515752575357545755575657575758575957605761576257635764576557665767576857695770577157725773577457755776577757785779578057815782578357845785578657875788578957905791579257935794579557965797579857995800580158025803580458055806580758085809581058115812581358145815581658175818581958205821582258235824582558265827582858295830583158325833583458355836583758385839584058415842584358445845584658475848584958505851585258535854585558565857585858595860586158625863586458655866586758685869587058715872587358745875587658775878587958805881588258835884588558865887588858895890589158925893589458955896589758985899590059015902590359045905590659075908590959105911591259135914591559165917591859195920592159225923592459255926592759285929593059315932593359345935593659375938593959405941594259435944594559465947594859495950595159525953595459555956595759585959596059615962596359645965596659675968596959705971597259735974597559765977597859795980598159825983598459855986598759885989599059915992599359945995599659975998599960006001600260036004600560066007600860096010601160126013601460156016601760186019602060216022602360246025602660276028602960306031603260336034603560366037603860396040604160426043604460456046604760486049605060516052605360546055605660576058605960606061606260636064606560666067606860696070607160726073607460756076607760786079608060816082608360846085608660876088608960906091609260936094609560966097609860996100610161026103610461056106610761086109611061116112611361146115611661176118611961206121612261236124612561266127612861296130613161326133613461356136613761386139614061416142614361446145614661476148614961506151615261536154615561566157615861596160616161626163616461656166616761686169617061716172617361746175617661776178617961806181618261836184618561866187618861896190619161926193619461956196619761986199620062016202620362046205620662076208620962106211621262136214621562166217621862196220622162226223622462256226622762286229623062316232623362346235623662376238623962406241624262436244624562466247624862496250625162526253625462556256625762586259626062616262626362646265626662676268626962706271627262736274627562766277627862796280628162826283628462856286628762886289629062916292629362946295629662976298629963006301630263036304630563066307630863096310631163126313631463156316631763186319632063216322632363246325632663276328632963306331633263336334633563366337633863396340634163426343634463456346634763486349635063516352635363546355635663576358635963606361636263636364636563666367636863696370637163726373637463756376637763786379638063816382638363846385638663876388638963906391639263936394639563966397639863996400640164026403640464056406640764086409641064116412641364146415641664176418641964206421642264236424642564266427642864296430643164326433643464356436643764386439644064416442644364446445644664476448644964506451645264536454645564566457645864596460646164626463646464656466646764686469647064716472647364746475647664776478647964806481648264836484648564866487648864896490649164926493649464956496649764986499650065016502650365046505650665076508650965106511651265136514651565166517651865196520652165226523652465256526652765286529653065316532653365346535653665376538653965406541654265436544654565466547654865496550655165526553655465556556655765586559656065616562656365646565656665676568656965706571657265736574657565766577657865796580658165826583658465856586658765886589659065916592659365946595659665976598659966006601660266036604660566066607660866096610661166126613661466156616661766186619662066216622662366246625662666276628662966306631663266336634663566366637663866396640664166426643664466456646664766486649665066516652665366546655665666576658665966606661666266636664666566666667666866696670667166726673667466756676667766786679668066816682668366846685668666876688668966906691669266936694669566966697669866996700670167026703670467056706670767086709671067116712671367146715671667176718671967206721672267236724672567266727672867296730673167326733673467356736673767386739674067416742674367446745674667476748674967506751675267536754675567566757675867596760676167626763676467656766676767686769677067716772677367746775677667776778677967806781678267836784678567866787678867896790679167926793679467956796679767986799680068016802680368046805680668076808680968106811681268136814681568166817681868196820682168226823682468256826682768286829683068316832683368346835683668376838683968406841684268436844684568466847684868496850685168526853685468556856685768586859686068616862686368646865686668676868686968706871687268736874687568766877687868796880688168826883688468856886688768886889689068916892689368946895689668976898689969006901690269036904690569066907690869096910691169126913691469156916691769186919692069216922692369246925692669276928692969306931693269336934693569366937693869396940694169426943694469456946694769486949695069516952695369546955695669576958695969606961696269636964696569666967696869696970697169726973697469756976697769786979698069816982698369846985698669876988698969906991699269936994699569966997699869997000700170027003700470057006700770087009701070117012701370147015701670177018701970207021702270237024702570267027702870297030703170327033703470357036703770387039704070417042704370447045704670477048704970507051705270537054705570567057705870597060706170627063706470657066706770687069707070717072707370747075707670777078707970807081708270837084708570867087708870897090709170927093709470957096709770987099710071017102710371047105710671077108710971107111711271137114711571167117711871197120712171227123712471257126712771287129713071317132713371347135713671377138713971407141714271437144714571467147714871497150715171527153715471557156715771587159716071617162716371647165716671677168716971707171717271737174717571767177717871797180718171827183718471857186718771887189719071917192719371947195719671977198719972007201720272037204720572067207720872097210721172127213721472157216721772187219722072217222722372247225722672277228722972307231723272337234723572367237723872397240724172427243724472457246724772487249725072517252725372547255725672577258725972607261726272637264726572667267726872697270727172727273727472757276727772787279728072817282728372847285728672877288728972907291729272937294729572967297729872997300730173027303730473057306730773087309731073117312731373147315731673177318731973207321732273237324732573267327732873297330733173327333733473357336733773387339734073417342734373447345734673477348734973507351735273537354735573567357735873597360736173627363736473657366736773687369737073717372737373747375737673777378737973807381738273837384738573867387738873897390739173927393739473957396739773987399740074017402740374047405740674077408740974107411741274137414741574167417741874197420742174227423742474257426742774287429743074317432743374347435743674377438743974407441744274437444744574467447744874497450745174527453745474557456745774587459746074617462746374647465746674677468746974707471747274737474747574767477747874797480748174827483748474857486748774887489749074917492749374947495749674977498749975007501750275037504750575067507750875097510751175127513751475157516751775187519752075217522752375247525752675277528752975307531753275337534753575367537753875397540754175427543754475457546754775487549755075517552755375547555755675577558755975607561756275637564756575667567756875697570757175727573757475757576757775787579758075817582758375847585758675877588758975907591759275937594759575967597759875997600760176027603760476057606760776087609761076117612761376147615761676177618761976207621762276237624762576267627762876297630763176327633763476357636763776387639764076417642764376447645764676477648764976507651765276537654765576567657765876597660766176627663766476657666766776687669767076717672767376747675767676777678767976807681768276837684768576867687768876897690769176927693769476957696769776987699770077017702770377047705770677077708770977107711771277137714771577167717771877197720772177227723772477257726772777287729773077317732773377347735773677377738773977407741774277437744774577467747774877497750775177527753775477557756775777587759776077617762776377647765776677677768776977707771777277737774777577767777777877797780778177827783778477857786778777887789779077917792779377947795779677977798779978007801780278037804780578067807780878097810781178127813781478157816781778187819782078217822782378247825782678277828782978307831783278337834783578367837783878397840784178427843784478457846784778487849785078517852785378547855785678577858785978607861786278637864786578667867786878697870787178727873787478757876787778787879788078817882788378847885788678877888788978907891789278937894789578967897789878997900790179027903790479057906790779087909791079117912791379147915791679177918791979207921792279237924792579267927792879297930793179327933793479357936793779387939794079417942794379447945794679477948794979507951795279537954795579567957795879597960796179627963796479657966796779687969797079717972797379747975797679777978797979807981798279837984798579867987798879897990799179927993799479957996799779987999800080018002800380048005800680078008800980108011801280138014801580168017801880198020802180228023802480258026802780288029803080318032803380348035803680378038803980408041804280438044804580468047804880498050805180528053805480558056805780588059806080618062806380648065806680678068806980708071807280738074807580768077807880798080808180828083808480858086808780888089809080918092809380948095809680978098809981008101810281038104810581068107810881098110811181128113811481158116811781188119812081218122812381248125812681278128812981308131813281338134813581368137813881398140814181428143814481458146814781488149815081518152815381548155815681578158815981608161816281638164816581668167816881698170817181728173817481758176817781788179818081818182818381848185818681878188818981908191819281938194819581968197819881998200820182028203820482058206820782088209821082118212821382148215821682178218821982208221822282238224822582268227822882298230823182328233823482358236823782388239824082418242824382448245824682478248824982508251825282538254825582568257825882598260826182628263826482658266826782688269827082718272827382748275827682778278827982808281828282838284828582868287828882898290829182928293829482958296829782988299830083018302830383048305830683078308830983108311831283138314831583168317831883198320832183228323832483258326832783288329833083318332833383348335833683378338833983408341834283438344834583468347834883498350835183528353835483558356835783588359836083618362836383648365836683678368836983708371837283738374837583768377837883798380838183828383838483858386838783888389839083918392839383948395839683978398839984008401840284038404840584068407840884098410841184128413841484158416841784188419842084218422842384248425842684278428842984308431843284338434843584368437843884398440844184428443844484458446844784488449845084518452845384548455845684578458845984608461846284638464846584668467846884698470847184728473847484758476847784788479848084818482848384848485848684878488848984908491849284938494849584968497849884998500850185028503850485058506850785088509851085118512851385148515851685178518851985208521852285238524852585268527852885298530853185328533853485358536853785388539854085418542854385448545854685478548854985508551855285538554855585568557855885598560856185628563856485658566856785688569857085718572857385748575857685778578857985808581858285838584858585868587858885898590859185928593859485958596859785988599860086018602860386048605860686078608860986108611861286138614861586168617861886198620862186228623862486258626862786288629863086318632863386348635863686378638863986408641864286438644864586468647864886498650865186528653865486558656865786588659866086618662866386648665866686678668866986708671867286738674867586768677867886798680868186828683868486858686868786888689869086918692869386948695869686978698869987008701870287038704870587068707870887098710871187128713871487158716871787188719872087218722872387248725872687278728872987308731873287338734873587368737873887398740874187428743874487458746874787488749875087518752875387548755875687578758875987608761876287638764876587668767876887698770877187728773877487758776877787788779878087818782878387848785878687878788878987908791879287938794879587968797879887998800880188028803880488058806880788088809881088118812881388148815881688178818881988208821882288238824882588268827882888298830883188328833883488358836883788388839884088418842884388448845884688478848884988508851885288538854885588568857885888598860886188628863886488658866886788688869887088718872887388748875887688778878887988808881888288838884888588868887888888898890889188928893889488958896889788988899890089018902890389048905890689078908890989108911891289138914891589168917891889198920892189228923892489258926892789288929893089318932893389348935893689378938893989408941894289438944894589468947894889498950895189528953895489558956895789588959896089618962896389648965896689678968896989708971897289738974897589768977897889798980898189828983898489858986898789888989899089918992899389948995899689978998899990009001900290039004900590069007900890099010901190129013901490159016901790189019902090219022902390249025902690279028902990309031903290339034903590369037903890399040904190429043904490459046904790489049905090519052905390549055905690579058905990609061906290639064906590669067906890699070907190729073907490759076907790789079908090819082908390849085908690879088908990909091909290939094909590969097909890999100910191029103910491059106910791089109911091119112911391149115911691179118911991209121912291239124912591269127912891299130913191329133913491359136913791389139914091419142914391449145914691479148914991509151915291539154915591569157915891599160916191629163916491659166916791689169917091719172917391749175917691779178917991809181918291839184918591869187918891899190919191929193919491959196919791989199920092019202920392049205920692079208920992109211921292139214921592169217921892199220922192229223922492259226922792289229923092319232923392349235923692379238923992409241924292439244924592469247924892499250925192529253925492559256925792589259926092619262926392649265926692679268926992709271927292739274927592769277927892799280928192829283928492859286928792889289929092919292929392949295929692979298929993009301930293039304930593069307930893099310931193129313931493159316931793189319932093219322932393249325932693279328932993309331933293339334933593369337933893399340934193429343934493459346934793489349935093519352935393549355935693579358935993609361936293639364936593669367936893699370937193729373937493759376937793789379938093819382938393849385938693879388938993909391939293939394939593969397939893999400940194029403940494059406940794089409941094119412941394149415941694179418941994209421942294239424942594269427942894299430943194329433943494359436943794389439944094419442944394449445944694479448944994509451945294539454945594569457945894599460946194629463946494659466946794689469947094719472947394749475947694779478947994809481948294839484948594869487948894899490949194929493949494959496949794989499950095019502950395049505950695079508950995109511951295139514951595169517951895199520952195229523952495259526952795289529953095319532953395349535953695379538953995409541954295439544954595469547954895499550955195529553955495559556955795589559956095619562956395649565956695679568956995709571957295739574957595769577957895799580958195829583958495859586958795889589959095919592959395949595959695979598959996009601960296039604960596069607960896099610961196129613961496159616961796189619962096219622962396249625962696279628962996309631963296339634963596369637963896399640964196429643964496459646964796489649965096519652965396549655965696579658965996609661966296639664966596669667966896699670967196729673967496759676967796789679968096819682968396849685968696879688968996909691969296939694969596969697969896999700970197029703970497059706970797089709971097119712971397149715971697179718971997209721972297239724972597269727972897299730973197329733973497359736973797389739974097419742974397449745974697479748974997509751975297539754975597569757975897599760976197629763976497659766976797689769977097719772977397749775977697779778977997809781978297839784978597869787978897899790979197929793979497959796979797989799980098019802980398049805980698079808980998109811981298139814981598169817981898199820982198229823982498259826982798289829983098319832983398349835983698379838983998409841984298439844984598469847984898499850985198529853985498559856985798589859986098619862986398649865986698679868986998709871987298739874987598769877987898799880988198829883988498859886988798889889989098919892989398949895989698979898989999009901990299039904990599069907990899099910991199129913991499159916991799189919992099219922992399249925992699279928992999309931993299339934993599369937993899399940994199429943994499459946994799489949995099519952995399549955995699579958995999609961996299639964996599669967996899699970997199729973997499759976997799789979998099819982998399849985998699879988998999909991999299939994999599969997999899991000010001100021000310004100051000610007100081000910010100111001210013100141001510016100171001810019100201002110022100231002410025100261002710028100291003010031100321003310034100351003610037100381003910040100411004210043100441004510046100471004810049100501005110052100531005410055100561005710058100591006010061100621006310064100651006610067100681006910070100711007210073100741007510076100771007810079100801008110082100831008410085100861008710088100891009010091100921009310094100951009610097100981009910100101011010210103101041010510106101071010810109101101011110112101131011410115101161011710118101191012010121101221012310124101251012610127101281012910130101311013210133101341013510136101371013810139101401014110142101431014410145101461014710148101491015010151101521015310154101551015610157101581015910160101611016210163101641016510166101671016810169101701017110172101731017410175101761017710178101791018010181101821018310184101851018610187101881018910190101911019210193101941019510196101971019810199102001020110202102031020410205102061020710208102091021010211102121021310214102151021610217102181021910220102211022210223102241022510226102271022810229102301023110232102331023410235102361023710238102391024010241102421024310244102451024610247102481024910250102511025210253102541025510256102571025810259102601026110262102631026410265102661026710268102691027010271102721027310274102751027610277102781027910280102811028210283102841028510286102871028810289102901029110292102931029410295102961029710298102991030010301103021030310304103051030610307103081030910310103111031210313103141031510316103171031810319103201032110322103231032410325103261032710328103291033010331103321033310334103351033610337103381033910340103411034210343103441034510346103471034810349103501035110352103531035410355103561035710358103591036010361103621036310364103651036610367103681036910370103711037210373103741037510376103771037810379103801038110382103831038410385103861038710388103891039010391103921039310394103951039610397103981039910400104011040210403104041040510406104071040810409104101041110412104131041410415104161041710418104191042010421104221042310424104251042610427104281042910430104311043210433104341043510436104371043810439104401044110442104431044410445104461044710448104491045010451104521045310454104551045610457104581045910460104611046210463104641046510466104671046810469104701047110472104731047410475104761047710478104791048010481104821048310484104851048610487104881048910490104911049210493104941049510496104971049810499105001050110502105031050410505105061050710508105091051010511105121051310514105151051610517105181051910520105211052210523105241052510526105271052810529105301053110532105331053410535105361053710538105391054010541105421054310544105451054610547105481054910550105511055210553105541055510556105571055810559105601056110562105631056410565105661056710568105691057010571105721057310574105751057610577105781057910580105811058210583105841058510586105871058810589105901059110592105931059410595105961059710598105991060010601106021060310604106051060610607106081060910610106111061210613106141061510616106171061810619106201062110622106231062410625106261062710628106291063010631106321063310634106351063610637106381063910640106411064210643106441064510646106471064810649106501065110652106531065410655106561065710658106591066010661106621066310664106651066610667106681066910670106711067210673106741067510676106771067810679106801068110682106831068410685106861068710688106891069010691106921069310694106951069610697106981069910700107011070210703107041070510706107071070810709107101071110712107131071410715107161071710718107191072010721107221072310724107251072610727107281072910730107311073210733107341073510736107371073810739107401074110742107431074410745107461074710748107491075010751107521075310754107551075610757107581075910760107611076210763107641076510766107671076810769107701077110772107731077410775107761077710778107791078010781107821078310784107851078610787107881078910790107911079210793107941079510796107971079810799108001080110802108031080410805108061080710808108091081010811108121081310814108151081610817108181081910820108211082210823108241082510826108271082810829108301083110832108331083410835108361083710838108391084010841108421084310844108451084610847108481084910850108511085210853108541085510856108571085810859108601086110862108631086410865108661086710868108691087010871108721087310874108751087610877108781087910880108811088210883108841088510886108871088810889108901089110892108931089410895108961089710898108991090010901109021090310904109051090610907109081090910910109111091210913109141091510916109171091810919109201092110922109231092410925109261092710928109291093010931109321093310934109351093610937109381093910940109411094210943109441094510946109471094810949109501095110952109531095410955109561095710958109591096010961109621096310964109651096610967109681096910970109711097210973109741097510976109771097810979109801098110982109831098410985109861098710988109891099010991109921099310994109951099610997109981099911000110011100211003110041100511006110071100811009110101101111012110131101411015110161101711018110191102011021110221102311024110251102611027110281102911030110311103211033110341103511036110371103811039110401104111042110431104411045110461104711048110491105011051110521105311054110551105611057110581105911060110611106211063110641106511066110671106811069110701107111072110731107411075110761107711078110791108011081110821108311084110851108611087110881108911090110911109211093110941109511096110971109811099111001110111102111031110411105111061110711108111091111011111111121111311114111151111611117111181111911120111211112211123111241112511126111271112811129111301113111132111331113411135111361113711138111391114011141111421114311144111451114611147111481114911150111511115211153111541115511156111571115811159111601116111162111631116411165111661116711168111691117011171111721117311174111751117611177111781117911180111811118211183111841118511186111871118811189111901119111192111931119411195111961119711198111991120011201112021120311204112051120611207112081120911210112111121211213112141121511216112171121811219112201122111222112231122411225112261122711228112291123011231112321123311234112351123611237112381123911240112411124211243112441124511246112471124811249112501125111252112531125411255112561125711258112591126011261112621126311264112651126611267112681126911270112711127211273112741127511276112771127811279112801128111282112831128411285112861128711288112891129011291112921129311294112951129611297112981129911300113011130211303113041130511306113071130811309113101131111312113131131411315113161131711318113191132011321113221132311324113251132611327113281132911330113311133211333113341133511336113371133811339113401134111342113431134411345113461134711348113491135011351113521135311354113551135611357113581135911360113611136211363113641136511366113671136811369113701137111372113731137411375113761137711378113791138011381113821138311384113851138611387113881138911390113911139211393113941139511396113971139811399114001140111402114031140411405114061140711408114091141011411114121141311414114151141611417114181141911420114211142211423114241142511426114271142811429114301143111432114331143411435114361143711438114391144011441114421144311444114451144611447114481144911450114511145211453114541145511456114571145811459114601146111462114631146411465114661146711468114691147011471114721147311474114751147611477114781147911480114811148211483114841148511486114871148811489114901149111492114931149411495114961149711498114991150011501115021150311504115051150611507115081150911510115111151211513115141151511516115171151811519115201152111522115231152411525115261152711528115291153011531115321153311534115351153611537115381153911540115411154211543115441154511546115471154811549115501155111552115531155411555115561155711558115591156011561115621156311564115651156611567115681156911570115711157211573115741157511576115771157811579115801158111582115831158411585115861158711588115891159011591115921159311594115951159611597115981159911600116011160211603116041160511606116071160811609116101161111612116131161411615116161161711618116191162011621116221162311624116251162611627116281162911630116311163211633116341163511636116371163811639116401164111642116431164411645116461164711648116491165011651116521165311654116551165611657116581165911660116611166211663116641166511666116671166811669116701167111672116731167411675116761167711678116791168011681116821168311684116851168611687116881168911690116911169211693116941169511696116971169811699117001170111702117031170411705117061170711708117091171011711117121171311714117151171611717117181171911720117211172211723117241172511726117271172811729117301173111732117331173411735117361173711738117391174011741117421174311744117451174611747117481174911750117511175211753117541175511756117571175811759117601176111762117631176411765117661176711768117691177011771117721177311774117751177611777117781177911780117811178211783117841178511786117871178811789117901179111792117931179411795117961179711798117991180011801118021180311804118051180611807118081180911810118111181211813118141181511816118171181811819118201182111822118231182411825118261182711828118291183011831118321183311834118351183611837118381183911840118411184211843118441184511846118471184811849118501185111852118531185411855118561185711858118591186011861118621186311864118651186611867118681186911870118711187211873118741187511876118771187811879118801188111882118831188411885118861188711888118891189011891118921189311894118951189611897118981189911900119011190211903119041190511906119071190811909119101191111912119131191411915119161191711918119191192011921119221192311924119251192611927119281192911930119311193211933119341193511936119371193811939119401194111942119431194411945119461194711948119491195011951119521195311954119551195611957119581195911960119611196211963119641196511966119671196811969119701197111972119731197411975119761197711978119791198011981119821198311984119851198611987119881198911990119911199211993119941199511996119971199811999120001200112002120031200412005120061200712008120091201012011120121201312014120151201612017120181201912020120211202212023120241202512026120271202812029120301203112032120331203412035120361203712038120391204012041120421204312044120451204612047120481204912050120511205212053120541205512056120571205812059120601206112062120631206412065120661206712068120691207012071120721207312074120751207612077120781207912080120811208212083120841208512086120871208812089120901209112092120931209412095120961209712098120991210012101121021210312104121051210612107121081210912110121111211212113121141211512116121171211812119121201212112122121231212412125121261212712128121291213012131121321213312134121351213612137121381213912140121411214212143121441214512146121471214812149121501215112152121531215412155121561215712158121591216012161121621216312164121651216612167121681216912170121711217212173121741217512176121771217812179121801218112182121831218412185121861218712188121891219012191121921219312194121951219612197121981219912200122011220212203122041220512206122071220812209122101221112212122131221412215122161221712218122191222012221122221222312224122251222612227122281222912230122311223212233122341223512236122371223812239122401224112242122431224412245122461224712248122491225012251122521225312254122551225612257122581225912260122611226212263122641226512266122671226812269122701227112272122731227412275122761227712278122791228012281122821228312284122851228612287122881228912290122911229212293122941229512296122971229812299123001230112302123031230412305123061230712308123091231012311123121231312314123151231612317123181231912320123211232212323123241232512326123271232812329123301233112332123331233412335123361233712338123391234012341123421234312344123451234612347123481234912350123511235212353123541235512356123571235812359123601236112362123631236412365123661236712368123691237012371123721237312374123751237612377123781237912380123811238212383123841238512386123871238812389123901239112392123931239412395123961239712398123991240012401124021240312404124051240612407124081240912410124111241212413124141241512416124171241812419124201242112422124231242412425124261242712428124291243012431124321243312434124351243612437124381243912440124411244212443124441244512446124471244812449124501245112452124531245412455124561245712458124591246012461124621246312464124651246612467124681246912470124711247212473124741247512476124771247812479124801248112482124831248412485124861248712488124891249012491124921249312494124951249612497124981249912500125011250212503125041250512506125071250812509125101251112512125131251412515125161251712518125191252012521125221252312524125251252612527125281252912530125311253212533125341253512536125371253812539125401254112542125431254412545125461254712548125491255012551125521255312554125551255612557125581255912560125611256212563125641256512566125671256812569125701257112572125731257412575125761257712578125791258012581125821258312584125851258612587125881258912590125911259212593125941259512596125971259812599126001260112602126031260412605126061260712608126091261012611126121261312614126151261612617126181261912620126211262212623126241262512626126271262812629126301263112632126331263412635126361263712638126391264012641126421264312644126451264612647126481264912650126511265212653126541265512656126571265812659126601266112662126631266412665126661266712668126691267012671126721267312674126751267612677126781267912680126811268212683126841268512686126871268812689126901269112692126931269412695126961269712698126991270012701127021270312704127051270612707127081270912710127111271212713127141271512716127171271812719127201272112722127231272412725127261272712728127291273012731127321273312734127351273612737127381273912740127411274212743127441274512746127471274812749127501275112752127531275412755127561275712758127591276012761127621276312764127651276612767127681276912770127711277212773127741277512776127771277812779127801278112782127831278412785127861278712788127891279012791127921279312794127951279612797127981279912800128011280212803128041280512806128071280812809128101281112812128131281412815128161281712818128191282012821128221282312824128251282612827128281282912830128311283212833128341283512836128371283812839128401284112842128431284412845128461284712848128491285012851128521285312854128551285612857128581285912860128611286212863128641286512866128671286812869128701287112872128731287412875128761287712878128791288012881128821288312884128851288612887128881288912890128911289212893128941289512896128971289812899129001290112902129031290412905129061290712908129091291012911129121291312914129151291612917129181291912920129211292212923129241292512926129271292812929129301293112932129331293412935129361293712938129391294012941129421294312944129451294612947129481294912950129511295212953129541295512956129571295812959129601296112962129631296412965129661296712968129691297012971129721297312974129751297612977129781297912980129811298212983129841298512986129871298812989129901299112992129931299412995129961299712998129991300013001130021300313004130051300613007130081300913010130111301213013130141301513016130171301813019130201302113022130231302413025130261302713028130291303013031130321303313034130351303613037130381303913040130411304213043130441304513046130471304813049130501305113052130531305413055130561305713058130591306013061130621306313064130651306613067130681306913070130711307213073130741307513076130771307813079130801308113082130831308413085130861308713088130891309013091130921309313094130951309613097130981309913100131011310213103131041310513106131071310813109131101311113112131131311413115131161311713118131191312013121131221312313124131251312613127131281312913130131311313213133131341313513136131371313813139131401314113142131431314413145131461314713148131491315013151131521315313154131551315613157131581315913160131611316213163131641316513166131671316813169131701317113172131731317413175131761317713178131791318013181131821318313184131851318613187131881318913190131911319213193131941319513196131971319813199132001320113202132031320413205132061320713208132091321013211132121321313214132151321613217132181321913220132211322213223132241322513226132271322813229132301323113232132331323413235132361323713238132391324013241132421324313244132451324613247132481324913250132511325213253132541325513256132571325813259132601326113262132631326413265132661326713268132691327013271132721327313274132751327613277132781327913280132811328213283132841328513286132871328813289132901329113292132931329413295132961329713298132991330013301133021330313304133051330613307133081330913310133111331213313133141331513316133171331813319133201332113322133231332413325133261332713328133291333013331133321333313334133351333613337133381333913340133411334213343133441334513346133471334813349133501335113352133531335413355133561335713358133591336013361133621336313364133651336613367133681336913370133711337213373133741337513376133771337813379133801338113382133831338413385133861338713388133891339013391133921339313394133951339613397133981339913400134011340213403134041340513406134071340813409134101341113412134131341413415134161341713418134191342013421134221342313424134251342613427134281342913430134311343213433134341343513436134371343813439134401344113442134431344413445134461344713448134491345013451134521345313454134551345613457134581345913460134611346213463134641346513466134671346813469134701347113472134731347413475134761347713478134791348013481134821348313484134851348613487134881348913490134911349213493134941349513496134971349813499135001350113502135031350413505135061350713508135091351013511135121351313514135151351613517135181351913520135211352213523135241352513526135271352813529135301353113532135331353413535135361353713538135391354013541135421354313544135451354613547135481354913550135511355213553135541355513556135571355813559135601356113562135631356413565135661356713568135691357013571135721357313574135751357613577135781357913580135811358213583135841358513586135871358813589135901359113592135931359413595135961359713598135991360013601136021360313604136051360613607136081360913610136111361213613136141361513616136171361813619136201362113622136231362413625136261362713628136291363013631136321363313634136351363613637136381363913640136411364213643136441364513646136471364813649136501365113652136531365413655136561365713658136591366013661136621366313664136651366613667136681366913670136711367213673136741367513676136771367813679136801368113682136831368413685136861368713688136891369013691136921369313694136951369613697136981369913700137011370213703137041370513706137071370813709137101371113712137131371413715137161371713718137191372013721137221372313724137251372613727137281372913730137311373213733137341373513736137371373813739137401374113742137431374413745137461374713748137491375013751137521375313754137551375613757137581375913760137611376213763137641376513766137671376813769137701377113772137731377413775137761377713778137791378013781137821378313784137851378613787137881378913790137911379213793137941379513796137971379813799138001380113802138031380413805138061380713808138091381013811138121381313814138151381613817138181381913820138211382213823138241382513826138271382813829138301383113832138331383413835138361383713838138391384013841138421384313844138451384613847138481384913850138511385213853138541385513856138571385813859138601386113862138631386413865138661386713868138691387013871138721387313874138751387613877138781387913880138811388213883138841388513886138871388813889138901389113892138931389413895138961389713898138991390013901139021390313904139051390613907139081390913910139111391213913139141391513916139171391813919139201392113922139231392413925139261392713928139291393013931139321393313934139351393613937139381393913940139411394213943139441394513946139471394813949139501395113952139531395413955139561395713958139591396013961139621396313964139651396613967139681396913970139711397213973139741397513976139771397813979139801398113982139831398413985139861398713988139891399013991139921399313994139951399613997139981399914000140011400214003140041400514006140071400814009140101401114012140131401414015140161401714018140191402014021140221402314024140251402614027140281402914030140311403214033140341403514036140371403814039140401404114042140431404414045140461404714048140491405014051140521405314054140551405614057140581405914060140611406214063140641406514066140671406814069140701407114072140731407414075140761407714078140791408014081140821408314084140851408614087140881408914090140911409214093140941409514096140971409814099141001410114102141031410414105141061410714108141091411014111141121411314114141151411614117141181411914120141211412214123141241412514126141271412814129141301413114132141331413414135141361413714138141391414014141141421414314144141451414614147141481414914150141511415214153141541415514156141571415814159141601416114162141631416414165141661416714168141691417014171141721417314174141751417614177141781417914180141811418214183141841418514186141871418814189141901419114192141931419414195141961419714198141991420014201142021420314204142051420614207142081420914210142111421214213142141421514216142171421814219142201422114222142231422414225142261422714228142291423014231142321423314234142351423614237142381423914240142411424214243142441424514246142471424814249142501425114252142531425414255142561425714258142591426014261142621426314264142651426614267142681426914270142711427214273142741427514276142771427814279142801428114282142831428414285142861428714288142891429014291142921429314294142951429614297142981429914300143011430214303143041430514306143071430814309143101431114312143131431414315143161431714318143191432014321143221432314324143251432614327143281432914330143311433214333143341433514336143371433814339143401434114342143431434414345143461434714348143491435014351143521435314354143551435614357143581435914360143611436214363143641436514366143671436814369143701437114372143731437414375143761437714378143791438014381143821438314384143851438614387143881438914390143911439214393143941439514396143971439814399144001440114402144031440414405144061440714408144091441014411144121441314414144151441614417144181441914420144211442214423144241442514426144271442814429144301443114432144331443414435144361443714438144391444014441144421444314444144451444614447144481444914450144511445214453144541445514456144571445814459144601446114462144631446414465144661446714468144691447014471144721447314474144751447614477144781447914480144811448214483144841448514486144871448814489144901449114492144931449414495144961449714498144991450014501145021450314504145051450614507145081450914510145111451214513145141451514516145171451814519145201452114522145231452414525145261452714528145291453014531145321453314534145351453614537145381453914540145411454214543145441454514546145471454814549145501455114552145531455414555145561455714558145591456014561145621456314564145651456614567145681456914570145711457214573145741457514576145771457814579145801458114582145831458414585145861458714588145891459014591145921459314594145951459614597145981459914600146011460214603146041460514606146071460814609146101461114612146131461414615146161461714618146191462014621146221462314624146251462614627146281462914630146311463214633146341463514636146371463814639146401464114642146431464414645146461464714648146491465014651146521465314654146551465614657146581465914660146611466214663146641466514666146671466814669146701467114672146731467414675146761467714678146791468014681146821468314684146851468614687146881468914690146911469214693146941469514696146971469814699147001470114702147031470414705147061470714708147091471014711147121471314714147151471614717147181471914720147211472214723147241472514726147271472814729147301473114732147331473414735147361473714738147391474014741147421474314744147451474614747147481474914750147511475214753147541475514756147571475814759147601476114762147631476414765147661476714768147691477014771147721477314774147751477614777147781477914780147811478214783147841478514786147871478814789147901479114792147931479414795147961479714798147991480014801148021480314804148051480614807148081480914810148111481214813148141481514816148171481814819148201482114822148231482414825148261482714828148291483014831148321483314834148351483614837148381483914840148411484214843148441484514846148471484814849148501485114852148531485414855148561485714858148591486014861148621486314864148651486614867148681486914870148711487214873148741487514876148771487814879148801488114882148831488414885148861488714888148891489014891148921489314894148951489614897148981489914900149011490214903149041490514906149071490814909149101491114912149131491414915149161491714918149191492014921149221492314924149251492614927149281492914930149311493214933149341493514936149371493814939149401494114942149431494414945149461494714948149491495014951149521495314954149551495614957149581495914960149611496214963149641496514966149671496814969149701497114972149731497414975149761497714978149791498014981149821498314984149851498614987149881498914990149911499214993149941499514996149971499814999150001500115002150031500415005150061500715008150091501015011150121501315014150151501615017150181501915020150211502215023150241502515026150271502815029150301503115032150331503415035150361503715038150391504015041150421504315044150451504615047150481504915050150511505215053150541505515056150571505815059150601506115062150631506415065150661506715068150691507015071150721507315074150751507615077150781507915080150811508215083150841508515086150871508815089150901509115092150931509415095150961509715098150991510015101151021510315104151051510615107151081510915110151111511215113151141511515116151171511815119151201512115122151231512415125151261512715128151291513015131151321513315134151351513615137151381513915140151411514215143151441514515146151471514815149151501515115152151531515415155151561515715158151591516015161151621516315164151651516615167151681516915170151711517215173151741517515176151771517815179151801518115182151831518415185151861518715188151891519015191151921519315194151951519615197151981519915200152011520215203152041520515206152071520815209152101521115212152131521415215152161521715218152191522015221152221522315224152251522615227152281522915230152311523215233152341523515236152371523815239152401524115242152431524415245152461524715248152491525015251152521525315254152551525615257152581525915260152611526215263152641526515266152671526815269152701527115272152731527415275152761527715278152791528015281152821528315284152851528615287152881528915290152911529215293152941529515296152971529815299153001530115302153031530415305153061530715308153091531015311153121531315314153151531615317153181531915320153211532215323153241532515326153271532815329153301533115332153331533415335153361533715338153391534015341153421534315344153451534615347153481534915350153511535215353153541535515356153571535815359153601536115362153631536415365153661536715368153691537015371153721537315374153751537615377153781537915380153811538215383153841538515386153871538815389153901539115392153931539415395153961539715398153991540015401154021540315404154051540615407154081540915410154111541215413154141541515416154171541815419154201542115422154231542415425154261542715428154291543015431154321543315434154351543615437154381543915440154411544215443154441544515446154471544815449154501545115452154531545415455154561545715458154591546015461154621546315464154651546615467154681546915470154711547215473154741547515476154771547815479154801548115482154831548415485154861548715488154891549015491154921549315494154951549615497154981549915500155011550215503155041550515506155071550815509155101551115512155131551415515155161551715518155191552015521155221552315524155251552615527155281552915530155311553215533155341553515536155371553815539155401554115542155431554415545155461554715548155491555015551155521555315554155551555615557155581555915560155611556215563155641556515566155671556815569155701557115572155731557415575155761557715578155791558015581155821558315584155851558615587155881558915590155911559215593155941559515596155971559815599156001560115602156031560415605156061560715608156091561015611156121561315614156151561615617156181561915620156211562215623156241562515626156271562815629156301563115632156331563415635156361563715638156391564015641156421564315644156451564615647156481564915650156511565215653156541565515656156571565815659156601566115662156631566415665156661566715668156691567015671156721567315674156751567615677156781567915680156811568215683156841568515686156871568815689156901569115692156931569415695156961569715698156991570015701157021570315704157051570615707157081570915710157111571215713157141571515716157171571815719157201572115722157231572415725157261572715728157291573015731157321573315734157351573615737157381573915740157411574215743157441574515746157471574815749157501575115752157531575415755157561575715758157591576015761157621576315764157651576615767157681576915770157711577215773157741577515776157771577815779157801578115782157831578415785157861578715788157891579015791157921579315794157951579615797157981579915800158011580215803158041580515806158071580815809158101581115812158131581415815158161581715818158191582015821158221582315824158251582615827158281582915830158311583215833158341583515836158371583815839158401584115842158431584415845158461584715848158491585015851158521585315854158551585615857158581585915860158611586215863158641586515866158671586815869158701587115872158731587415875158761587715878158791588015881158821588315884158851588615887158881588915890158911589215893158941589515896158971589815899159001590115902159031590415905159061590715908159091591015911159121591315914159151591615917159181591915920159211592215923159241592515926159271592815929159301593115932159331593415935159361593715938159391594015941159421594315944159451594615947159481594915950159511595215953159541595515956159571595815959159601596115962159631596415965159661596715968159691597015971159721597315974159751597615977159781597915980159811598215983159841598515986159871598815989159901599115992159931599415995159961599715998159991600016001160021600316004160051600616007160081600916010160111601216013160141601516016160171601816019160201602116022160231602416025160261602716028160291603016031160321603316034160351603616037160381603916040160411604216043160441604516046160471604816049160501605116052160531605416055160561605716058160591606016061160621606316064160651606616067160681606916070160711607216073160741607516076160771607816079160801608116082160831608416085160861608716088160891609016091160921609316094160951609616097160981609916100161011610216103161041610516106161071610816109161101611116112161131611416115161161611716118161191612016121161221612316124161251612616127161281612916130161311613216133161341613516136161371613816139161401614116142161431614416145161461614716148161491615016151161521615316154161551615616157161581615916160161611616216163161641616516166161671616816169161701617116172161731617416175161761617716178161791618016181161821618316184161851618616187161881618916190161911619216193161941619516196161971619816199162001620116202162031620416205162061620716208162091621016211162121621316214162151621616217162181621916220162211622216223162241622516226162271622816229162301623116232162331623416235162361623716238162391624016241162421624316244162451624616247162481624916250162511625216253162541625516256162571625816259162601626116262162631626416265162661626716268162691627016271162721627316274162751627616277162781627916280162811628216283162841628516286162871628816289162901629116292162931629416295162961629716298162991630016301163021630316304163051630616307163081630916310163111631216313163141631516316163171631816319163201632116322163231632416325163261632716328163291633016331163321633316334163351633616337163381633916340163411634216343163441634516346163471634816349163501635116352163531635416355163561635716358163591636016361163621636316364163651636616367163681636916370163711637216373163741637516376163771637816379163801638116382163831638416385163861638716388163891639016391163921639316394163951639616397163981639916400164011640216403164041640516406164071640816409164101641116412164131641416415164161641716418164191642016421164221642316424164251642616427164281642916430164311643216433164341643516436164371643816439164401644116442164431644416445164461644716448164491645016451164521645316454164551645616457164581645916460164611646216463164641646516466164671646816469164701647116472164731647416475164761647716478164791648016481164821648316484164851648616487164881648916490164911649216493164941649516496164971649816499165001650116502165031650416505165061650716508165091651016511165121651316514165151651616517165181651916520165211652216523165241652516526165271652816529165301653116532165331653416535165361653716538165391654016541165421654316544165451654616547165481654916550165511655216553165541655516556165571655816559165601656116562165631656416565165661656716568165691657016571165721657316574165751657616577165781657916580165811658216583165841658516586165871658816589165901659116592165931659416595165961659716598165991660016601166021660316604166051660616607166081660916610166111661216613166141661516616166171661816619166201662116622166231662416625166261662716628166291663016631166321663316634166351663616637166381663916640166411664216643166441664516646166471664816649166501665116652166531665416655166561665716658166591666016661166621666316664166651666616667166681666916670166711667216673166741667516676166771667816679166801668116682166831668416685166861668716688166891669016691166921669316694166951669616697166981669916700167011670216703167041670516706167071670816709167101671116712167131671416715167161671716718167191672016721167221672316724167251672616727167281672916730167311673216733167341673516736167371673816739167401674116742167431674416745167461674716748167491675016751167521675316754167551675616757167581675916760167611676216763167641676516766167671676816769167701677116772167731677416775167761677716778167791678016781167821678316784167851678616787167881678916790167911679216793167941679516796167971679816799168001680116802168031680416805168061680716808168091681016811168121681316814168151681616817168181681916820168211682216823168241682516826168271682816829168301683116832168331683416835168361683716838168391684016841168421684316844168451684616847168481684916850168511685216853168541685516856168571685816859168601686116862168631686416865168661686716868168691687016871168721687316874168751687616877168781687916880168811688216883168841688516886168871688816889168901689116892168931689416895168961689716898168991690016901169021690316904169051690616907169081690916910169111691216913169141691516916169171691816919169201692116922169231692416925169261692716928169291693016931169321693316934169351693616937169381693916940169411694216943169441694516946169471694816949169501695116952169531695416955169561695716958169591696016961169621696316964169651696616967169681696916970169711697216973169741697516976169771697816979169801698116982169831698416985169861698716988169891699016991169921699316994169951699616997169981699917000170011700217003170041700517006170071700817009170101701117012170131701417015170161701717018170191702017021170221702317024170251702617027170281702917030170311703217033170341703517036170371703817039170401704117042170431704417045170461704717048170491705017051170521705317054170551705617057170581705917060170611706217063170641706517066170671706817069170701707117072170731707417075170761707717078170791708017081170821708317084170851708617087170881708917090170911709217093170941709517096170971709817099171001710117102171031710417105171061710717108171091711017111171121711317114171151711617117171181711917120171211712217123171241712517126171271712817129171301713117132171331713417135171361713717138171391714017141171421714317144171451714617147171481714917150171511715217153171541715517156171571715817159171601716117162171631716417165171661716717168171691717017171171721717317174171751717617177171781717917180171811718217183171841718517186171871718817189171901719117192171931719417195171961719717198171991720017201172021720317204172051720617207172081720917210172111721217213172141721517216172171721817219172201722117222172231722417225172261722717228172291723017231172321723317234172351723617237172381723917240172411724217243172441724517246172471724817249172501725117252172531725417255172561725717258172591726017261172621726317264172651726617267172681726917270172711727217273172741727517276172771727817279172801728117282172831728417285172861728717288172891729017291172921729317294172951729617297172981729917300173011730217303173041730517306173071730817309173101731117312173131731417315173161731717318173191732017321173221732317324173251732617327173281732917330173311733217333173341733517336173371733817339173401734117342173431734417345173461734717348173491735017351173521735317354173551735617357173581735917360173611736217363173641736517366173671736817369173701737117372173731737417375173761737717378173791738017381173821738317384173851738617387173881738917390173911739217393173941739517396173971739817399174001740117402174031740417405174061740717408174091741017411174121741317414174151741617417174181741917420174211742217423174241742517426174271742817429174301743117432174331743417435174361743717438174391744017441174421744317444
  1. (function webpackUniversalModuleDefinition(root, factory) {
  2. if(typeof exports === 'object' && typeof module === 'object')
  3. module.exports = factory(require("babylonjs"));
  4. else if(typeof define === 'function' && define.amd)
  5. define("babylonjs-gui", ["babylonjs"], factory);
  6. else if(typeof exports === 'object')
  7. exports["babylonjs-gui"] = factory(require("babylonjs"));
  8. else
  9. root["BABYLON"] = root["BABYLON"] || {}, root["BABYLON"]["GUI"] = factory(root["BABYLON"]);
  10. })((typeof self !== "undefined" ? self : typeof global !== "undefined" ? global : this), function(__WEBPACK_EXTERNAL_MODULE_babylonjs_Maths_math_vector__) {
  11. return /******/ (function(modules) { // webpackBootstrap
  12. /******/ // The module cache
  13. /******/ var installedModules = {};
  14. /******/
  15. /******/ // The require function
  16. /******/ function __webpack_require__(moduleId) {
  17. /******/
  18. /******/ // Check if module is in cache
  19. /******/ if(installedModules[moduleId]) {
  20. /******/ return installedModules[moduleId].exports;
  21. /******/ }
  22. /******/ // Create a new module (and put it into the cache)
  23. /******/ var module = installedModules[moduleId] = {
  24. /******/ i: moduleId,
  25. /******/ l: false,
  26. /******/ exports: {}
  27. /******/ };
  28. /******/
  29. /******/ // Execute the module function
  30. /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
  31. /******/
  32. /******/ // Flag the module as loaded
  33. /******/ module.l = true;
  34. /******/
  35. /******/ // Return the exports of the module
  36. /******/ return module.exports;
  37. /******/ }
  38. /******/
  39. /******/
  40. /******/ // expose the modules object (__webpack_modules__)
  41. /******/ __webpack_require__.m = modules;
  42. /******/
  43. /******/ // expose the module cache
  44. /******/ __webpack_require__.c = installedModules;
  45. /******/
  46. /******/ // define getter function for harmony exports
  47. /******/ __webpack_require__.d = function(exports, name, getter) {
  48. /******/ if(!__webpack_require__.o(exports, name)) {
  49. /******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
  50. /******/ }
  51. /******/ };
  52. /******/
  53. /******/ // define __esModule on exports
  54. /******/ __webpack_require__.r = function(exports) {
  55. /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
  56. /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
  57. /******/ }
  58. /******/ Object.defineProperty(exports, '__esModule', { value: true });
  59. /******/ };
  60. /******/
  61. /******/ // create a fake namespace object
  62. /******/ // mode & 1: value is a module id, require it
  63. /******/ // mode & 2: merge all properties of value into the ns
  64. /******/ // mode & 4: return value when already ns object
  65. /******/ // mode & 8|1: behave like require
  66. /******/ __webpack_require__.t = function(value, mode) {
  67. /******/ if(mode & 1) value = __webpack_require__(value);
  68. /******/ if(mode & 8) return value;
  69. /******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
  70. /******/ var ns = Object.create(null);
  71. /******/ __webpack_require__.r(ns);
  72. /******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
  73. /******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
  74. /******/ return ns;
  75. /******/ };
  76. /******/
  77. /******/ // getDefaultExport function for compatibility with non-harmony modules
  78. /******/ __webpack_require__.n = function(module) {
  79. /******/ var getter = module && module.__esModule ?
  80. /******/ function getDefault() { return module['default']; } :
  81. /******/ function getModuleExports() { return module; };
  82. /******/ __webpack_require__.d(getter, 'a', getter);
  83. /******/ return getter;
  84. /******/ };
  85. /******/
  86. /******/ // Object.prototype.hasOwnProperty.call
  87. /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
  88. /******/
  89. /******/ // __webpack_public_path__
  90. /******/ __webpack_require__.p = "";
  91. /******/
  92. /******/
  93. /******/ // Load entry module and return exports
  94. /******/ return __webpack_require__(__webpack_require__.s = "./legacy/legacy.ts");
  95. /******/ })
  96. /************************************************************************/
  97. /******/ ({
  98. /***/ "../../node_modules/tslib/tslib.es6.js":
  99. /*!*****************************************************************!*\
  100. !*** C:/Dev/Babylon/Babylon.js/node_modules/tslib/tslib.es6.js ***!
  101. \*****************************************************************/
  102. /*! exports provided: __extends, __assign, __rest, __decorate, __param, __metadata, __awaiter, __generator, __createBinding, __exportStar, __values, __read, __spread, __spreadArrays, __await, __asyncGenerator, __asyncDelegator, __asyncValues, __makeTemplateObject, __importStar, __importDefault, __classPrivateFieldGet, __classPrivateFieldSet */
  103. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  104. "use strict";
  105. __webpack_require__.r(__webpack_exports__);
  106. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__extends", function() { return __extends; });
  107. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__assign", function() { return __assign; });
  108. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__rest", function() { return __rest; });
  109. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__decorate", function() { return __decorate; });
  110. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__param", function() { return __param; });
  111. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__metadata", function() { return __metadata; });
  112. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__awaiter", function() { return __awaiter; });
  113. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__generator", function() { return __generator; });
  114. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__createBinding", function() { return __createBinding; });
  115. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__exportStar", function() { return __exportStar; });
  116. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__values", function() { return __values; });
  117. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__read", function() { return __read; });
  118. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__spread", function() { return __spread; });
  119. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__spreadArrays", function() { return __spreadArrays; });
  120. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__await", function() { return __await; });
  121. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__asyncGenerator", function() { return __asyncGenerator; });
  122. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__asyncDelegator", function() { return __asyncDelegator; });
  123. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__asyncValues", function() { return __asyncValues; });
  124. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__makeTemplateObject", function() { return __makeTemplateObject; });
  125. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__importStar", function() { return __importStar; });
  126. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__importDefault", function() { return __importDefault; });
  127. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__classPrivateFieldGet", function() { return __classPrivateFieldGet; });
  128. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__classPrivateFieldSet", function() { return __classPrivateFieldSet; });
  129. /*! *****************************************************************************
  130. Copyright (c) Microsoft Corporation.
  131. Permission to use, copy, modify, and/or distribute this software for any
  132. purpose with or without fee is hereby granted.
  133. THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
  134. REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
  135. AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
  136. INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
  137. LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
  138. OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
  139. PERFORMANCE OF THIS SOFTWARE.
  140. ***************************************************************************** */
  141. /* global Reflect, Promise */
  142. var extendStatics = function(d, b) {
  143. extendStatics = Object.setPrototypeOf ||
  144. ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
  145. function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
  146. return extendStatics(d, b);
  147. };
  148. function __extends(d, b) {
  149. extendStatics(d, b);
  150. function __() { this.constructor = d; }
  151. d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
  152. }
  153. var __assign = function() {
  154. __assign = Object.assign || function __assign(t) {
  155. for (var s, i = 1, n = arguments.length; i < n; i++) {
  156. s = arguments[i];
  157. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
  158. }
  159. return t;
  160. }
  161. return __assign.apply(this, arguments);
  162. }
  163. function __rest(s, e) {
  164. var t = {};
  165. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
  166. t[p] = s[p];
  167. if (s != null && typeof Object.getOwnPropertySymbols === "function")
  168. for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  169. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
  170. t[p[i]] = s[p[i]];
  171. }
  172. return t;
  173. }
  174. function __decorate(decorators, target, key, desc) {
  175. var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  176. if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  177. else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  178. return c > 3 && r && Object.defineProperty(target, key, r), r;
  179. }
  180. function __param(paramIndex, decorator) {
  181. return function (target, key) { decorator(target, key, paramIndex); }
  182. }
  183. function __metadata(metadataKey, metadataValue) {
  184. if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
  185. }
  186. function __awaiter(thisArg, _arguments, P, generator) {
  187. function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
  188. return new (P || (P = Promise))(function (resolve, reject) {
  189. function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
  190. function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
  191. function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
  192. step((generator = generator.apply(thisArg, _arguments || [])).next());
  193. });
  194. }
  195. function __generator(thisArg, body) {
  196. var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
  197. return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
  198. function verb(n) { return function (v) { return step([n, v]); }; }
  199. function step(op) {
  200. if (f) throw new TypeError("Generator is already executing.");
  201. while (_) try {
  202. if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
  203. if (y = 0, t) op = [op[0] & 2, t.value];
  204. switch (op[0]) {
  205. case 0: case 1: t = op; break;
  206. case 4: _.label++; return { value: op[1], done: false };
  207. case 5: _.label++; y = op[1]; op = [0]; continue;
  208. case 7: op = _.ops.pop(); _.trys.pop(); continue;
  209. default:
  210. if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
  211. if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
  212. if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
  213. if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
  214. if (t[2]) _.ops.pop();
  215. _.trys.pop(); continue;
  216. }
  217. op = body.call(thisArg, _);
  218. } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
  219. if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
  220. }
  221. }
  222. var __createBinding = Object.create ? (function(o, m, k, k2) {
  223. if (k2 === undefined) k2 = k;
  224. Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
  225. }) : (function(o, m, k, k2) {
  226. if (k2 === undefined) k2 = k;
  227. o[k2] = m[k];
  228. });
  229. function __exportStar(m, exports) {
  230. for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
  231. }
  232. function __values(o) {
  233. var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
  234. if (m) return m.call(o);
  235. if (o && typeof o.length === "number") return {
  236. next: function () {
  237. if (o && i >= o.length) o = void 0;
  238. return { value: o && o[i++], done: !o };
  239. }
  240. };
  241. throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
  242. }
  243. function __read(o, n) {
  244. var m = typeof Symbol === "function" && o[Symbol.iterator];
  245. if (!m) return o;
  246. var i = m.call(o), r, ar = [], e;
  247. try {
  248. while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
  249. }
  250. catch (error) { e = { error: error }; }
  251. finally {
  252. try {
  253. if (r && !r.done && (m = i["return"])) m.call(i);
  254. }
  255. finally { if (e) throw e.error; }
  256. }
  257. return ar;
  258. }
  259. function __spread() {
  260. for (var ar = [], i = 0; i < arguments.length; i++)
  261. ar = ar.concat(__read(arguments[i]));
  262. return ar;
  263. }
  264. function __spreadArrays() {
  265. for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
  266. for (var r = Array(s), k = 0, i = 0; i < il; i++)
  267. for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
  268. r[k] = a[j];
  269. return r;
  270. };
  271. function __await(v) {
  272. return this instanceof __await ? (this.v = v, this) : new __await(v);
  273. }
  274. function __asyncGenerator(thisArg, _arguments, generator) {
  275. if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
  276. var g = generator.apply(thisArg, _arguments || []), i, q = [];
  277. return i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i;
  278. function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }
  279. function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }
  280. function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
  281. function fulfill(value) { resume("next", value); }
  282. function reject(value) { resume("throw", value); }
  283. function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }
  284. }
  285. function __asyncDelegator(o) {
  286. var i, p;
  287. return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
  288. function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === "return" } : f ? f(v) : v; } : f; }
  289. }
  290. function __asyncValues(o) {
  291. if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
  292. var m = o[Symbol.asyncIterator], i;
  293. return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i);
  294. function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }
  295. function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }
  296. }
  297. function __makeTemplateObject(cooked, raw) {
  298. if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
  299. return cooked;
  300. };
  301. var __setModuleDefault = Object.create ? (function(o, v) {
  302. Object.defineProperty(o, "default", { enumerable: true, value: v });
  303. }) : function(o, v) {
  304. o["default"] = v;
  305. };
  306. function __importStar(mod) {
  307. if (mod && mod.__esModule) return mod;
  308. var result = {};
  309. if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
  310. __setModuleDefault(result, mod);
  311. return result;
  312. }
  313. function __importDefault(mod) {
  314. return (mod && mod.__esModule) ? mod : { default: mod };
  315. }
  316. function __classPrivateFieldGet(receiver, privateMap) {
  317. if (!privateMap.has(receiver)) {
  318. throw new TypeError("attempted to get private field on non-instance");
  319. }
  320. return privateMap.get(receiver);
  321. }
  322. function __classPrivateFieldSet(receiver, privateMap, value) {
  323. if (!privateMap.has(receiver)) {
  324. throw new TypeError("attempted to set private field on non-instance");
  325. }
  326. privateMap.set(receiver, value);
  327. return value;
  328. }
  329. /***/ }),
  330. /***/ "../../node_modules/webpack/buildin/global.js":
  331. /*!***********************************!*\
  332. !*** (webpack)/buildin/global.js ***!
  333. \***********************************/
  334. /*! no static exports found */
  335. /***/ (function(module, exports) {
  336. var g;
  337. // This works in non-strict mode
  338. g = (function() {
  339. return this;
  340. })();
  341. try {
  342. // This works if eval is allowed (see CSP)
  343. g = g || new Function("return this")();
  344. } catch (e) {
  345. // This works if the window reference is available
  346. if (typeof window === "object") g = window;
  347. }
  348. // g can still be undefined, but nothing to do about it...
  349. // We return undefined, instead of nothing here, so it's
  350. // easier to handle this case. if(!global) { ...}
  351. module.exports = g;
  352. /***/ }),
  353. /***/ "./2D/adtInstrumentation.ts":
  354. /*!**********************************!*\
  355. !*** ./2D/adtInstrumentation.ts ***!
  356. \**********************************/
  357. /*! exports provided: AdvancedDynamicTextureInstrumentation */
  358. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  359. "use strict";
  360. __webpack_require__.r(__webpack_exports__);
  361. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AdvancedDynamicTextureInstrumentation", function() { return AdvancedDynamicTextureInstrumentation; });
  362. /* harmony import */ var babylonjs_Misc_perfCounter__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/perfCounter */ "babylonjs/Maths/math.vector");
  363. /* harmony import */ var babylonjs_Misc_perfCounter__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_perfCounter__WEBPACK_IMPORTED_MODULE_0__);
  364. /**
  365. * This class can be used to get instrumentation data from a AdvancedDynamicTexture object
  366. */
  367. var AdvancedDynamicTextureInstrumentation = /** @class */ (function () {
  368. /**
  369. * Instantiates a new advanced dynamic texture instrumentation.
  370. * This class can be used to get instrumentation data from an AdvancedDynamicTexture object
  371. * @param texture Defines the AdvancedDynamicTexture to instrument
  372. */
  373. function AdvancedDynamicTextureInstrumentation(
  374. /**
  375. * Define the instrumented AdvancedDynamicTexture.
  376. */
  377. texture) {
  378. this.texture = texture;
  379. this._captureRenderTime = false;
  380. this._renderTime = new babylonjs_Misc_perfCounter__WEBPACK_IMPORTED_MODULE_0__["PerfCounter"]();
  381. this._captureLayoutTime = false;
  382. this._layoutTime = new babylonjs_Misc_perfCounter__WEBPACK_IMPORTED_MODULE_0__["PerfCounter"]();
  383. // Observers
  384. this._onBeginRenderObserver = null;
  385. this._onEndRenderObserver = null;
  386. this._onBeginLayoutObserver = null;
  387. this._onEndLayoutObserver = null;
  388. }
  389. Object.defineProperty(AdvancedDynamicTextureInstrumentation.prototype, "renderTimeCounter", {
  390. // Properties
  391. /**
  392. * Gets the perf counter used to capture render time
  393. */
  394. get: function () {
  395. return this._renderTime;
  396. },
  397. enumerable: false,
  398. configurable: true
  399. });
  400. Object.defineProperty(AdvancedDynamicTextureInstrumentation.prototype, "layoutTimeCounter", {
  401. /**
  402. * Gets the perf counter used to capture layout time
  403. */
  404. get: function () {
  405. return this._layoutTime;
  406. },
  407. enumerable: false,
  408. configurable: true
  409. });
  410. Object.defineProperty(AdvancedDynamicTextureInstrumentation.prototype, "captureRenderTime", {
  411. /**
  412. * Enable or disable the render time capture
  413. */
  414. get: function () {
  415. return this._captureRenderTime;
  416. },
  417. set: function (value) {
  418. var _this = this;
  419. if (value === this._captureRenderTime) {
  420. return;
  421. }
  422. this._captureRenderTime = value;
  423. if (value) {
  424. this._onBeginRenderObserver = this.texture.onBeginRenderObservable.add(function () {
  425. _this._renderTime.beginMonitoring();
  426. });
  427. this._onEndRenderObserver = this.texture.onEndRenderObservable.add(function () {
  428. _this._renderTime.endMonitoring(true);
  429. });
  430. }
  431. else {
  432. this.texture.onBeginRenderObservable.remove(this._onBeginRenderObserver);
  433. this._onBeginRenderObserver = null;
  434. this.texture.onEndRenderObservable.remove(this._onEndRenderObserver);
  435. this._onEndRenderObserver = null;
  436. }
  437. },
  438. enumerable: false,
  439. configurable: true
  440. });
  441. Object.defineProperty(AdvancedDynamicTextureInstrumentation.prototype, "captureLayoutTime", {
  442. /**
  443. * Enable or disable the layout time capture
  444. */
  445. get: function () {
  446. return this._captureLayoutTime;
  447. },
  448. set: function (value) {
  449. var _this = this;
  450. if (value === this._captureLayoutTime) {
  451. return;
  452. }
  453. this._captureLayoutTime = value;
  454. if (value) {
  455. this._onBeginLayoutObserver = this.texture.onBeginLayoutObservable.add(function () {
  456. _this._layoutTime.beginMonitoring();
  457. });
  458. this._onEndLayoutObserver = this.texture.onEndLayoutObservable.add(function () {
  459. _this._layoutTime.endMonitoring(true);
  460. });
  461. }
  462. else {
  463. this.texture.onBeginLayoutObservable.remove(this._onBeginLayoutObserver);
  464. this._onBeginLayoutObserver = null;
  465. this.texture.onEndLayoutObservable.remove(this._onEndLayoutObserver);
  466. this._onEndLayoutObserver = null;
  467. }
  468. },
  469. enumerable: false,
  470. configurable: true
  471. });
  472. /**
  473. * Dispose and release associated resources.
  474. */
  475. AdvancedDynamicTextureInstrumentation.prototype.dispose = function () {
  476. this.texture.onBeginRenderObservable.remove(this._onBeginRenderObserver);
  477. this._onBeginRenderObserver = null;
  478. this.texture.onEndRenderObservable.remove(this._onEndRenderObserver);
  479. this._onEndRenderObserver = null;
  480. this.texture.onBeginLayoutObservable.remove(this._onBeginLayoutObserver);
  481. this._onBeginLayoutObserver = null;
  482. this.texture.onEndLayoutObservable.remove(this._onEndLayoutObserver);
  483. this._onEndLayoutObserver = null;
  484. this.texture = null;
  485. };
  486. return AdvancedDynamicTextureInstrumentation;
  487. }());
  488. /***/ }),
  489. /***/ "./2D/advancedDynamicTexture.ts":
  490. /*!**************************************!*\
  491. !*** ./2D/advancedDynamicTexture.ts ***!
  492. \**************************************/
  493. /*! exports provided: AdvancedDynamicTexture */
  494. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  495. "use strict";
  496. __webpack_require__.r(__webpack_exports__);
  497. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AdvancedDynamicTexture", function() { return AdvancedDynamicTexture; });
  498. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  499. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math.vector");
  500. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
  501. /* harmony import */ var _controls_container__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./controls/container */ "./2D/controls/container.ts");
  502. /* harmony import */ var _style__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./style */ "./2D/style.ts");
  503. /* harmony import */ var _measure__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./measure */ "./2D/measure.ts");
  504. /**
  505. * Class used to create texture to support 2D GUI elements
  506. * @see https://doc.babylonjs.com/how_to/gui
  507. */
  508. var AdvancedDynamicTexture = /** @class */ (function (_super) {
  509. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(AdvancedDynamicTexture, _super);
  510. /**
  511. * Creates a new AdvancedDynamicTexture
  512. * @param name defines the name of the texture
  513. * @param width defines the width of the texture
  514. * @param height defines the height of the texture
  515. * @param scene defines the hosting scene
  516. * @param generateMipMaps defines a boolean indicating if mipmaps must be generated (false by default)
  517. * @param samplingMode defines the texture sampling mode (Texture.NEAREST_SAMPLINGMODE by default)
  518. */
  519. function AdvancedDynamicTexture(name, width, height, scene, generateMipMaps, samplingMode) {
  520. if (width === void 0) { width = 0; }
  521. if (height === void 0) { height = 0; }
  522. if (generateMipMaps === void 0) { generateMipMaps = false; }
  523. if (samplingMode === void 0) { samplingMode = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Texture"].NEAREST_SAMPLINGMODE; }
  524. var _this = _super.call(this, name, { width: width, height: height }, scene, generateMipMaps, samplingMode, babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Constants"].TEXTUREFORMAT_RGBA) || this;
  525. _this._isDirty = false;
  526. /** @hidden */
  527. _this._rootContainer = new _controls_container__WEBPACK_IMPORTED_MODULE_2__["Container"]("root");
  528. /** @hidden */
  529. _this._lastControlOver = {};
  530. /** @hidden */
  531. _this._lastControlDown = {};
  532. /** @hidden */
  533. _this._capturingControl = {};
  534. /** @hidden */
  535. _this._linkedControls = new Array();
  536. _this._isFullscreen = false;
  537. _this._fullscreenViewport = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Viewport"](0, 0, 1, 1);
  538. _this._idealWidth = 0;
  539. _this._idealHeight = 0;
  540. _this._useSmallestIdeal = false;
  541. _this._renderAtIdealSize = false;
  542. _this._blockNextFocusCheck = false;
  543. _this._renderScale = 1;
  544. _this._cursorChanged = false;
  545. _this._defaultMousePointerId = 0;
  546. /** @hidden */
  547. _this._numLayoutCalls = 0;
  548. /** @hidden */
  549. _this._numRenderCalls = 0;
  550. /**
  551. * Define type to string to ensure compatibility across browsers
  552. * Safari doesn't support DataTransfer constructor
  553. */
  554. _this._clipboardData = "";
  555. /**
  556. * Observable event triggered each time an clipboard event is received from the rendering canvas
  557. */
  558. _this.onClipboardObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  559. /**
  560. * Observable event triggered each time a pointer down is intercepted by a control
  561. */
  562. _this.onControlPickedObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  563. /**
  564. * Observable event triggered before layout is evaluated
  565. */
  566. _this.onBeginLayoutObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  567. /**
  568. * Observable event triggered after the layout was evaluated
  569. */
  570. _this.onEndLayoutObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  571. /**
  572. * Observable event triggered before the texture is rendered
  573. */
  574. _this.onBeginRenderObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  575. /**
  576. * Observable event triggered after the texture was rendered
  577. */
  578. _this.onEndRenderObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  579. /**
  580. * Gets or sets a boolean defining if alpha is stored as premultiplied
  581. */
  582. _this.premulAlpha = false;
  583. _this._useInvalidateRectOptimization = true;
  584. // Invalidated rectangle which is the combination of all invalidated controls after they have been rotated into absolute position
  585. _this._invalidatedRectangle = null;
  586. _this._clearMeasure = new _measure__WEBPACK_IMPORTED_MODULE_4__["Measure"](0, 0, 0, 0);
  587. /** @hidden */
  588. _this.onClipboardCopy = function (rawEvt) {
  589. var evt = rawEvt;
  590. var ev = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["ClipboardInfo"](babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["ClipboardEventTypes"].COPY, evt);
  591. _this.onClipboardObservable.notifyObservers(ev);
  592. evt.preventDefault();
  593. };
  594. /** @hidden */
  595. _this.onClipboardCut = function (rawEvt) {
  596. var evt = rawEvt;
  597. var ev = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["ClipboardInfo"](babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["ClipboardEventTypes"].CUT, evt);
  598. _this.onClipboardObservable.notifyObservers(ev);
  599. evt.preventDefault();
  600. };
  601. /** @hidden */
  602. _this.onClipboardPaste = function (rawEvt) {
  603. var evt = rawEvt;
  604. var ev = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["ClipboardInfo"](babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["ClipboardEventTypes"].PASTE, evt);
  605. _this.onClipboardObservable.notifyObservers(ev);
  606. evt.preventDefault();
  607. };
  608. scene = _this.getScene();
  609. if (!scene || !_this._texture) {
  610. return _this;
  611. }
  612. _this._rootElement = scene.getEngine().getInputElement();
  613. _this._renderObserver = scene.onBeforeCameraRenderObservable.add(function (camera) { return _this._checkUpdate(camera); });
  614. _this._preKeyboardObserver = scene.onPreKeyboardObservable.add(function (info) {
  615. if (!_this._focusedControl) {
  616. return;
  617. }
  618. if (info.type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["KeyboardEventTypes"].KEYDOWN) {
  619. _this._focusedControl.processKeyboard(info.event);
  620. }
  621. info.skipOnPointerObservable = true;
  622. });
  623. _this._rootContainer._link(_this);
  624. _this.hasAlpha = true;
  625. if (!width || !height) {
  626. _this._resizeObserver = scene.getEngine().onResizeObservable.add(function () { return _this._onResize(); });
  627. _this._onResize();
  628. }
  629. _this._texture.isReady = true;
  630. return _this;
  631. }
  632. Object.defineProperty(AdvancedDynamicTexture.prototype, "numLayoutCalls", {
  633. /** Gets the number of layout calls made the last time the ADT has been rendered */
  634. get: function () {
  635. return this._numLayoutCalls;
  636. },
  637. enumerable: false,
  638. configurable: true
  639. });
  640. Object.defineProperty(AdvancedDynamicTexture.prototype, "numRenderCalls", {
  641. /** Gets the number of render calls made the last time the ADT has been rendered */
  642. get: function () {
  643. return this._numRenderCalls;
  644. },
  645. enumerable: false,
  646. configurable: true
  647. });
  648. Object.defineProperty(AdvancedDynamicTexture.prototype, "renderScale", {
  649. /**
  650. * Gets or sets a number used to scale rendering size (2 means that the texture will be twice bigger).
  651. * Useful when you want more antialiasing
  652. */
  653. get: function () {
  654. return this._renderScale;
  655. },
  656. set: function (value) {
  657. if (value === this._renderScale) {
  658. return;
  659. }
  660. this._renderScale = value;
  661. this._onResize();
  662. },
  663. enumerable: false,
  664. configurable: true
  665. });
  666. Object.defineProperty(AdvancedDynamicTexture.prototype, "background", {
  667. /** Gets or sets the background color */
  668. get: function () {
  669. return this._background;
  670. },
  671. set: function (value) {
  672. if (this._background === value) {
  673. return;
  674. }
  675. this._background = value;
  676. this.markAsDirty();
  677. },
  678. enumerable: false,
  679. configurable: true
  680. });
  681. Object.defineProperty(AdvancedDynamicTexture.prototype, "idealWidth", {
  682. /**
  683. * Gets or sets the ideal width used to design controls.
  684. * The GUI will then rescale everything accordingly
  685. * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
  686. */
  687. get: function () {
  688. return this._idealWidth;
  689. },
  690. set: function (value) {
  691. if (this._idealWidth === value) {
  692. return;
  693. }
  694. this._idealWidth = value;
  695. this.markAsDirty();
  696. this._rootContainer._markAllAsDirty();
  697. },
  698. enumerable: false,
  699. configurable: true
  700. });
  701. Object.defineProperty(AdvancedDynamicTexture.prototype, "idealHeight", {
  702. /**
  703. * Gets or sets the ideal height used to design controls.
  704. * The GUI will then rescale everything accordingly
  705. * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
  706. */
  707. get: function () {
  708. return this._idealHeight;
  709. },
  710. set: function (value) {
  711. if (this._idealHeight === value) {
  712. return;
  713. }
  714. this._idealHeight = value;
  715. this.markAsDirty();
  716. this._rootContainer._markAllAsDirty();
  717. },
  718. enumerable: false,
  719. configurable: true
  720. });
  721. Object.defineProperty(AdvancedDynamicTexture.prototype, "useSmallestIdeal", {
  722. /**
  723. * Gets or sets a boolean indicating if the smallest ideal value must be used if idealWidth and idealHeight are both set
  724. * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
  725. */
  726. get: function () {
  727. return this._useSmallestIdeal;
  728. },
  729. set: function (value) {
  730. if (this._useSmallestIdeal === value) {
  731. return;
  732. }
  733. this._useSmallestIdeal = value;
  734. this.markAsDirty();
  735. this._rootContainer._markAllAsDirty();
  736. },
  737. enumerable: false,
  738. configurable: true
  739. });
  740. Object.defineProperty(AdvancedDynamicTexture.prototype, "renderAtIdealSize", {
  741. /**
  742. * Gets or sets a boolean indicating if adaptive scaling must be used
  743. * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
  744. */
  745. get: function () {
  746. return this._renderAtIdealSize;
  747. },
  748. set: function (value) {
  749. if (this._renderAtIdealSize === value) {
  750. return;
  751. }
  752. this._renderAtIdealSize = value;
  753. this._onResize();
  754. },
  755. enumerable: false,
  756. configurable: true
  757. });
  758. Object.defineProperty(AdvancedDynamicTexture.prototype, "idealRatio", {
  759. /**
  760. * Gets the ratio used when in "ideal mode"
  761. * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
  762. * */
  763. get: function () {
  764. var rwidth = 0;
  765. var rheight = 0;
  766. if (this._idealWidth) {
  767. rwidth = (this.getSize().width) / this._idealWidth;
  768. }
  769. if (this._idealHeight) {
  770. rheight = (this.getSize().height) / this._idealHeight;
  771. }
  772. if (this._useSmallestIdeal && this._idealWidth && this._idealHeight) {
  773. return window.innerWidth < window.innerHeight ? rwidth : rheight;
  774. }
  775. if (this._idealWidth) { // horizontal
  776. return rwidth;
  777. }
  778. if (this._idealHeight) { // vertical
  779. return rheight;
  780. }
  781. return 1;
  782. },
  783. enumerable: false,
  784. configurable: true
  785. });
  786. Object.defineProperty(AdvancedDynamicTexture.prototype, "layer", {
  787. /**
  788. * Gets the underlying layer used to render the texture when in fullscreen mode
  789. */
  790. get: function () {
  791. return this._layerToDispose;
  792. },
  793. enumerable: false,
  794. configurable: true
  795. });
  796. Object.defineProperty(AdvancedDynamicTexture.prototype, "rootContainer", {
  797. /**
  798. * Gets the root container control
  799. */
  800. get: function () {
  801. return this._rootContainer;
  802. },
  803. enumerable: false,
  804. configurable: true
  805. });
  806. /**
  807. * Returns an array containing the root container.
  808. * This is mostly used to let the Inspector introspects the ADT
  809. * @returns an array containing the rootContainer
  810. */
  811. AdvancedDynamicTexture.prototype.getChildren = function () {
  812. return [this._rootContainer];
  813. };
  814. /**
  815. * Will return all controls that are inside this texture
  816. * @param directDescendantsOnly defines if true only direct descendants of 'this' will be considered, if false direct and also indirect (children of children, an so on in a recursive manner) descendants of 'this' will be considered
  817. * @param predicate defines an optional predicate that will be called on every evaluated child, the predicate must return true for a given child to be part of the result, otherwise it will be ignored
  818. * @return all child controls
  819. */
  820. AdvancedDynamicTexture.prototype.getDescendants = function (directDescendantsOnly, predicate) {
  821. return this._rootContainer.getDescendants(directDescendantsOnly, predicate);
  822. };
  823. Object.defineProperty(AdvancedDynamicTexture.prototype, "focusedControl", {
  824. /**
  825. * Gets or sets the current focused control
  826. */
  827. get: function () {
  828. return this._focusedControl;
  829. },
  830. set: function (control) {
  831. if (this._focusedControl == control) {
  832. return;
  833. }
  834. if (this._focusedControl) {
  835. this._focusedControl.onBlur();
  836. }
  837. if (control) {
  838. control.onFocus();
  839. }
  840. this._focusedControl = control;
  841. },
  842. enumerable: false,
  843. configurable: true
  844. });
  845. Object.defineProperty(AdvancedDynamicTexture.prototype, "isForeground", {
  846. /**
  847. * Gets or sets a boolean indicating if the texture must be rendered in background or foreground when in fullscreen mode
  848. */
  849. get: function () {
  850. if (!this.layer) {
  851. return true;
  852. }
  853. return (!this.layer.isBackground);
  854. },
  855. set: function (value) {
  856. if (!this.layer) {
  857. return;
  858. }
  859. if (this.layer.isBackground === !value) {
  860. return;
  861. }
  862. this.layer.isBackground = !value;
  863. },
  864. enumerable: false,
  865. configurable: true
  866. });
  867. Object.defineProperty(AdvancedDynamicTexture.prototype, "clipboardData", {
  868. /**
  869. * Gets or set information about clipboardData
  870. */
  871. get: function () {
  872. return this._clipboardData;
  873. },
  874. set: function (value) {
  875. this._clipboardData = value;
  876. },
  877. enumerable: false,
  878. configurable: true
  879. });
  880. /**
  881. * Get the current class name of the texture useful for serialization or dynamic coding.
  882. * @returns "AdvancedDynamicTexture"
  883. */
  884. AdvancedDynamicTexture.prototype.getClassName = function () {
  885. return "AdvancedDynamicTexture";
  886. };
  887. /**
  888. * Function used to execute a function on all controls
  889. * @param func defines the function to execute
  890. * @param container defines the container where controls belong. If null the root container will be used
  891. */
  892. AdvancedDynamicTexture.prototype.executeOnAllControls = function (func, container) {
  893. if (!container) {
  894. container = this._rootContainer;
  895. }
  896. func(container);
  897. for (var _i = 0, _a = container.children; _i < _a.length; _i++) {
  898. var child = _a[_i];
  899. if (child.children) {
  900. this.executeOnAllControls(func, child);
  901. continue;
  902. }
  903. func(child);
  904. }
  905. };
  906. Object.defineProperty(AdvancedDynamicTexture.prototype, "useInvalidateRectOptimization", {
  907. /**
  908. * Gets or sets a boolean indicating if the InvalidateRect optimization should be turned on
  909. */
  910. get: function () {
  911. return this._useInvalidateRectOptimization;
  912. },
  913. set: function (value) {
  914. this._useInvalidateRectOptimization = value;
  915. },
  916. enumerable: false,
  917. configurable: true
  918. });
  919. /**
  920. * Invalidates a rectangle area on the gui texture
  921. * @param invalidMinX left most position of the rectangle to invalidate in the texture
  922. * @param invalidMinY top most position of the rectangle to invalidate in the texture
  923. * @param invalidMaxX right most position of the rectangle to invalidate in the texture
  924. * @param invalidMaxY bottom most position of the rectangle to invalidate in the texture
  925. */
  926. AdvancedDynamicTexture.prototype.invalidateRect = function (invalidMinX, invalidMinY, invalidMaxX, invalidMaxY) {
  927. if (!this._useInvalidateRectOptimization) {
  928. return;
  929. }
  930. if (!this._invalidatedRectangle) {
  931. this._invalidatedRectangle = new _measure__WEBPACK_IMPORTED_MODULE_4__["Measure"](invalidMinX, invalidMinY, invalidMaxX - invalidMinX + 1, invalidMaxY - invalidMinY + 1);
  932. }
  933. else {
  934. // Compute intersection
  935. var maxX = Math.ceil(Math.max(this._invalidatedRectangle.left + this._invalidatedRectangle.width - 1, invalidMaxX));
  936. var maxY = Math.ceil(Math.max(this._invalidatedRectangle.top + this._invalidatedRectangle.height - 1, invalidMaxY));
  937. this._invalidatedRectangle.left = Math.floor(Math.min(this._invalidatedRectangle.left, invalidMinX));
  938. this._invalidatedRectangle.top = Math.floor(Math.min(this._invalidatedRectangle.top, invalidMinY));
  939. this._invalidatedRectangle.width = maxX - this._invalidatedRectangle.left + 1;
  940. this._invalidatedRectangle.height = maxY - this._invalidatedRectangle.top + 1;
  941. }
  942. };
  943. /**
  944. * Marks the texture as dirty forcing a complete update
  945. */
  946. AdvancedDynamicTexture.prototype.markAsDirty = function () {
  947. this._isDirty = true;
  948. };
  949. /**
  950. * Helper function used to create a new style
  951. * @returns a new style
  952. * @see https://doc.babylonjs.com/how_to/gui#styles
  953. */
  954. AdvancedDynamicTexture.prototype.createStyle = function () {
  955. return new _style__WEBPACK_IMPORTED_MODULE_3__["Style"](this);
  956. };
  957. /**
  958. * Adds a new control to the root container
  959. * @param control defines the control to add
  960. * @returns the current texture
  961. */
  962. AdvancedDynamicTexture.prototype.addControl = function (control) {
  963. this._rootContainer.addControl(control);
  964. return this;
  965. };
  966. /**
  967. * Removes a control from the root container
  968. * @param control defines the control to remove
  969. * @returns the current texture
  970. */
  971. AdvancedDynamicTexture.prototype.removeControl = function (control) {
  972. this._rootContainer.removeControl(control);
  973. return this;
  974. };
  975. /**
  976. * Release all resources
  977. */
  978. AdvancedDynamicTexture.prototype.dispose = function () {
  979. var scene = this.getScene();
  980. if (!scene) {
  981. return;
  982. }
  983. this._rootElement = null;
  984. scene.onBeforeCameraRenderObservable.remove(this._renderObserver);
  985. if (this._resizeObserver) {
  986. scene.getEngine().onResizeObservable.remove(this._resizeObserver);
  987. }
  988. if (this._pointerMoveObserver) {
  989. scene.onPrePointerObservable.remove(this._pointerMoveObserver);
  990. }
  991. if (this._pointerObserver) {
  992. scene.onPointerObservable.remove(this._pointerObserver);
  993. }
  994. if (this._preKeyboardObserver) {
  995. scene.onPreKeyboardObservable.remove(this._preKeyboardObserver);
  996. }
  997. if (this._canvasPointerOutObserver) {
  998. scene.getEngine().onCanvasPointerOutObservable.remove(this._canvasPointerOutObserver);
  999. }
  1000. if (this._canvasBlurObserver) {
  1001. scene.getEngine().onCanvasBlurObservable.remove(this._canvasBlurObserver);
  1002. }
  1003. if (this._layerToDispose) {
  1004. this._layerToDispose.texture = null;
  1005. this._layerToDispose.dispose();
  1006. this._layerToDispose = null;
  1007. }
  1008. this._rootContainer.dispose();
  1009. this.onClipboardObservable.clear();
  1010. this.onControlPickedObservable.clear();
  1011. this.onBeginRenderObservable.clear();
  1012. this.onEndRenderObservable.clear();
  1013. this.onBeginLayoutObservable.clear();
  1014. this.onEndLayoutObservable.clear();
  1015. _super.prototype.dispose.call(this);
  1016. };
  1017. AdvancedDynamicTexture.prototype._onResize = function () {
  1018. var scene = this.getScene();
  1019. if (!scene) {
  1020. return;
  1021. }
  1022. // Check size
  1023. var engine = scene.getEngine();
  1024. var textureSize = this.getSize();
  1025. var renderWidth = engine.getRenderWidth() * this._renderScale;
  1026. var renderHeight = engine.getRenderHeight() * this._renderScale;
  1027. if (this._renderAtIdealSize) {
  1028. if (this._idealWidth) {
  1029. renderHeight = (renderHeight * this._idealWidth) / renderWidth;
  1030. renderWidth = this._idealWidth;
  1031. }
  1032. else if (this._idealHeight) {
  1033. renderWidth = (renderWidth * this._idealHeight) / renderHeight;
  1034. renderHeight = this._idealHeight;
  1035. }
  1036. }
  1037. if (textureSize.width !== renderWidth || textureSize.height !== renderHeight) {
  1038. this.scaleTo(renderWidth, renderHeight);
  1039. this.markAsDirty();
  1040. if (this._idealWidth || this._idealHeight) {
  1041. this._rootContainer._markAllAsDirty();
  1042. }
  1043. }
  1044. this.invalidateRect(0, 0, textureSize.width - 1, textureSize.height - 1);
  1045. };
  1046. /** @hidden */
  1047. AdvancedDynamicTexture.prototype._getGlobalViewport = function (scene) {
  1048. var engine = scene.getEngine();
  1049. return this._fullscreenViewport.toGlobal(engine.getRenderWidth(), engine.getRenderHeight());
  1050. };
  1051. /**
  1052. * Get screen coordinates for a vector3
  1053. * @param position defines the position to project
  1054. * @param worldMatrix defines the world matrix to use
  1055. * @returns the projected position
  1056. */
  1057. AdvancedDynamicTexture.prototype.getProjectedPosition = function (position, worldMatrix) {
  1058. var scene = this.getScene();
  1059. if (!scene) {
  1060. return babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Vector2"].Zero();
  1061. }
  1062. var globalViewport = this._getGlobalViewport(scene);
  1063. var projectedPosition = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Vector3"].Project(position, worldMatrix, scene.getTransformMatrix(), globalViewport);
  1064. projectedPosition.scaleInPlace(this.renderScale);
  1065. return new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Vector2"](projectedPosition.x, projectedPosition.y);
  1066. };
  1067. AdvancedDynamicTexture.prototype._checkUpdate = function (camera) {
  1068. if (this._layerToDispose) {
  1069. if ((camera.layerMask & this._layerToDispose.layerMask) === 0) {
  1070. return;
  1071. }
  1072. }
  1073. if (this._isFullscreen && this._linkedControls.length) {
  1074. var scene = this.getScene();
  1075. if (!scene) {
  1076. return;
  1077. }
  1078. var globalViewport = this._getGlobalViewport(scene);
  1079. var _loop_1 = function (control) {
  1080. if (!control.isVisible) {
  1081. return "continue";
  1082. }
  1083. var mesh = control._linkedMesh;
  1084. if (!mesh || mesh.isDisposed()) {
  1085. babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Tools"].SetImmediate(function () {
  1086. control.linkWithMesh(null);
  1087. });
  1088. return "continue";
  1089. }
  1090. var position = mesh.getBoundingInfo ? mesh.getBoundingInfo().boundingSphere.center : babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Vector3"].ZeroReadOnly;
  1091. var projectedPosition = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Vector3"].Project(position, mesh.getWorldMatrix(), scene.getTransformMatrix(), globalViewport);
  1092. if (projectedPosition.z < 0 || projectedPosition.z > 1) {
  1093. control.notRenderable = true;
  1094. return "continue";
  1095. }
  1096. control.notRenderable = false;
  1097. // Account for RenderScale.
  1098. projectedPosition.scaleInPlace(this_1.renderScale);
  1099. control._moveToProjectedPosition(projectedPosition);
  1100. };
  1101. var this_1 = this;
  1102. for (var _i = 0, _a = this._linkedControls; _i < _a.length; _i++) {
  1103. var control = _a[_i];
  1104. _loop_1(control);
  1105. }
  1106. }
  1107. if (!this._isDirty && !this._rootContainer.isDirty) {
  1108. return;
  1109. }
  1110. this._isDirty = false;
  1111. this._render();
  1112. this.update(true, this.premulAlpha);
  1113. };
  1114. AdvancedDynamicTexture.prototype._render = function () {
  1115. var textureSize = this.getSize();
  1116. var renderWidth = textureSize.width;
  1117. var renderHeight = textureSize.height;
  1118. var context = this.getContext();
  1119. context.font = "18px Arial";
  1120. context.strokeStyle = "white";
  1121. // Layout
  1122. this.onBeginLayoutObservable.notifyObservers(this);
  1123. var measure = new _measure__WEBPACK_IMPORTED_MODULE_4__["Measure"](0, 0, renderWidth, renderHeight);
  1124. this._numLayoutCalls = 0;
  1125. this._rootContainer._layout(measure, context);
  1126. this.onEndLayoutObservable.notifyObservers(this);
  1127. this._isDirty = false; // Restoring the dirty state that could have been set by controls during layout processing
  1128. // Clear
  1129. if (this._invalidatedRectangle) {
  1130. this._clearMeasure.copyFrom(this._invalidatedRectangle);
  1131. }
  1132. else {
  1133. this._clearMeasure.copyFromFloats(0, 0, renderWidth, renderHeight);
  1134. }
  1135. context.clearRect(this._clearMeasure.left, this._clearMeasure.top, this._clearMeasure.width, this._clearMeasure.height);
  1136. if (this._background) {
  1137. context.save();
  1138. context.fillStyle = this._background;
  1139. context.fillRect(this._clearMeasure.left, this._clearMeasure.top, this._clearMeasure.width, this._clearMeasure.height);
  1140. context.restore();
  1141. }
  1142. // Render
  1143. this.onBeginRenderObservable.notifyObservers(this);
  1144. this._numRenderCalls = 0;
  1145. this._rootContainer._render(context, this._invalidatedRectangle);
  1146. this.onEndRenderObservable.notifyObservers(this);
  1147. this._invalidatedRectangle = null;
  1148. };
  1149. /** @hidden */
  1150. AdvancedDynamicTexture.prototype._changeCursor = function (cursor) {
  1151. if (this._rootElement) {
  1152. this._rootElement.style.cursor = cursor;
  1153. this._cursorChanged = true;
  1154. }
  1155. };
  1156. /** @hidden */
  1157. AdvancedDynamicTexture.prototype._registerLastControlDown = function (control, pointerId) {
  1158. this._lastControlDown[pointerId] = control;
  1159. this.onControlPickedObservable.notifyObservers(control);
  1160. };
  1161. AdvancedDynamicTexture.prototype._doPicking = function (x, y, type, pointerId, buttonIndex, deltaX, deltaY) {
  1162. var scene = this.getScene();
  1163. if (!scene) {
  1164. return;
  1165. }
  1166. var engine = scene.getEngine();
  1167. var textureSize = this.getSize();
  1168. if (this._isFullscreen) {
  1169. var camera = scene.cameraToUseForPointers || scene.activeCamera;
  1170. var viewport = camera.viewport;
  1171. x = x * (textureSize.width / (engine.getRenderWidth() * viewport.width));
  1172. y = y * (textureSize.height / (engine.getRenderHeight() * viewport.height));
  1173. }
  1174. if (this._capturingControl[pointerId]) {
  1175. this._capturingControl[pointerId]._processObservables(type, x, y, pointerId, buttonIndex);
  1176. return;
  1177. }
  1178. this._cursorChanged = false;
  1179. if (!this._rootContainer._processPicking(x, y, type, pointerId, buttonIndex, deltaX, deltaY)) {
  1180. this._changeCursor("");
  1181. if (type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["PointerEventTypes"].POINTERMOVE) {
  1182. if (this._lastControlOver[pointerId]) {
  1183. this._lastControlOver[pointerId]._onPointerOut(this._lastControlOver[pointerId]);
  1184. delete this._lastControlOver[pointerId];
  1185. }
  1186. }
  1187. }
  1188. if (!this._cursorChanged) {
  1189. this._changeCursor("");
  1190. }
  1191. this._manageFocus();
  1192. };
  1193. /** @hidden */
  1194. AdvancedDynamicTexture.prototype._cleanControlAfterRemovalFromList = function (list, control) {
  1195. for (var pointerId in list) {
  1196. if (!list.hasOwnProperty(pointerId)) {
  1197. continue;
  1198. }
  1199. var lastControlOver = list[pointerId];
  1200. if (lastControlOver === control) {
  1201. delete list[pointerId];
  1202. }
  1203. }
  1204. };
  1205. /** @hidden */
  1206. AdvancedDynamicTexture.prototype._cleanControlAfterRemoval = function (control) {
  1207. this._cleanControlAfterRemovalFromList(this._lastControlDown, control);
  1208. this._cleanControlAfterRemovalFromList(this._lastControlOver, control);
  1209. };
  1210. /** Attach to all scene events required to support pointer events */
  1211. AdvancedDynamicTexture.prototype.attach = function () {
  1212. var _this = this;
  1213. var scene = this.getScene();
  1214. if (!scene) {
  1215. return;
  1216. }
  1217. var tempViewport = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Viewport"](0, 0, 0, 0);
  1218. this._pointerMoveObserver = scene.onPrePointerObservable.add(function (pi, state) {
  1219. if (scene.isPointerCaptured((pi.event).pointerId)) {
  1220. return;
  1221. }
  1222. if (pi.type !== babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["PointerEventTypes"].POINTERMOVE
  1223. && pi.type !== babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["PointerEventTypes"].POINTERUP
  1224. && pi.type !== babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["PointerEventTypes"].POINTERDOWN
  1225. && pi.type !== babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["PointerEventTypes"].POINTERWHEEL) {
  1226. return;
  1227. }
  1228. if (!scene) {
  1229. return;
  1230. }
  1231. if (pi.type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["PointerEventTypes"].POINTERMOVE && pi.event.pointerId) {
  1232. _this._defaultMousePointerId = pi.event.pointerId; // This is required to make sure we have the correct pointer ID for wheel
  1233. }
  1234. var camera = scene.cameraToUseForPointers || scene.activeCamera;
  1235. var engine = scene.getEngine();
  1236. if (!camera) {
  1237. tempViewport.x = 0;
  1238. tempViewport.y = 0;
  1239. tempViewport.width = engine.getRenderWidth();
  1240. tempViewport.height = engine.getRenderHeight();
  1241. }
  1242. else {
  1243. camera.viewport.toGlobalToRef(engine.getRenderWidth(), engine.getRenderHeight(), tempViewport);
  1244. }
  1245. var x = scene.pointerX / engine.getHardwareScalingLevel() - tempViewport.x;
  1246. var y = scene.pointerY / engine.getHardwareScalingLevel() - (engine.getRenderHeight() - tempViewport.y - tempViewport.height);
  1247. _this._shouldBlockPointer = false;
  1248. // Do picking modifies _shouldBlockPointer
  1249. var pointerId = pi.event.pointerId || _this._defaultMousePointerId;
  1250. _this._doPicking(x, y, pi.type, pointerId, pi.event.button, pi.event.deltaX, pi.event.deltaY);
  1251. // Avoid overwriting a true skipOnPointerObservable to false
  1252. if (_this._shouldBlockPointer) {
  1253. pi.skipOnPointerObservable = _this._shouldBlockPointer;
  1254. }
  1255. });
  1256. this._attachToOnPointerOut(scene);
  1257. this._attachToOnBlur(scene);
  1258. };
  1259. /**
  1260. * Register the clipboard Events onto the canvas
  1261. */
  1262. AdvancedDynamicTexture.prototype.registerClipboardEvents = function () {
  1263. self.addEventListener("copy", this.onClipboardCopy, false);
  1264. self.addEventListener("cut", this.onClipboardCut, false);
  1265. self.addEventListener("paste", this.onClipboardPaste, false);
  1266. };
  1267. /**
  1268. * Unregister the clipboard Events from the canvas
  1269. */
  1270. AdvancedDynamicTexture.prototype.unRegisterClipboardEvents = function () {
  1271. self.removeEventListener("copy", this.onClipboardCopy);
  1272. self.removeEventListener("cut", this.onClipboardCut);
  1273. self.removeEventListener("paste", this.onClipboardPaste);
  1274. };
  1275. /**
  1276. * Connect the texture to a hosting mesh to enable interactions
  1277. * @param mesh defines the mesh to attach to
  1278. * @param supportPointerMove defines a boolean indicating if pointer move events must be catched as well
  1279. */
  1280. AdvancedDynamicTexture.prototype.attachToMesh = function (mesh, supportPointerMove) {
  1281. var _this = this;
  1282. if (supportPointerMove === void 0) { supportPointerMove = true; }
  1283. var scene = this.getScene();
  1284. if (!scene) {
  1285. return;
  1286. }
  1287. this._pointerObserver = scene.onPointerObservable.add(function (pi, state) {
  1288. if (pi.type !== babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["PointerEventTypes"].POINTERMOVE
  1289. && pi.type !== babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["PointerEventTypes"].POINTERUP
  1290. && pi.type !== babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["PointerEventTypes"].POINTERDOWN) {
  1291. return;
  1292. }
  1293. var pointerId = pi.event.pointerId || _this._defaultMousePointerId;
  1294. if (pi.pickInfo && pi.pickInfo.hit && pi.pickInfo.pickedMesh === mesh) {
  1295. var uv = pi.pickInfo.getTextureCoordinates();
  1296. if (uv) {
  1297. var size = _this.getSize();
  1298. _this._doPicking(uv.x * size.width, (1.0 - uv.y) * size.height, pi.type, pointerId, pi.event.button);
  1299. }
  1300. }
  1301. else if (pi.type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["PointerEventTypes"].POINTERUP) {
  1302. if (_this._lastControlDown[pointerId]) {
  1303. _this._lastControlDown[pointerId]._forcePointerUp(pointerId);
  1304. }
  1305. delete _this._lastControlDown[pointerId];
  1306. if (_this.focusedControl) {
  1307. var friendlyControls = _this.focusedControl.keepsFocusWith();
  1308. var canMoveFocus = true;
  1309. if (friendlyControls) {
  1310. for (var _i = 0, friendlyControls_1 = friendlyControls; _i < friendlyControls_1.length; _i++) {
  1311. var control = friendlyControls_1[_i];
  1312. // Same host, no need to keep the focus
  1313. if (_this === control._host) {
  1314. continue;
  1315. }
  1316. // Different hosts
  1317. var otherHost = control._host;
  1318. if (otherHost._lastControlOver[pointerId] && otherHost._lastControlOver[pointerId].isAscendant(control)) {
  1319. canMoveFocus = false;
  1320. break;
  1321. }
  1322. }
  1323. }
  1324. if (canMoveFocus) {
  1325. _this.focusedControl = null;
  1326. }
  1327. }
  1328. }
  1329. else if (pi.type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["PointerEventTypes"].POINTERMOVE) {
  1330. if (_this._lastControlOver[pointerId]) {
  1331. _this._lastControlOver[pointerId]._onPointerOut(_this._lastControlOver[pointerId], true);
  1332. }
  1333. delete _this._lastControlOver[pointerId];
  1334. }
  1335. });
  1336. mesh.enablePointerMoveEvents = supportPointerMove;
  1337. this._attachToOnPointerOut(scene);
  1338. this._attachToOnBlur(scene);
  1339. };
  1340. /**
  1341. * Move the focus to a specific control
  1342. * @param control defines the control which will receive the focus
  1343. */
  1344. AdvancedDynamicTexture.prototype.moveFocusToControl = function (control) {
  1345. this.focusedControl = control;
  1346. this._lastPickedControl = control;
  1347. this._blockNextFocusCheck = true;
  1348. };
  1349. AdvancedDynamicTexture.prototype._manageFocus = function () {
  1350. if (this._blockNextFocusCheck) {
  1351. this._blockNextFocusCheck = false;
  1352. this._lastPickedControl = this._focusedControl;
  1353. return;
  1354. }
  1355. // Focus management
  1356. if (this._focusedControl) {
  1357. if (this._focusedControl !== this._lastPickedControl) {
  1358. if (this._lastPickedControl.isFocusInvisible) {
  1359. return;
  1360. }
  1361. this.focusedControl = null;
  1362. }
  1363. }
  1364. };
  1365. AdvancedDynamicTexture.prototype._attachToOnPointerOut = function (scene) {
  1366. var _this = this;
  1367. this._canvasPointerOutObserver = scene.getEngine().onCanvasPointerOutObservable.add(function (pointerEvent) {
  1368. if (_this._lastControlOver[pointerEvent.pointerId]) {
  1369. _this._lastControlOver[pointerEvent.pointerId]._onPointerOut(_this._lastControlOver[pointerEvent.pointerId]);
  1370. }
  1371. delete _this._lastControlOver[pointerEvent.pointerId];
  1372. if (_this._lastControlDown[pointerEvent.pointerId] && _this._lastControlDown[pointerEvent.pointerId] !== _this._capturingControl[pointerEvent.pointerId]) {
  1373. _this._lastControlDown[pointerEvent.pointerId]._forcePointerUp();
  1374. delete _this._lastControlDown[pointerEvent.pointerId];
  1375. }
  1376. });
  1377. };
  1378. AdvancedDynamicTexture.prototype._attachToOnBlur = function (scene) {
  1379. var _this = this;
  1380. this._canvasBlurObserver = scene.getEngine().onCanvasBlurObservable.add(function (pointerEvent) {
  1381. Object.entries(_this._lastControlDown).forEach(function (_a) {
  1382. var key = _a[0], value = _a[1];
  1383. value._onCanvasBlur();
  1384. });
  1385. _this._lastControlDown = {};
  1386. });
  1387. };
  1388. // Statics
  1389. /**
  1390. * Creates a new AdvancedDynamicTexture in projected mode (ie. attached to a mesh)
  1391. * @param mesh defines the mesh which will receive the texture
  1392. * @param width defines the texture width (1024 by default)
  1393. * @param height defines the texture height (1024 by default)
  1394. * @param supportPointerMove defines a boolean indicating if the texture must capture move events (true by default)
  1395. * @param onlyAlphaTesting defines a boolean indicating that alpha blending will not be used (only alpha testing) (false by default)
  1396. * @returns a new AdvancedDynamicTexture
  1397. */
  1398. AdvancedDynamicTexture.CreateForMesh = function (mesh, width, height, supportPointerMove, onlyAlphaTesting) {
  1399. if (width === void 0) { width = 1024; }
  1400. if (height === void 0) { height = 1024; }
  1401. if (supportPointerMove === void 0) { supportPointerMove = true; }
  1402. if (onlyAlphaTesting === void 0) { onlyAlphaTesting = false; }
  1403. var result = new AdvancedDynamicTexture(mesh.name + " AdvancedDynamicTexture", width, height, mesh.getScene(), true, babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Texture"].TRILINEAR_SAMPLINGMODE);
  1404. var material = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["StandardMaterial"]("AdvancedDynamicTextureMaterial", mesh.getScene());
  1405. material.backFaceCulling = false;
  1406. material.diffuseColor = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].Black();
  1407. material.specularColor = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].Black();
  1408. if (onlyAlphaTesting) {
  1409. material.diffuseTexture = result;
  1410. material.emissiveTexture = result;
  1411. result.hasAlpha = true;
  1412. }
  1413. else {
  1414. material.emissiveTexture = result;
  1415. material.opacityTexture = result;
  1416. }
  1417. mesh.material = material;
  1418. result.attachToMesh(mesh, supportPointerMove);
  1419. return result;
  1420. };
  1421. /**
  1422. * Creates a new AdvancedDynamicTexture in fullscreen mode.
  1423. * In this mode the texture will rely on a layer for its rendering.
  1424. * This allows it to be treated like any other layer.
  1425. * As such, if you have a multi camera setup, you can set the layerMask on the GUI as well.
  1426. * LayerMask is set through advancedTexture.layer.layerMask
  1427. * @param name defines name for the texture
  1428. * @param foreground defines a boolean indicating if the texture must be rendered in foreground (default is true)
  1429. * @param scene defines the hsoting scene
  1430. * @param sampling defines the texture sampling mode (Texture.BILINEAR_SAMPLINGMODE by default)
  1431. * @returns a new AdvancedDynamicTexture
  1432. */
  1433. AdvancedDynamicTexture.CreateFullscreenUI = function (name, foreground, scene, sampling) {
  1434. if (foreground === void 0) { foreground = true; }
  1435. if (scene === void 0) { scene = null; }
  1436. if (sampling === void 0) { sampling = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Texture"].BILINEAR_SAMPLINGMODE; }
  1437. var result = new AdvancedDynamicTexture(name, 0, 0, scene, false, sampling);
  1438. // Display
  1439. var layer = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Layer"](name + "_layer", null, scene, !foreground);
  1440. layer.texture = result;
  1441. result._layerToDispose = layer;
  1442. result._isFullscreen = true;
  1443. // Attach
  1444. result.attach();
  1445. return result;
  1446. };
  1447. return AdvancedDynamicTexture;
  1448. }(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["DynamicTexture"]));
  1449. /***/ }),
  1450. /***/ "./2D/controls/button.ts":
  1451. /*!*******************************!*\
  1452. !*** ./2D/controls/button.ts ***!
  1453. \*******************************/
  1454. /*! exports provided: Button */
  1455. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  1456. "use strict";
  1457. __webpack_require__.r(__webpack_exports__);
  1458. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Button", function() { return Button; });
  1459. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  1460. /* harmony import */ var _rectangle__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./rectangle */ "./2D/controls/rectangle.ts");
  1461. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  1462. /* harmony import */ var _textBlock__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./textBlock */ "./2D/controls/textBlock.ts");
  1463. /* harmony import */ var _image__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./image */ "./2D/controls/image.ts");
  1464. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math.vector");
  1465. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_5__);
  1466. /**
  1467. * Class used to create 2D buttons
  1468. */
  1469. var Button = /** @class */ (function (_super) {
  1470. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(Button, _super);
  1471. /**
  1472. * Creates a new Button
  1473. * @param name defines the name of the button
  1474. */
  1475. function Button(name) {
  1476. var _this = _super.call(this, name) || this;
  1477. _this.name = name;
  1478. /**
  1479. * Gets or sets a boolean indicating that the button will let internal controls handle picking instead of doing it directly using its bounding info
  1480. */
  1481. _this.delegatePickingToChildren = false;
  1482. _this.thickness = 1;
  1483. _this.isPointerBlocker = true;
  1484. var alphaStore = null;
  1485. _this.pointerEnterAnimation = function () {
  1486. alphaStore = _this.alpha;
  1487. _this.alpha -= 0.1;
  1488. };
  1489. _this.pointerOutAnimation = function () {
  1490. if (alphaStore !== null) {
  1491. _this.alpha = alphaStore;
  1492. }
  1493. };
  1494. _this.pointerDownAnimation = function () {
  1495. _this.scaleX -= 0.05;
  1496. _this.scaleY -= 0.05;
  1497. };
  1498. _this.pointerUpAnimation = function () {
  1499. _this.scaleX += 0.05;
  1500. _this.scaleY += 0.05;
  1501. };
  1502. return _this;
  1503. }
  1504. Object.defineProperty(Button.prototype, "image", {
  1505. /**
  1506. * Returns the image part of the button (if any)
  1507. */
  1508. get: function () {
  1509. return this._image;
  1510. },
  1511. enumerable: false,
  1512. configurable: true
  1513. });
  1514. Object.defineProperty(Button.prototype, "textBlock", {
  1515. /**
  1516. * Returns the image part of the button (if any)
  1517. */
  1518. get: function () {
  1519. return this._textBlock;
  1520. },
  1521. enumerable: false,
  1522. configurable: true
  1523. });
  1524. Button.prototype._getTypeName = function () {
  1525. return "Button";
  1526. };
  1527. // While being a container, the button behaves like a control.
  1528. /** @hidden */
  1529. Button.prototype._processPicking = function (x, y, type, pointerId, buttonIndex, deltaX, deltaY) {
  1530. if (!this._isEnabled || !this.isHitTestVisible || !this.isVisible || this.notRenderable) {
  1531. return false;
  1532. }
  1533. if (!_super.prototype.contains.call(this, x, y)) {
  1534. return false;
  1535. }
  1536. if (this.delegatePickingToChildren) {
  1537. var contains = false;
  1538. for (var index = this._children.length - 1; index >= 0; index--) {
  1539. var child = this._children[index];
  1540. if (child.isEnabled && child.isHitTestVisible && child.isVisible && !child.notRenderable && child.contains(x, y)) {
  1541. contains = true;
  1542. break;
  1543. }
  1544. }
  1545. if (!contains) {
  1546. return false;
  1547. }
  1548. }
  1549. this._processObservables(type, x, y, pointerId, buttonIndex, deltaX, deltaY);
  1550. return true;
  1551. };
  1552. /** @hidden */
  1553. Button.prototype._onPointerEnter = function (target) {
  1554. if (!_super.prototype._onPointerEnter.call(this, target)) {
  1555. return false;
  1556. }
  1557. if (this.pointerEnterAnimation) {
  1558. this.pointerEnterAnimation();
  1559. }
  1560. return true;
  1561. };
  1562. /** @hidden */
  1563. Button.prototype._onPointerOut = function (target, force) {
  1564. if (force === void 0) { force = false; }
  1565. if (this.pointerOutAnimation) {
  1566. this.pointerOutAnimation();
  1567. }
  1568. _super.prototype._onPointerOut.call(this, target, force);
  1569. };
  1570. /** @hidden */
  1571. Button.prototype._onPointerDown = function (target, coordinates, pointerId, buttonIndex) {
  1572. if (!_super.prototype._onPointerDown.call(this, target, coordinates, pointerId, buttonIndex)) {
  1573. return false;
  1574. }
  1575. if (this.pointerDownAnimation) {
  1576. this.pointerDownAnimation();
  1577. }
  1578. return true;
  1579. };
  1580. /** @hidden */
  1581. Button.prototype._onPointerUp = function (target, coordinates, pointerId, buttonIndex, notifyClick) {
  1582. if (this.pointerUpAnimation) {
  1583. this.pointerUpAnimation();
  1584. }
  1585. _super.prototype._onPointerUp.call(this, target, coordinates, pointerId, buttonIndex, notifyClick);
  1586. };
  1587. // Statics
  1588. /**
  1589. * Creates a new button made with an image and a text
  1590. * @param name defines the name of the button
  1591. * @param text defines the text of the button
  1592. * @param imageUrl defines the url of the image
  1593. * @returns a new Button
  1594. */
  1595. Button.CreateImageButton = function (name, text, imageUrl) {
  1596. var result = new Button(name);
  1597. // Adding text
  1598. var textBlock = new _textBlock__WEBPACK_IMPORTED_MODULE_3__["TextBlock"](name + "_button", text);
  1599. textBlock.textWrapping = true;
  1600. textBlock.textHorizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].HORIZONTAL_ALIGNMENT_CENTER;
  1601. textBlock.paddingLeft = "20%";
  1602. result.addControl(textBlock);
  1603. // Adding image
  1604. var iconImage = new _image__WEBPACK_IMPORTED_MODULE_4__["Image"](name + "_icon", imageUrl);
  1605. iconImage.width = "20%";
  1606. iconImage.stretch = _image__WEBPACK_IMPORTED_MODULE_4__["Image"].STRETCH_UNIFORM;
  1607. iconImage.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  1608. result.addControl(iconImage);
  1609. // Store
  1610. result._image = iconImage;
  1611. result._textBlock = textBlock;
  1612. return result;
  1613. };
  1614. /**
  1615. * Creates a new button made with an image
  1616. * @param name defines the name of the button
  1617. * @param imageUrl defines the url of the image
  1618. * @returns a new Button
  1619. */
  1620. Button.CreateImageOnlyButton = function (name, imageUrl) {
  1621. var result = new Button(name);
  1622. // Adding image
  1623. var iconImage = new _image__WEBPACK_IMPORTED_MODULE_4__["Image"](name + "_icon", imageUrl);
  1624. iconImage.stretch = _image__WEBPACK_IMPORTED_MODULE_4__["Image"].STRETCH_FILL;
  1625. iconImage.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  1626. result.addControl(iconImage);
  1627. // Store
  1628. result._image = iconImage;
  1629. return result;
  1630. };
  1631. /**
  1632. * Creates a new button made with a text
  1633. * @param name defines the name of the button
  1634. * @param text defines the text of the button
  1635. * @returns a new Button
  1636. */
  1637. Button.CreateSimpleButton = function (name, text) {
  1638. var result = new Button(name);
  1639. // Adding text
  1640. var textBlock = new _textBlock__WEBPACK_IMPORTED_MODULE_3__["TextBlock"](name + "_button", text);
  1641. textBlock.textWrapping = true;
  1642. textBlock.textHorizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].HORIZONTAL_ALIGNMENT_CENTER;
  1643. result.addControl(textBlock);
  1644. // Store
  1645. result._textBlock = textBlock;
  1646. return result;
  1647. };
  1648. /**
  1649. * Creates a new button made with an image and a centered text
  1650. * @param name defines the name of the button
  1651. * @param text defines the text of the button
  1652. * @param imageUrl defines the url of the image
  1653. * @returns a new Button
  1654. */
  1655. Button.CreateImageWithCenterTextButton = function (name, text, imageUrl) {
  1656. var result = new Button(name);
  1657. // Adding image
  1658. var iconImage = new _image__WEBPACK_IMPORTED_MODULE_4__["Image"](name + "_icon", imageUrl);
  1659. iconImage.stretch = _image__WEBPACK_IMPORTED_MODULE_4__["Image"].STRETCH_FILL;
  1660. result.addControl(iconImage);
  1661. // Adding text
  1662. var textBlock = new _textBlock__WEBPACK_IMPORTED_MODULE_3__["TextBlock"](name + "_button", text);
  1663. textBlock.textWrapping = true;
  1664. textBlock.textHorizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].HORIZONTAL_ALIGNMENT_CENTER;
  1665. result.addControl(textBlock);
  1666. // Store
  1667. result._image = iconImage;
  1668. result._textBlock = textBlock;
  1669. return result;
  1670. };
  1671. return Button;
  1672. }(_rectangle__WEBPACK_IMPORTED_MODULE_1__["Rectangle"]));
  1673. babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_5__["_TypeStore"].RegisteredTypes["BABYLON.GUI.Button"] = Button;
  1674. /***/ }),
  1675. /***/ "./2D/controls/checkbox.ts":
  1676. /*!*********************************!*\
  1677. !*** ./2D/controls/checkbox.ts ***!
  1678. \*********************************/
  1679. /*! exports provided: Checkbox */
  1680. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  1681. "use strict";
  1682. __webpack_require__.r(__webpack_exports__);
  1683. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Checkbox", function() { return Checkbox; });
  1684. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  1685. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math.vector");
  1686. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
  1687. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  1688. /* harmony import */ var _stackPanel__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./stackPanel */ "./2D/controls/stackPanel.ts");
  1689. /* harmony import */ var _textBlock__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./textBlock */ "./2D/controls/textBlock.ts");
  1690. /**
  1691. * Class used to represent a 2D checkbox
  1692. */
  1693. var Checkbox = /** @class */ (function (_super) {
  1694. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(Checkbox, _super);
  1695. /**
  1696. * Creates a new CheckBox
  1697. * @param name defines the control name
  1698. */
  1699. function Checkbox(name) {
  1700. var _this = _super.call(this, name) || this;
  1701. _this.name = name;
  1702. _this._isChecked = false;
  1703. _this._background = "black";
  1704. _this._checkSizeRatio = 0.8;
  1705. _this._thickness = 1;
  1706. /**
  1707. * Observable raised when isChecked property changes
  1708. */
  1709. _this.onIsCheckedChangedObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  1710. _this.isPointerBlocker = true;
  1711. return _this;
  1712. }
  1713. Object.defineProperty(Checkbox.prototype, "thickness", {
  1714. /** Gets or sets border thickness */
  1715. get: function () {
  1716. return this._thickness;
  1717. },
  1718. set: function (value) {
  1719. if (this._thickness === value) {
  1720. return;
  1721. }
  1722. this._thickness = value;
  1723. this._markAsDirty();
  1724. },
  1725. enumerable: false,
  1726. configurable: true
  1727. });
  1728. Object.defineProperty(Checkbox.prototype, "checkSizeRatio", {
  1729. /** Gets or sets a value indicating the ratio between overall size and check size */
  1730. get: function () {
  1731. return this._checkSizeRatio;
  1732. },
  1733. set: function (value) {
  1734. value = Math.max(Math.min(1, value), 0);
  1735. if (this._checkSizeRatio === value) {
  1736. return;
  1737. }
  1738. this._checkSizeRatio = value;
  1739. this._markAsDirty();
  1740. },
  1741. enumerable: false,
  1742. configurable: true
  1743. });
  1744. Object.defineProperty(Checkbox.prototype, "background", {
  1745. /** Gets or sets background color */
  1746. get: function () {
  1747. return this._background;
  1748. },
  1749. set: function (value) {
  1750. if (this._background === value) {
  1751. return;
  1752. }
  1753. this._background = value;
  1754. this._markAsDirty();
  1755. },
  1756. enumerable: false,
  1757. configurable: true
  1758. });
  1759. Object.defineProperty(Checkbox.prototype, "isChecked", {
  1760. /** Gets or sets a boolean indicating if the checkbox is checked or not */
  1761. get: function () {
  1762. return this._isChecked;
  1763. },
  1764. set: function (value) {
  1765. if (this._isChecked === value) {
  1766. return;
  1767. }
  1768. this._isChecked = value;
  1769. this._markAsDirty();
  1770. this.onIsCheckedChangedObservable.notifyObservers(value);
  1771. },
  1772. enumerable: false,
  1773. configurable: true
  1774. });
  1775. Checkbox.prototype._getTypeName = function () {
  1776. return "Checkbox";
  1777. };
  1778. /** @hidden */
  1779. Checkbox.prototype._draw = function (context, invalidatedRectangle) {
  1780. context.save();
  1781. this._applyStates(context);
  1782. var actualWidth = this._currentMeasure.width - this._thickness;
  1783. var actualHeight = this._currentMeasure.height - this._thickness;
  1784. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  1785. context.shadowColor = this.shadowColor;
  1786. context.shadowBlur = this.shadowBlur;
  1787. context.shadowOffsetX = this.shadowOffsetX;
  1788. context.shadowOffsetY = this.shadowOffsetY;
  1789. }
  1790. context.fillStyle = this._isEnabled ? this._background : this._disabledColor;
  1791. context.fillRect(this._currentMeasure.left + this._thickness / 2, this._currentMeasure.top + this._thickness / 2, actualWidth, actualHeight);
  1792. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  1793. context.shadowBlur = 0;
  1794. context.shadowOffsetX = 0;
  1795. context.shadowOffsetY = 0;
  1796. }
  1797. if (this._isChecked) {
  1798. context.fillStyle = this._isEnabled ? this.color : this._disabledColorItem;
  1799. var offsetWidth = actualWidth * this._checkSizeRatio;
  1800. var offseHeight = actualHeight * this._checkSizeRatio;
  1801. context.fillRect(this._currentMeasure.left + this._thickness / 2 + (actualWidth - offsetWidth) / 2, this._currentMeasure.top + this._thickness / 2 + (actualHeight - offseHeight) / 2, offsetWidth, offseHeight);
  1802. }
  1803. context.strokeStyle = this.color;
  1804. context.lineWidth = this._thickness;
  1805. context.strokeRect(this._currentMeasure.left + this._thickness / 2, this._currentMeasure.top + this._thickness / 2, actualWidth, actualHeight);
  1806. context.restore();
  1807. };
  1808. // Events
  1809. /** @hidden */
  1810. Checkbox.prototype._onPointerDown = function (target, coordinates, pointerId, buttonIndex) {
  1811. if (!_super.prototype._onPointerDown.call(this, target, coordinates, pointerId, buttonIndex)) {
  1812. return false;
  1813. }
  1814. this.isChecked = !this.isChecked;
  1815. return true;
  1816. };
  1817. /**
  1818. * Utility function to easily create a checkbox with a header
  1819. * @param title defines the label to use for the header
  1820. * @param onValueChanged defines the callback to call when value changes
  1821. * @returns a StackPanel containing the checkbox and a textBlock
  1822. */
  1823. Checkbox.AddCheckBoxWithHeader = function (title, onValueChanged) {
  1824. var panel = new _stackPanel__WEBPACK_IMPORTED_MODULE_3__["StackPanel"]();
  1825. panel.isVertical = false;
  1826. panel.height = "30px";
  1827. var checkbox = new Checkbox();
  1828. checkbox.width = "20px";
  1829. checkbox.height = "20px";
  1830. checkbox.isChecked = true;
  1831. checkbox.color = "green";
  1832. checkbox.onIsCheckedChangedObservable.add(onValueChanged);
  1833. panel.addControl(checkbox);
  1834. var header = new _textBlock__WEBPACK_IMPORTED_MODULE_4__["TextBlock"]();
  1835. header.text = title;
  1836. header.width = "180px";
  1837. header.paddingLeft = "5px";
  1838. header.textHorizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  1839. header.color = "white";
  1840. panel.addControl(header);
  1841. return panel;
  1842. };
  1843. return Checkbox;
  1844. }(_control__WEBPACK_IMPORTED_MODULE_2__["Control"]));
  1845. babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredTypes["BABYLON.GUI.Checkbox"] = Checkbox;
  1846. /***/ }),
  1847. /***/ "./2D/controls/colorpicker.ts":
  1848. /*!************************************!*\
  1849. !*** ./2D/controls/colorpicker.ts ***!
  1850. \************************************/
  1851. /*! exports provided: ColorPicker */
  1852. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  1853. "use strict";
  1854. __webpack_require__.r(__webpack_exports__);
  1855. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ColorPicker", function() { return ColorPicker; });
  1856. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  1857. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math.vector");
  1858. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
  1859. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  1860. /* harmony import */ var _inputText__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./inputText */ "./2D/controls/inputText.ts");
  1861. /* harmony import */ var _rectangle__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./rectangle */ "./2D/controls/rectangle.ts");
  1862. /* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./button */ "./2D/controls/button.ts");
  1863. /* harmony import */ var _grid__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./grid */ "./2D/controls/grid.ts");
  1864. /* harmony import */ var _controls_textBlock__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../controls/textBlock */ "./2D/controls/textBlock.ts");
  1865. /** Class used to create color pickers */
  1866. var ColorPicker = /** @class */ (function (_super) {
  1867. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(ColorPicker, _super);
  1868. /**
  1869. * Creates a new ColorPicker
  1870. * @param name defines the control name
  1871. */
  1872. function ColorPicker(name) {
  1873. var _this = _super.call(this, name) || this;
  1874. _this.name = name;
  1875. _this._value = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].Red();
  1876. _this._tmpColor = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"]();
  1877. _this._pointerStartedOnSquare = false;
  1878. _this._pointerStartedOnWheel = false;
  1879. _this._squareLeft = 0;
  1880. _this._squareTop = 0;
  1881. _this._squareSize = 0;
  1882. _this._h = 360;
  1883. _this._s = 1;
  1884. _this._v = 1;
  1885. _this._lastPointerDownID = -1;
  1886. /**
  1887. * Observable raised when the value changes
  1888. */
  1889. _this.onValueChangedObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  1890. // Events
  1891. _this._pointerIsDown = false;
  1892. _this.value = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"](.88, .1, .1);
  1893. _this.size = "200px";
  1894. _this.isPointerBlocker = true;
  1895. return _this;
  1896. }
  1897. Object.defineProperty(ColorPicker.prototype, "value", {
  1898. /** Gets or sets the color of the color picker */
  1899. get: function () {
  1900. return this._value;
  1901. },
  1902. set: function (value) {
  1903. if (this._value.equals(value)) {
  1904. return;
  1905. }
  1906. this._value.copyFrom(value);
  1907. this._value.toHSVToRef(this._tmpColor);
  1908. this._h = this._tmpColor.r;
  1909. this._s = Math.max(this._tmpColor.g, 0.00001);
  1910. this._v = Math.max(this._tmpColor.b, 0.00001);
  1911. this._markAsDirty();
  1912. if (this._value.r <= ColorPicker._Epsilon) {
  1913. this._value.r = 0;
  1914. }
  1915. if (this._value.g <= ColorPicker._Epsilon) {
  1916. this._value.g = 0;
  1917. }
  1918. if (this._value.b <= ColorPicker._Epsilon) {
  1919. this._value.b = 0;
  1920. }
  1921. if (this._value.r >= 1.0 - ColorPicker._Epsilon) {
  1922. this._value.r = 1.0;
  1923. }
  1924. if (this._value.g >= 1.0 - ColorPicker._Epsilon) {
  1925. this._value.g = 1.0;
  1926. }
  1927. if (this._value.b >= 1.0 - ColorPicker._Epsilon) {
  1928. this._value.b = 1.0;
  1929. }
  1930. this.onValueChangedObservable.notifyObservers(this._value);
  1931. },
  1932. enumerable: false,
  1933. configurable: true
  1934. });
  1935. Object.defineProperty(ColorPicker.prototype, "width", {
  1936. /**
  1937. * Gets or sets control width
  1938. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  1939. */
  1940. get: function () {
  1941. return this._width.toString(this._host);
  1942. },
  1943. set: function (value) {
  1944. if (this._width.toString(this._host) === value) {
  1945. return;
  1946. }
  1947. if (this._width.fromString(value)) {
  1948. this._height.fromString(value);
  1949. this._markAsDirty();
  1950. }
  1951. },
  1952. enumerable: false,
  1953. configurable: true
  1954. });
  1955. Object.defineProperty(ColorPicker.prototype, "height", {
  1956. /**
  1957. * Gets or sets control height
  1958. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  1959. */
  1960. get: function () {
  1961. return this._height.toString(this._host);
  1962. },
  1963. /** Gets or sets control height */
  1964. set: function (value) {
  1965. if (this._height.toString(this._host) === value) {
  1966. return;
  1967. }
  1968. if (this._height.fromString(value)) {
  1969. this._width.fromString(value);
  1970. this._markAsDirty();
  1971. }
  1972. },
  1973. enumerable: false,
  1974. configurable: true
  1975. });
  1976. Object.defineProperty(ColorPicker.prototype, "size", {
  1977. /** Gets or sets control size */
  1978. get: function () {
  1979. return this.width;
  1980. },
  1981. set: function (value) {
  1982. this.width = value;
  1983. },
  1984. enumerable: false,
  1985. configurable: true
  1986. });
  1987. ColorPicker.prototype._getTypeName = function () {
  1988. return "ColorPicker";
  1989. };
  1990. /** @hidden */
  1991. ColorPicker.prototype._preMeasure = function (parentMeasure, context) {
  1992. if (parentMeasure.width < parentMeasure.height) {
  1993. this._currentMeasure.height = parentMeasure.width;
  1994. }
  1995. else {
  1996. this._currentMeasure.width = parentMeasure.height;
  1997. }
  1998. };
  1999. ColorPicker.prototype._updateSquareProps = function () {
  2000. var radius = Math.min(this._currentMeasure.width, this._currentMeasure.height) * .5;
  2001. var wheelThickness = radius * .2;
  2002. var innerDiameter = (radius - wheelThickness) * 2;
  2003. var squareSize = innerDiameter / (Math.sqrt(2));
  2004. var offset = radius - squareSize * .5;
  2005. this._squareLeft = this._currentMeasure.left + offset;
  2006. this._squareTop = this._currentMeasure.top + offset;
  2007. this._squareSize = squareSize;
  2008. };
  2009. ColorPicker.prototype._drawGradientSquare = function (hueValue, left, top, width, height, context) {
  2010. var lgh = context.createLinearGradient(left, top, width + left, top);
  2011. lgh.addColorStop(0, '#fff');
  2012. lgh.addColorStop(1, 'hsl(' + hueValue + ', 100%, 50%)');
  2013. context.fillStyle = lgh;
  2014. context.fillRect(left, top, width, height);
  2015. var lgv = context.createLinearGradient(left, top, left, height + top);
  2016. lgv.addColorStop(0, 'rgba(0,0,0,0)');
  2017. lgv.addColorStop(1, '#000');
  2018. context.fillStyle = lgv;
  2019. context.fillRect(left, top, width, height);
  2020. };
  2021. ColorPicker.prototype._drawCircle = function (centerX, centerY, radius, context) {
  2022. context.beginPath();
  2023. context.arc(centerX, centerY, radius + 1, 0, 2 * Math.PI, false);
  2024. context.lineWidth = 3;
  2025. context.strokeStyle = '#333333';
  2026. context.stroke();
  2027. context.beginPath();
  2028. context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
  2029. context.lineWidth = 3;
  2030. context.strokeStyle = '#ffffff';
  2031. context.stroke();
  2032. };
  2033. ColorPicker.prototype._createColorWheelCanvas = function (radius, thickness) {
  2034. var canvas = document.createElement("canvas");
  2035. canvas.width = radius * 2;
  2036. canvas.height = radius * 2;
  2037. var context = canvas.getContext("2d");
  2038. var image = context.getImageData(0, 0, radius * 2, radius * 2);
  2039. var data = image.data;
  2040. var color = this._tmpColor;
  2041. var maxDistSq = radius * radius;
  2042. var innerRadius = radius - thickness;
  2043. var minDistSq = innerRadius * innerRadius;
  2044. for (var x = -radius; x < radius; x++) {
  2045. for (var y = -radius; y < radius; y++) {
  2046. var distSq = x * x + y * y;
  2047. if (distSq > maxDistSq || distSq < minDistSq) {
  2048. continue;
  2049. }
  2050. var dist = Math.sqrt(distSq);
  2051. var ang = Math.atan2(y, x);
  2052. babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].HSVtoRGBToRef(ang * 180 / Math.PI + 180, dist / radius, 1, color);
  2053. var index = ((x + radius) + ((y + radius) * 2 * radius)) * 4;
  2054. data[index] = color.r * 255;
  2055. data[index + 1] = color.g * 255;
  2056. data[index + 2] = color.b * 255;
  2057. var alphaRatio = (dist - innerRadius) / (radius - innerRadius);
  2058. //apply less alpha to bigger color pickers
  2059. var alphaAmount = .2;
  2060. var maxAlpha = .2;
  2061. var minAlpha = .04;
  2062. var lowerRadius = 50;
  2063. var upperRadius = 150;
  2064. if (radius < lowerRadius) {
  2065. alphaAmount = maxAlpha;
  2066. }
  2067. else if (radius > upperRadius) {
  2068. alphaAmount = minAlpha;
  2069. }
  2070. else {
  2071. alphaAmount = (minAlpha - maxAlpha) * (radius - lowerRadius) / (upperRadius - lowerRadius) + maxAlpha;
  2072. }
  2073. var alphaRatio = (dist - innerRadius) / (radius - innerRadius);
  2074. if (alphaRatio < alphaAmount) {
  2075. data[index + 3] = 255 * (alphaRatio / alphaAmount);
  2076. }
  2077. else if (alphaRatio > 1 - alphaAmount) {
  2078. data[index + 3] = 255 * (1.0 - ((alphaRatio - (1 - alphaAmount)) / alphaAmount));
  2079. }
  2080. else {
  2081. data[index + 3] = 255;
  2082. }
  2083. }
  2084. }
  2085. context.putImageData(image, 0, 0);
  2086. return canvas;
  2087. };
  2088. /** @hidden */
  2089. ColorPicker.prototype._draw = function (context) {
  2090. context.save();
  2091. this._applyStates(context);
  2092. var radius = Math.min(this._currentMeasure.width, this._currentMeasure.height) * .5;
  2093. var wheelThickness = radius * .2;
  2094. var left = this._currentMeasure.left;
  2095. var top = this._currentMeasure.top;
  2096. if (!this._colorWheelCanvas || this._colorWheelCanvas.width != radius * 2) {
  2097. this._colorWheelCanvas = this._createColorWheelCanvas(radius, wheelThickness);
  2098. }
  2099. this._updateSquareProps();
  2100. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  2101. context.shadowColor = this.shadowColor;
  2102. context.shadowBlur = this.shadowBlur;
  2103. context.shadowOffsetX = this.shadowOffsetX;
  2104. context.shadowOffsetY = this.shadowOffsetY;
  2105. context.fillRect(this._squareLeft, this._squareTop, this._squareSize, this._squareSize);
  2106. }
  2107. context.drawImage(this._colorWheelCanvas, left, top);
  2108. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  2109. context.shadowBlur = 0;
  2110. context.shadowOffsetX = 0;
  2111. context.shadowOffsetY = 0;
  2112. }
  2113. this._drawGradientSquare(this._h, this._squareLeft, this._squareTop, this._squareSize, this._squareSize, context);
  2114. var cx = this._squareLeft + this._squareSize * this._s;
  2115. var cy = this._squareTop + this._squareSize * (1 - this._v);
  2116. this._drawCircle(cx, cy, radius * .04, context);
  2117. var dist = radius - wheelThickness * .5;
  2118. cx = left + radius + Math.cos((this._h - 180) * Math.PI / 180) * dist;
  2119. cy = top + radius + Math.sin((this._h - 180) * Math.PI / 180) * dist;
  2120. this._drawCircle(cx, cy, wheelThickness * .35, context);
  2121. context.restore();
  2122. };
  2123. ColorPicker.prototype._updateValueFromPointer = function (x, y) {
  2124. if (this._pointerStartedOnWheel) {
  2125. var radius = Math.min(this._currentMeasure.width, this._currentMeasure.height) * .5;
  2126. var centerX = radius + this._currentMeasure.left;
  2127. var centerY = radius + this._currentMeasure.top;
  2128. this._h = Math.atan2(y - centerY, x - centerX) * 180 / Math.PI + 180;
  2129. }
  2130. else if (this._pointerStartedOnSquare) {
  2131. this._updateSquareProps();
  2132. this._s = (x - this._squareLeft) / this._squareSize;
  2133. this._v = 1 - (y - this._squareTop) / this._squareSize;
  2134. this._s = Math.min(this._s, 1);
  2135. this._s = Math.max(this._s, ColorPicker._Epsilon);
  2136. this._v = Math.min(this._v, 1);
  2137. this._v = Math.max(this._v, ColorPicker._Epsilon);
  2138. }
  2139. babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].HSVtoRGBToRef(this._h, this._s, this._v, this._tmpColor);
  2140. this.value = this._tmpColor;
  2141. };
  2142. ColorPicker.prototype._isPointOnSquare = function (x, y) {
  2143. this._updateSquareProps();
  2144. var left = this._squareLeft;
  2145. var top = this._squareTop;
  2146. var size = this._squareSize;
  2147. if (x >= left && x <= left + size &&
  2148. y >= top && y <= top + size) {
  2149. return true;
  2150. }
  2151. return false;
  2152. };
  2153. ColorPicker.prototype._isPointOnWheel = function (x, y) {
  2154. var radius = Math.min(this._currentMeasure.width, this._currentMeasure.height) * .5;
  2155. var centerX = radius + this._currentMeasure.left;
  2156. var centerY = radius + this._currentMeasure.top;
  2157. var wheelThickness = radius * .2;
  2158. var innerRadius = radius - wheelThickness;
  2159. var radiusSq = radius * radius;
  2160. var innerRadiusSq = innerRadius * innerRadius;
  2161. var dx = x - centerX;
  2162. var dy = y - centerY;
  2163. var distSq = dx * dx + dy * dy;
  2164. if (distSq <= radiusSq && distSq >= innerRadiusSq) {
  2165. return true;
  2166. }
  2167. return false;
  2168. };
  2169. ColorPicker.prototype._onPointerDown = function (target, coordinates, pointerId, buttonIndex) {
  2170. if (!_super.prototype._onPointerDown.call(this, target, coordinates, pointerId, buttonIndex)) {
  2171. return false;
  2172. }
  2173. this._pointerIsDown = true;
  2174. this._pointerStartedOnSquare = false;
  2175. this._pointerStartedOnWheel = false;
  2176. // Invert transform
  2177. this._invertTransformMatrix.transformCoordinates(coordinates.x, coordinates.y, this._transformedPosition);
  2178. var x = this._transformedPosition.x;
  2179. var y = this._transformedPosition.y;
  2180. if (this._isPointOnSquare(x, y)) {
  2181. this._pointerStartedOnSquare = true;
  2182. }
  2183. else if (this._isPointOnWheel(x, y)) {
  2184. this._pointerStartedOnWheel = true;
  2185. }
  2186. this._updateValueFromPointer(x, y);
  2187. this._host._capturingControl[pointerId] = this;
  2188. this._lastPointerDownID = pointerId;
  2189. return true;
  2190. };
  2191. ColorPicker.prototype._onPointerMove = function (target, coordinates, pointerId) {
  2192. // Only listen to pointer move events coming from the last pointer to click on the element (To support dual vr controller interaction)
  2193. if (pointerId != this._lastPointerDownID) {
  2194. return;
  2195. }
  2196. // Invert transform
  2197. this._invertTransformMatrix.transformCoordinates(coordinates.x, coordinates.y, this._transformedPosition);
  2198. var x = this._transformedPosition.x;
  2199. var y = this._transformedPosition.y;
  2200. if (this._pointerIsDown) {
  2201. this._updateValueFromPointer(x, y);
  2202. }
  2203. _super.prototype._onPointerMove.call(this, target, coordinates, pointerId);
  2204. };
  2205. ColorPicker.prototype._onPointerUp = function (target, coordinates, pointerId, buttonIndex, notifyClick) {
  2206. this._pointerIsDown = false;
  2207. delete this._host._capturingControl[pointerId];
  2208. _super.prototype._onPointerUp.call(this, target, coordinates, pointerId, buttonIndex, notifyClick);
  2209. };
  2210. ColorPicker.prototype._onCanvasBlur = function () {
  2211. this._forcePointerUp();
  2212. _super.prototype._onCanvasBlur.call(this);
  2213. };
  2214. /**
  2215. * This function expands the color picker by creating a color picker dialog with manual
  2216. * color value input and the ability to save colors into an array to be used later in
  2217. * subsequent launches of the dialogue.
  2218. * @param advancedTexture defines the AdvancedDynamicTexture the dialog is assigned to
  2219. * @param options defines size for dialog and options for saved colors. Also accepts last color picked as hex string and saved colors array as hex strings.
  2220. * @returns picked color as a hex string and the saved colors array as hex strings.
  2221. */
  2222. ColorPicker.ShowPickerDialogAsync = function (advancedTexture, options) {
  2223. return new Promise(function (resolve, reject) {
  2224. // Default options
  2225. options.pickerWidth = options.pickerWidth || "640px";
  2226. options.pickerHeight = options.pickerHeight || "400px";
  2227. options.headerHeight = options.headerHeight || "35px";
  2228. options.lastColor = options.lastColor || "#000000";
  2229. options.swatchLimit = options.swatchLimit || 20;
  2230. options.numSwatchesPerLine = options.numSwatchesPerLine || 10;
  2231. // Window size settings
  2232. var drawerMaxRows = options.swatchLimit / options.numSwatchesPerLine;
  2233. var rawSwatchSize = parseFloat(options.pickerWidth) / options.numSwatchesPerLine;
  2234. var gutterSize = Math.floor(rawSwatchSize * 0.25);
  2235. var colGutters = gutterSize * (options.numSwatchesPerLine + 1);
  2236. var swatchSize = Math.floor((parseFloat(options.pickerWidth) - colGutters) / options.numSwatchesPerLine);
  2237. var drawerMaxSize = (swatchSize * drawerMaxRows) + (gutterSize * (drawerMaxRows + 1));
  2238. var containerSize = (parseInt(options.pickerHeight) + drawerMaxSize + Math.floor(swatchSize * 0.25)).toString() + "px";
  2239. // Button Colors
  2240. var buttonColor = "#c0c0c0";
  2241. var buttonBackgroundColor = "#535353";
  2242. var buttonBackgroundHoverColor = "#414141";
  2243. var buttonBackgroundClickColor = "515151";
  2244. var buttonDisabledColor = "#555555";
  2245. var buttonDisabledBackgroundColor = "#454545";
  2246. var currentSwatchesOutlineColor = "#404040";
  2247. var luminanceLimitColor = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].FromHexString("#dddddd");
  2248. var luminanceLimit = luminanceLimitColor.r + luminanceLimitColor.g + luminanceLimitColor.b;
  2249. var iconColorDark = "#aaaaaa";
  2250. var iconColorLight = "#ffffff";
  2251. var closeIconColor;
  2252. // Button settings
  2253. var buttonFontSize;
  2254. var butEdit;
  2255. var buttonWidth;
  2256. var buttonHeight;
  2257. // Input Text Colors
  2258. var inputFieldLabels = ["R", "G", "B"];
  2259. var inputTextBackgroundColor = "#454545";
  2260. var inputTextColor = "#f0f0f0";
  2261. // This is the current color as set by either the picker or by entering a value
  2262. var currentColor;
  2263. // This int is used for naming swatches and serves as the index for calling them from the list
  2264. var swatchNumber;
  2265. // Menu Panel options. We need to know if the swatchDrawer exists so we can create it if needed.
  2266. var swatchDrawer;
  2267. var editSwatchMode = false;
  2268. // Color InputText fields that will be updated upon value change
  2269. var picker;
  2270. var rValInt;
  2271. var gValInt;
  2272. var bValInt;
  2273. var rValDec;
  2274. var gValDec;
  2275. var bValDec;
  2276. var hexVal;
  2277. var newSwatch;
  2278. var lastVal;
  2279. var activeField;
  2280. /**
  2281. * Will update all values for InputText and ColorPicker controls based on the BABYLON.Color3 passed to this function.
  2282. * Each InputText control and the ColorPicker control will be tested to see if they are the activeField and if they
  2283. * are will receive no update. This is to prevent the input from the user being overwritten.
  2284. */
  2285. function updateValues(value, inputField) {
  2286. activeField = inputField;
  2287. var pickedColor = value.toHexString();
  2288. newSwatch.background = pickedColor;
  2289. if (rValInt.name != activeField) {
  2290. rValInt.text = Math.floor(value.r * 255).toString();
  2291. }
  2292. if (gValInt.name != activeField) {
  2293. gValInt.text = Math.floor(value.g * 255).toString();
  2294. }
  2295. if (bValInt.name != activeField) {
  2296. bValInt.text = Math.floor(value.b * 255).toString();
  2297. }
  2298. if (rValDec.name != activeField) {
  2299. rValDec.text = value.r.toString();
  2300. }
  2301. if (gValDec.name != activeField) {
  2302. gValDec.text = value.g.toString();
  2303. }
  2304. if (bValDec.name != activeField) {
  2305. bValDec.text = value.b.toString();
  2306. }
  2307. if (hexVal.name != activeField) {
  2308. var minusPound = pickedColor.split("#");
  2309. hexVal.text = minusPound[1];
  2310. }
  2311. if (picker.name != activeField) {
  2312. picker.value = value;
  2313. }
  2314. }
  2315. // When the user enters an integer for R, G, or B we check to make sure it is a valid number and replace if not.
  2316. function updateInt(field, channel) {
  2317. var newValue = field.text;
  2318. var checkVal = /[^0-9]/g.test(newValue);
  2319. if (checkVal) {
  2320. field.text = lastVal;
  2321. return;
  2322. }
  2323. else {
  2324. if (newValue != "") {
  2325. if (Math.floor(parseInt(newValue)) < 0) {
  2326. newValue = "0";
  2327. }
  2328. else if (Math.floor(parseInt(newValue)) > 255) {
  2329. newValue = "255";
  2330. }
  2331. else if (isNaN(parseInt(newValue))) {
  2332. newValue = "0";
  2333. }
  2334. }
  2335. if (activeField == field.name) {
  2336. lastVal = newValue;
  2337. }
  2338. }
  2339. if (newValue != "") {
  2340. newValue = parseInt(newValue).toString();
  2341. field.text = newValue;
  2342. var newSwatchRGB = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].FromHexString(newSwatch.background);
  2343. if (activeField == field.name) {
  2344. if (channel == "r") {
  2345. updateValues(new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"]((parseInt(newValue)) / 255, newSwatchRGB.g, newSwatchRGB.b), field.name);
  2346. }
  2347. else if (channel == "g") {
  2348. updateValues(new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"](newSwatchRGB.r, (parseInt(newValue)) / 255, newSwatchRGB.b), field.name);
  2349. }
  2350. else {
  2351. updateValues(new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"](newSwatchRGB.r, newSwatchRGB.g, (parseInt(newValue)) / 255), field.name);
  2352. }
  2353. }
  2354. }
  2355. }
  2356. // When the user enters a float for R, G, or B we check to make sure it is a valid number and replace if not.
  2357. function updateFloat(field, channel) {
  2358. var newValue = field.text;
  2359. var checkVal = /[^0-9\.]/g.test(newValue);
  2360. if (checkVal) {
  2361. field.text = lastVal;
  2362. return;
  2363. }
  2364. else {
  2365. if (newValue != "" && newValue != "." && parseFloat(newValue) != 0) {
  2366. if (parseFloat(newValue) < 0.0) {
  2367. newValue = "0.0";
  2368. }
  2369. else if (parseFloat(newValue) > 1.0) {
  2370. newValue = "1.0";
  2371. }
  2372. else if (isNaN(parseFloat(newValue))) {
  2373. newValue = "0.0";
  2374. }
  2375. }
  2376. if (activeField == field.name) {
  2377. lastVal = newValue;
  2378. }
  2379. }
  2380. if (newValue != "" && newValue != "." && parseFloat(newValue) != 0) {
  2381. newValue = parseFloat(newValue).toString();
  2382. field.text = newValue;
  2383. }
  2384. else {
  2385. newValue = "0.0";
  2386. }
  2387. var newSwatchRGB = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].FromHexString(newSwatch.background);
  2388. if (activeField == field.name) {
  2389. if (channel == "r") {
  2390. updateValues(new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"](parseFloat(newValue), newSwatchRGB.g, newSwatchRGB.b), field.name);
  2391. }
  2392. else if (channel == "g") {
  2393. updateValues(new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"](newSwatchRGB.r, parseFloat(newValue), newSwatchRGB.b), field.name);
  2394. }
  2395. else {
  2396. updateValues(new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"](newSwatchRGB.r, newSwatchRGB.g, parseFloat(newValue)), field.name);
  2397. }
  2398. }
  2399. }
  2400. // Removes the current index from the savedColors array. Drawer can then be regenerated.
  2401. function deleteSwatch(index) {
  2402. if (options.savedColors) {
  2403. options.savedColors.splice(index, 1);
  2404. }
  2405. if (options.savedColors && options.savedColors.length == 0) {
  2406. setEditButtonVisibility(false);
  2407. editSwatchMode = false;
  2408. }
  2409. }
  2410. // Creates and styles an individual swatch when updateSwatches is called.
  2411. function createSwatch() {
  2412. if (options.savedColors && options.savedColors[swatchNumber]) {
  2413. if (editSwatchMode) {
  2414. var icon = "b";
  2415. }
  2416. else {
  2417. var icon = "";
  2418. }
  2419. var swatch = _button__WEBPACK_IMPORTED_MODULE_5__["Button"].CreateSimpleButton("Swatch_" + swatchNumber, icon);
  2420. swatch.fontFamily = "BabylonJSglyphs";
  2421. var swatchColor = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].FromHexString(options.savedColors[swatchNumber]);
  2422. var swatchLuminence = swatchColor.r + swatchColor.g + swatchColor.b;
  2423. // Set color of outline and textBlock based on luminance of the color swatch so feedback always visible
  2424. if (swatchLuminence > luminanceLimit) {
  2425. swatch.color = iconColorDark;
  2426. }
  2427. else {
  2428. swatch.color = iconColorLight;
  2429. }
  2430. swatch.fontSize = Math.floor(swatchSize * 0.7);
  2431. swatch.textBlock.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].VERTICAL_ALIGNMENT_CENTER;
  2432. swatch.height = swatch.width = (swatchSize).toString() + "px";
  2433. swatch.background = options.savedColors[swatchNumber];
  2434. swatch.thickness = 2;
  2435. var metadata_1 = swatchNumber;
  2436. swatch.pointerDownAnimation = function () {
  2437. swatch.thickness = 4;
  2438. };
  2439. swatch.pointerUpAnimation = function () {
  2440. swatch.thickness = 3;
  2441. };
  2442. swatch.pointerEnterAnimation = function () {
  2443. swatch.thickness = 3;
  2444. };
  2445. swatch.pointerOutAnimation = function () {
  2446. swatch.thickness = 2;
  2447. };
  2448. swatch.onPointerClickObservable.add(function () {
  2449. if (!editSwatchMode) {
  2450. if (options.savedColors) {
  2451. updateValues(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].FromHexString(options.savedColors[metadata_1]), swatch.name);
  2452. }
  2453. }
  2454. else {
  2455. deleteSwatch(metadata_1);
  2456. updateSwatches("", butSave);
  2457. }
  2458. });
  2459. return swatch;
  2460. }
  2461. else {
  2462. return null;
  2463. }
  2464. }
  2465. // Mode switch to render button text and close symbols on swatch controls
  2466. function editSwatches(mode) {
  2467. if (mode !== undefined) {
  2468. editSwatchMode = mode;
  2469. }
  2470. if (editSwatchMode) {
  2471. for (var i = 0; i < swatchDrawer.children.length; i++) {
  2472. var thisButton = swatchDrawer.children[i];
  2473. thisButton.textBlock.text = "b";
  2474. }
  2475. if (butEdit !== undefined) {
  2476. butEdit.textBlock.text = "Done";
  2477. }
  2478. }
  2479. else {
  2480. for (var i = 0; i < swatchDrawer.children.length; i++) {
  2481. var thisButton = swatchDrawer.children[i];
  2482. thisButton.textBlock.text = "";
  2483. }
  2484. if (butEdit !== undefined) {
  2485. butEdit.textBlock.text = "Edit";
  2486. }
  2487. }
  2488. }
  2489. /**
  2490. * When Save Color button is pressed this function will first create a swatch drawer if one is not already
  2491. * made. Then all controls are removed from the drawer and we step through the savedColors array and
  2492. * creates one swatch per color. It will also set the height of the drawer control based on how many
  2493. * saved colors there are and how many can be stored per row.
  2494. */
  2495. function updateSwatches(color, button) {
  2496. if (options.savedColors) {
  2497. if (color != "") {
  2498. options.savedColors.push(color);
  2499. }
  2500. swatchNumber = 0;
  2501. swatchDrawer.clearControls();
  2502. var rowCount = Math.ceil(options.savedColors.length / options.numSwatchesPerLine);
  2503. if (rowCount == 0) {
  2504. var gutterCount = 0;
  2505. }
  2506. else {
  2507. var gutterCount = rowCount + 1;
  2508. }
  2509. if (swatchDrawer.rowCount != rowCount + gutterCount) {
  2510. var currentRows = swatchDrawer.rowCount;
  2511. for (var i = 0; i < currentRows; i++) {
  2512. swatchDrawer.removeRowDefinition(0);
  2513. }
  2514. for (var i = 0; i < rowCount + gutterCount; i++) {
  2515. if (i % 2) {
  2516. swatchDrawer.addRowDefinition(swatchSize, true);
  2517. }
  2518. else {
  2519. swatchDrawer.addRowDefinition(gutterSize, true);
  2520. }
  2521. }
  2522. }
  2523. swatchDrawer.height = ((swatchSize * rowCount) + (gutterCount * gutterSize)).toString() + "px";
  2524. for (var y = 1, thisRow = 1; y < rowCount + gutterCount; y += 2, thisRow++) {
  2525. // Determine number of buttons to create per row based on the button limit per row and number of saved colors
  2526. if (options.savedColors.length > thisRow * options.numSwatchesPerLine) {
  2527. var totalButtonsThisRow = options.numSwatchesPerLine;
  2528. }
  2529. else {
  2530. var totalButtonsThisRow = options.savedColors.length - ((thisRow - 1) * options.numSwatchesPerLine);
  2531. }
  2532. var buttonIterations = (Math.min(Math.max(totalButtonsThisRow, 0), options.numSwatchesPerLine));
  2533. for (var x = 0, w = 1; x < buttonIterations; x++) {
  2534. if (x > options.numSwatchesPerLine) {
  2535. continue;
  2536. }
  2537. var swatch = createSwatch();
  2538. if (swatch != null) {
  2539. swatchDrawer.addControl(swatch, y, w);
  2540. w += 2;
  2541. swatchNumber++;
  2542. }
  2543. else {
  2544. continue;
  2545. }
  2546. }
  2547. }
  2548. if (options.savedColors.length >= options.swatchLimit) {
  2549. disableButton(button, true);
  2550. }
  2551. else {
  2552. disableButton(button, false);
  2553. }
  2554. }
  2555. }
  2556. // Shows or hides edit swatches button depending on if there are saved swatches
  2557. function setEditButtonVisibility(enableButton) {
  2558. if (enableButton) {
  2559. butEdit = _button__WEBPACK_IMPORTED_MODULE_5__["Button"].CreateSimpleButton("butEdit", "Edit");
  2560. butEdit.width = buttonWidth;
  2561. butEdit.height = buttonHeight;
  2562. butEdit.left = (Math.floor(parseInt(buttonWidth) * 0.1)).toString() + "px";
  2563. butEdit.top = (parseFloat(butEdit.left) * -1).toString() + "px";
  2564. butEdit.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].VERTICAL_ALIGNMENT_BOTTOM;
  2565. butEdit.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  2566. butEdit.thickness = 2;
  2567. butEdit.color = buttonColor;
  2568. butEdit.fontSize = buttonFontSize;
  2569. butEdit.background = buttonBackgroundColor;
  2570. butEdit.onPointerEnterObservable.add(function () {
  2571. butEdit.background = buttonBackgroundHoverColor;
  2572. });
  2573. butEdit.onPointerOutObservable.add(function () {
  2574. butEdit.background = buttonBackgroundColor;
  2575. });
  2576. butEdit.pointerDownAnimation = function () {
  2577. butEdit.background = buttonBackgroundClickColor;
  2578. };
  2579. butEdit.pointerUpAnimation = function () {
  2580. butEdit.background = buttonBackgroundHoverColor;
  2581. };
  2582. butEdit.onPointerClickObservable.add(function () {
  2583. if (editSwatchMode) {
  2584. editSwatchMode = false;
  2585. }
  2586. else {
  2587. editSwatchMode = true;
  2588. }
  2589. editSwatches();
  2590. });
  2591. pickerGrid.addControl(butEdit, 1, 0);
  2592. }
  2593. else {
  2594. pickerGrid.removeControl(butEdit);
  2595. }
  2596. }
  2597. // Called when the user hits the limit of saved colors in the drawer.
  2598. function disableButton(button, disabled) {
  2599. if (disabled) {
  2600. button.color = buttonDisabledColor;
  2601. button.background = buttonDisabledBackgroundColor;
  2602. }
  2603. else {
  2604. button.color = buttonColor;
  2605. button.background = buttonBackgroundColor;
  2606. }
  2607. }
  2608. // Passes last chosen color back to scene and kills dialog by removing from AdvancedDynamicTexture
  2609. function closePicker(color) {
  2610. if (options.savedColors && options.savedColors.length > 0) {
  2611. resolve({
  2612. savedColors: options.savedColors,
  2613. pickedColor: color
  2614. });
  2615. }
  2616. else {
  2617. resolve({
  2618. pickedColor: color
  2619. });
  2620. }
  2621. advancedTexture.removeControl(dialogContainer);
  2622. }
  2623. // Dialogue menu container which will contain both the main dialogue window and the swatch drawer which opens once a color is saved.
  2624. var dialogContainer = new _grid__WEBPACK_IMPORTED_MODULE_6__["Grid"]();
  2625. dialogContainer.name = "Dialog Container";
  2626. dialogContainer.width = options.pickerWidth;
  2627. if (options.savedColors) {
  2628. dialogContainer.height = containerSize;
  2629. var topRow = parseInt(options.pickerHeight) / parseInt(containerSize);
  2630. dialogContainer.addRowDefinition(topRow, false);
  2631. dialogContainer.addRowDefinition(1.0 - topRow, false);
  2632. }
  2633. else {
  2634. dialogContainer.height = options.pickerHeight;
  2635. dialogContainer.addRowDefinition(1.0, false);
  2636. }
  2637. advancedTexture.addControl(dialogContainer);
  2638. // Swatch drawer which contains all saved color buttons
  2639. if (options.savedColors) {
  2640. swatchDrawer = new _grid__WEBPACK_IMPORTED_MODULE_6__["Grid"]();
  2641. swatchDrawer.name = "Swatch Drawer";
  2642. swatchDrawer.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].VERTICAL_ALIGNMENT_TOP;
  2643. swatchDrawer.background = buttonBackgroundColor;
  2644. swatchDrawer.width = options.pickerWidth;
  2645. var initialRows = options.savedColors.length / options.numSwatchesPerLine;
  2646. if (initialRows == 0) {
  2647. var gutterCount = 0;
  2648. }
  2649. else {
  2650. var gutterCount = initialRows + 1;
  2651. }
  2652. swatchDrawer.height = ((swatchSize * initialRows) + (gutterCount * gutterSize)).toString() + "px";
  2653. swatchDrawer.top = Math.floor(swatchSize * 0.25).toString() + "px";
  2654. for (var i = 0; i < (Math.ceil(options.savedColors.length / options.numSwatchesPerLine) * 2) + 1; i++) {
  2655. if (i % 2 != 0) {
  2656. swatchDrawer.addRowDefinition(swatchSize, true);
  2657. }
  2658. else {
  2659. swatchDrawer.addRowDefinition(gutterSize, true);
  2660. }
  2661. }
  2662. for (var i = 0; i < options.numSwatchesPerLine * 2 + 1; i++) {
  2663. if (i % 2 != 0) {
  2664. swatchDrawer.addColumnDefinition(swatchSize, true);
  2665. }
  2666. else {
  2667. swatchDrawer.addColumnDefinition(gutterSize, true);
  2668. }
  2669. }
  2670. dialogContainer.addControl(swatchDrawer, 1, 0);
  2671. }
  2672. // Picker container
  2673. var pickerPanel = new _grid__WEBPACK_IMPORTED_MODULE_6__["Grid"]();
  2674. pickerPanel.name = "Picker Panel";
  2675. pickerPanel.height = options.pickerHeight;
  2676. var panelHead = parseInt(options.headerHeight) / parseInt(options.pickerHeight);
  2677. var pickerPanelRows = [panelHead, 1.0 - panelHead];
  2678. pickerPanel.addRowDefinition(pickerPanelRows[0], false);
  2679. pickerPanel.addRowDefinition(pickerPanelRows[1], false);
  2680. dialogContainer.addControl(pickerPanel, 0, 0);
  2681. // Picker container header
  2682. var header = new _rectangle__WEBPACK_IMPORTED_MODULE_4__["Rectangle"]();
  2683. header.name = "Dialogue Header Bar";
  2684. header.background = "#cccccc";
  2685. header.thickness = 0;
  2686. pickerPanel.addControl(header, 0, 0);
  2687. // Header close button
  2688. var closeButton = _button__WEBPACK_IMPORTED_MODULE_5__["Button"].CreateSimpleButton("closeButton", "a");
  2689. closeButton.fontFamily = "BabylonJSglyphs";
  2690. var headerColor3 = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].FromHexString(header.background);
  2691. closeIconColor = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"](1.0 - headerColor3.r, 1.0 - headerColor3.g, 1.0 - headerColor3.b);
  2692. closeButton.color = closeIconColor.toHexString();
  2693. closeButton.fontSize = Math.floor(parseInt(options.headerHeight) * 0.6);
  2694. closeButton.textBlock.textVerticalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].VERTICAL_ALIGNMENT_CENTER;
  2695. closeButton.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].HORIZONTAL_ALIGNMENT_RIGHT;
  2696. closeButton.height = closeButton.width = options.headerHeight;
  2697. closeButton.background = header.background;
  2698. closeButton.thickness = 0;
  2699. closeButton.pointerDownAnimation = function () {
  2700. };
  2701. closeButton.pointerUpAnimation = function () {
  2702. closeButton.background = header.background;
  2703. };
  2704. closeButton.pointerEnterAnimation = function () {
  2705. closeButton.color = header.background;
  2706. closeButton.background = "red";
  2707. };
  2708. closeButton.pointerOutAnimation = function () {
  2709. closeButton.color = closeIconColor.toHexString();
  2710. closeButton.background = header.background;
  2711. };
  2712. closeButton.onPointerClickObservable.add(function () {
  2713. closePicker(currentSwatch.background);
  2714. });
  2715. pickerPanel.addControl(closeButton, 0, 0);
  2716. // Dialog container body
  2717. var dialogBody = new _grid__WEBPACK_IMPORTED_MODULE_6__["Grid"]();
  2718. dialogBody.name = "Dialogue Body";
  2719. dialogBody.background = buttonBackgroundColor;
  2720. var dialogBodyCols = [0.4375, 0.5625];
  2721. dialogBody.addRowDefinition(1.0, false);
  2722. dialogBody.addColumnDefinition(dialogBodyCols[0], false);
  2723. dialogBody.addColumnDefinition(dialogBodyCols[1], false);
  2724. pickerPanel.addControl(dialogBody, 1, 0);
  2725. // Picker grid
  2726. var pickerGrid = new _grid__WEBPACK_IMPORTED_MODULE_6__["Grid"]();
  2727. pickerGrid.name = "Picker Grid";
  2728. pickerGrid.addRowDefinition(0.85, false);
  2729. pickerGrid.addRowDefinition(0.15, false);
  2730. dialogBody.addControl(pickerGrid, 0, 0);
  2731. // Picker control
  2732. picker = new ColorPicker();
  2733. picker.name = "GUI Color Picker";
  2734. if (options.pickerHeight < options.pickerWidth) {
  2735. picker.width = 0.89;
  2736. }
  2737. else {
  2738. picker.height = 0.89;
  2739. }
  2740. picker.value = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].FromHexString(options.lastColor);
  2741. picker.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].HORIZONTAL_ALIGNMENT_CENTER;
  2742. picker.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].VERTICAL_ALIGNMENT_CENTER;
  2743. picker.onPointerDownObservable.add(function () {
  2744. activeField = picker.name;
  2745. lastVal = "";
  2746. editSwatches(false);
  2747. });
  2748. picker.onValueChangedObservable.add(function (value) {
  2749. if (activeField == picker.name) {
  2750. updateValues(value, picker.name);
  2751. }
  2752. });
  2753. pickerGrid.addControl(picker, 0, 0);
  2754. // Picker body right quarant
  2755. var pickerBodyRight = new _grid__WEBPACK_IMPORTED_MODULE_6__["Grid"]();
  2756. pickerBodyRight.name = "Dialogue Right Half";
  2757. pickerBodyRight.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  2758. var pickerBodyRightRows = [0.514, 0.486];
  2759. pickerBodyRight.addRowDefinition(pickerBodyRightRows[0], false);
  2760. pickerBodyRight.addRowDefinition(pickerBodyRightRows[1], false);
  2761. dialogBody.addControl(pickerBodyRight, 1, 1);
  2762. // Picker container swatches and buttons
  2763. var pickerSwatchesButtons = new _grid__WEBPACK_IMPORTED_MODULE_6__["Grid"]();
  2764. pickerSwatchesButtons.name = "Swatches and Buttons";
  2765. var pickerButtonsCol = [0.417, 0.583];
  2766. pickerSwatchesButtons.addRowDefinition(1.0, false);
  2767. pickerSwatchesButtons.addColumnDefinition(pickerButtonsCol[0], false);
  2768. pickerSwatchesButtons.addColumnDefinition(pickerButtonsCol[1], false);
  2769. pickerBodyRight.addControl(pickerSwatchesButtons, 0, 0);
  2770. // Picker Swatches quadrant
  2771. var pickerSwatches = new _grid__WEBPACK_IMPORTED_MODULE_6__["Grid"]();
  2772. pickerSwatches.name = "New and Current Swatches";
  2773. var pickeSwatchesRows = [0.04, 0.16, 0.64, 0.16];
  2774. pickerSwatches.addRowDefinition(pickeSwatchesRows[0], false);
  2775. pickerSwatches.addRowDefinition(pickeSwatchesRows[1], false);
  2776. pickerSwatches.addRowDefinition(pickeSwatchesRows[2], false);
  2777. pickerSwatches.addRowDefinition(pickeSwatchesRows[3], false);
  2778. pickerSwatchesButtons.addControl(pickerSwatches, 0, 0);
  2779. // Active swatches
  2780. var activeSwatches = new _grid__WEBPACK_IMPORTED_MODULE_6__["Grid"]();
  2781. activeSwatches.name = "Active Swatches";
  2782. activeSwatches.width = 0.67;
  2783. activeSwatches.addRowDefinition(0.5, false);
  2784. activeSwatches.addRowDefinition(0.5, false);
  2785. pickerSwatches.addControl(activeSwatches, 2, 0);
  2786. var labelWidth = (Math.floor(parseInt(options.pickerWidth) * dialogBodyCols[1] * pickerButtonsCol[0] * 0.11));
  2787. var labelHeight = (Math.floor(parseInt(options.pickerHeight) * pickerPanelRows[1] * pickerBodyRightRows[0] * pickeSwatchesRows[1] * 0.5));
  2788. if (options.pickerWidth > options.pickerHeight) {
  2789. var labelTextSize = labelHeight;
  2790. }
  2791. else {
  2792. var labelTextSize = labelWidth;
  2793. }
  2794. // New color swatch and previous color button
  2795. var newText = new _controls_textBlock__WEBPACK_IMPORTED_MODULE_7__["TextBlock"]();
  2796. newText.text = "new";
  2797. newText.name = "New Color Label";
  2798. newText.color = buttonColor;
  2799. newText.fontSize = labelTextSize;
  2800. pickerSwatches.addControl(newText, 1, 0);
  2801. newSwatch = new _rectangle__WEBPACK_IMPORTED_MODULE_4__["Rectangle"]();
  2802. newSwatch.name = "New Color Swatch";
  2803. newSwatch.background = options.lastColor;
  2804. newSwatch.thickness = 0;
  2805. activeSwatches.addControl(newSwatch, 0, 0);
  2806. var currentSwatch = _button__WEBPACK_IMPORTED_MODULE_5__["Button"].CreateSimpleButton("currentSwatch", "");
  2807. currentSwatch.background = options.lastColor;
  2808. currentSwatch.thickness = 0;
  2809. currentSwatch.onPointerClickObservable.add(function () {
  2810. var revertColor = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].FromHexString(currentSwatch.background);
  2811. updateValues(revertColor, currentSwatch.name);
  2812. editSwatches(false);
  2813. });
  2814. currentSwatch.pointerDownAnimation = function () { };
  2815. currentSwatch.pointerUpAnimation = function () { };
  2816. currentSwatch.pointerEnterAnimation = function () { };
  2817. currentSwatch.pointerOutAnimation = function () { };
  2818. activeSwatches.addControl(currentSwatch, 1, 0);
  2819. var swatchOutline = new _rectangle__WEBPACK_IMPORTED_MODULE_4__["Rectangle"]();
  2820. swatchOutline.name = "Swatch Outline";
  2821. swatchOutline.width = 0.67;
  2822. swatchOutline.thickness = 2;
  2823. swatchOutline.color = currentSwatchesOutlineColor;
  2824. swatchOutline.isHitTestVisible = false;
  2825. pickerSwatches.addControl(swatchOutline, 2, 0);
  2826. var currentText = new _controls_textBlock__WEBPACK_IMPORTED_MODULE_7__["TextBlock"]();
  2827. currentText.name = "Current Color Label";
  2828. currentText.text = "current";
  2829. currentText.color = buttonColor;
  2830. currentText.fontSize = labelTextSize;
  2831. pickerSwatches.addControl(currentText, 3, 0);
  2832. // Buttons grid
  2833. var buttonGrid = new _grid__WEBPACK_IMPORTED_MODULE_6__["Grid"]();
  2834. buttonGrid.name = "Button Grid";
  2835. buttonGrid.height = 0.8;
  2836. var buttonGridRows = 1 / 3;
  2837. buttonGrid.addRowDefinition(buttonGridRows, false);
  2838. buttonGrid.addRowDefinition(buttonGridRows, false);
  2839. buttonGrid.addRowDefinition(buttonGridRows, false);
  2840. pickerSwatchesButtons.addControl(buttonGrid, 0, 1);
  2841. // Determine pixel width and height for all buttons from overall panel dimensions
  2842. buttonWidth = (Math.floor(parseInt(options.pickerWidth) * dialogBodyCols[1] * pickerButtonsCol[1] * 0.67)).toString() + "px";
  2843. buttonHeight = (Math.floor(parseInt(options.pickerHeight) * pickerPanelRows[1] * pickerBodyRightRows[0] * (parseFloat(buttonGrid.height.toString()) / 100) * buttonGridRows * 0.7)).toString() + "px";
  2844. // Determine button type size
  2845. if (parseFloat(buttonWidth) > parseFloat(buttonHeight)) {
  2846. buttonFontSize = Math.floor(parseFloat(buttonHeight) * 0.45);
  2847. }
  2848. else {
  2849. buttonFontSize = Math.floor(parseFloat(buttonWidth) * 0.11);
  2850. }
  2851. // Panel Buttons
  2852. var butOK = _button__WEBPACK_IMPORTED_MODULE_5__["Button"].CreateSimpleButton("butOK", "OK");
  2853. butOK.width = buttonWidth;
  2854. butOK.height = buttonHeight;
  2855. butOK.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].VERTICAL_ALIGNMENT_CENTER;
  2856. butOK.thickness = 2;
  2857. butOK.color = buttonColor;
  2858. butOK.fontSize = buttonFontSize;
  2859. butOK.background = buttonBackgroundColor;
  2860. butOK.onPointerEnterObservable.add(function () { butOK.background = buttonBackgroundHoverColor; });
  2861. butOK.onPointerOutObservable.add(function () { butOK.background = buttonBackgroundColor; });
  2862. butOK.pointerDownAnimation = function () {
  2863. butOK.background = buttonBackgroundClickColor;
  2864. };
  2865. butOK.pointerUpAnimation = function () {
  2866. butOK.background = buttonBackgroundHoverColor;
  2867. };
  2868. butOK.onPointerClickObservable.add(function () {
  2869. editSwatches(false);
  2870. closePicker(newSwatch.background);
  2871. });
  2872. buttonGrid.addControl(butOK, 0, 0);
  2873. var butCancel = _button__WEBPACK_IMPORTED_MODULE_5__["Button"].CreateSimpleButton("butCancel", "Cancel");
  2874. butCancel.width = buttonWidth;
  2875. butCancel.height = buttonHeight;
  2876. butCancel.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].VERTICAL_ALIGNMENT_CENTER;
  2877. butCancel.thickness = 2;
  2878. butCancel.color = buttonColor;
  2879. butCancel.fontSize = buttonFontSize;
  2880. butCancel.background = buttonBackgroundColor;
  2881. butCancel.onPointerEnterObservable.add(function () { butCancel.background = buttonBackgroundHoverColor; });
  2882. butCancel.onPointerOutObservable.add(function () { butCancel.background = buttonBackgroundColor; });
  2883. butCancel.pointerDownAnimation = function () {
  2884. butCancel.background = buttonBackgroundClickColor;
  2885. };
  2886. butCancel.pointerUpAnimation = function () {
  2887. butCancel.background = buttonBackgroundHoverColor;
  2888. };
  2889. butCancel.onPointerClickObservable.add(function () {
  2890. editSwatches(false);
  2891. closePicker(currentSwatch.background);
  2892. });
  2893. buttonGrid.addControl(butCancel, 1, 0);
  2894. if (options.savedColors) {
  2895. var butSave = _button__WEBPACK_IMPORTED_MODULE_5__["Button"].CreateSimpleButton("butSave", "Save");
  2896. butSave.width = buttonWidth;
  2897. butSave.height = buttonHeight;
  2898. butSave.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].VERTICAL_ALIGNMENT_CENTER;
  2899. butSave.thickness = 2;
  2900. butSave.fontSize = buttonFontSize;
  2901. if (options.savedColors.length < options.swatchLimit) {
  2902. butSave.color = buttonColor;
  2903. butSave.background = buttonBackgroundColor;
  2904. }
  2905. else {
  2906. disableButton(butSave, true);
  2907. }
  2908. butSave.onPointerEnterObservable.add(function () {
  2909. if (options.savedColors) {
  2910. if (options.savedColors.length < options.swatchLimit) {
  2911. butSave.background = buttonBackgroundHoverColor;
  2912. }
  2913. }
  2914. });
  2915. butSave.onPointerOutObservable.add(function () {
  2916. if (options.savedColors) {
  2917. if (options.savedColors.length < options.swatchLimit) {
  2918. butSave.background = buttonBackgroundColor;
  2919. }
  2920. }
  2921. });
  2922. butSave.pointerDownAnimation = function () {
  2923. if (options.savedColors) {
  2924. if (options.savedColors.length < options.swatchLimit) {
  2925. butSave.background = buttonBackgroundClickColor;
  2926. }
  2927. }
  2928. };
  2929. butSave.pointerUpAnimation = function () {
  2930. if (options.savedColors) {
  2931. if (options.savedColors.length < options.swatchLimit) {
  2932. butSave.background = buttonBackgroundHoverColor;
  2933. }
  2934. }
  2935. };
  2936. butSave.onPointerClickObservable.add(function () {
  2937. if (options.savedColors) {
  2938. if (options.savedColors.length == 0) {
  2939. setEditButtonVisibility(true);
  2940. }
  2941. if (options.savedColors.length < options.swatchLimit) {
  2942. updateSwatches(newSwatch.background, butSave);
  2943. }
  2944. editSwatches(false);
  2945. }
  2946. });
  2947. if (options.savedColors.length > 0) {
  2948. setEditButtonVisibility(true);
  2949. }
  2950. buttonGrid.addControl(butSave, 2, 0);
  2951. }
  2952. // Picker color values input
  2953. var pickerColorValues = new _grid__WEBPACK_IMPORTED_MODULE_6__["Grid"]();
  2954. pickerColorValues.name = "Dialog Lower Right";
  2955. pickerColorValues.addRowDefinition(0.02, false);
  2956. pickerColorValues.addRowDefinition(0.63, false);
  2957. pickerColorValues.addRowDefinition(0.21, false);
  2958. pickerColorValues.addRowDefinition(0.14, false);
  2959. pickerBodyRight.addControl(pickerColorValues, 1, 0);
  2960. // RGB values text boxes
  2961. currentColor = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].FromHexString(options.lastColor);
  2962. var rgbValuesQuadrant = new _grid__WEBPACK_IMPORTED_MODULE_6__["Grid"]();
  2963. rgbValuesQuadrant.name = "RGB Values";
  2964. rgbValuesQuadrant.width = 0.82;
  2965. rgbValuesQuadrant.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].VERTICAL_ALIGNMENT_CENTER;
  2966. rgbValuesQuadrant.addRowDefinition(1 / 3, false);
  2967. rgbValuesQuadrant.addRowDefinition(1 / 3, false);
  2968. rgbValuesQuadrant.addRowDefinition(1 / 3, false);
  2969. rgbValuesQuadrant.addColumnDefinition(0.1, false);
  2970. rgbValuesQuadrant.addColumnDefinition(0.2, false);
  2971. rgbValuesQuadrant.addColumnDefinition(0.7, false);
  2972. pickerColorValues.addControl(rgbValuesQuadrant, 1, 0);
  2973. for (var i = 0; i < inputFieldLabels.length; i++) {
  2974. var labelText = new _controls_textBlock__WEBPACK_IMPORTED_MODULE_7__["TextBlock"]();
  2975. labelText.text = inputFieldLabels[i];
  2976. labelText.color = buttonColor;
  2977. labelText.fontSize = buttonFontSize;
  2978. rgbValuesQuadrant.addControl(labelText, i, 0);
  2979. }
  2980. // Input fields for RGB values
  2981. rValInt = new _inputText__WEBPACK_IMPORTED_MODULE_3__["InputText"]();
  2982. rValInt.width = 0.83;
  2983. rValInt.height = 0.72;
  2984. rValInt.name = "rIntField";
  2985. rValInt.fontSize = buttonFontSize;
  2986. rValInt.text = (currentColor.r * 255).toString();
  2987. rValInt.color = inputTextColor;
  2988. rValInt.background = inputTextBackgroundColor;
  2989. rValInt.onFocusObservable.add(function () {
  2990. activeField = rValInt.name;
  2991. lastVal = rValInt.text;
  2992. editSwatches(false);
  2993. });
  2994. rValInt.onBlurObservable.add(function () {
  2995. if (rValInt.text == "") {
  2996. rValInt.text = "0";
  2997. }
  2998. updateInt(rValInt, "r");
  2999. if (activeField == rValInt.name) {
  3000. activeField = "";
  3001. }
  3002. });
  3003. rValInt.onTextChangedObservable.add(function () {
  3004. if (activeField == rValInt.name) {
  3005. updateInt(rValInt, "r");
  3006. }
  3007. });
  3008. rgbValuesQuadrant.addControl(rValInt, 0, 1);
  3009. gValInt = new _inputText__WEBPACK_IMPORTED_MODULE_3__["InputText"]();
  3010. gValInt.width = 0.83;
  3011. gValInt.height = 0.72;
  3012. gValInt.name = "gIntField";
  3013. gValInt.fontSize = buttonFontSize;
  3014. gValInt.text = (currentColor.g * 255).toString();
  3015. gValInt.color = inputTextColor;
  3016. gValInt.background = inputTextBackgroundColor;
  3017. gValInt.onFocusObservable.add(function () {
  3018. activeField = gValInt.name;
  3019. lastVal = gValInt.text;
  3020. editSwatches(false);
  3021. });
  3022. gValInt.onBlurObservable.add(function () {
  3023. if (gValInt.text == "") {
  3024. gValInt.text = "0";
  3025. }
  3026. updateInt(gValInt, "g");
  3027. if (activeField == gValInt.name) {
  3028. activeField = "";
  3029. }
  3030. });
  3031. gValInt.onTextChangedObservable.add(function () {
  3032. if (activeField == gValInt.name) {
  3033. updateInt(gValInt, "g");
  3034. }
  3035. });
  3036. rgbValuesQuadrant.addControl(gValInt, 1, 1);
  3037. bValInt = new _inputText__WEBPACK_IMPORTED_MODULE_3__["InputText"]();
  3038. bValInt.width = 0.83;
  3039. bValInt.height = 0.72;
  3040. bValInt.name = "bIntField";
  3041. bValInt.fontSize = buttonFontSize;
  3042. bValInt.text = (currentColor.b * 255).toString();
  3043. bValInt.color = inputTextColor;
  3044. bValInt.background = inputTextBackgroundColor;
  3045. bValInt.onFocusObservable.add(function () {
  3046. activeField = bValInt.name;
  3047. lastVal = bValInt.text;
  3048. editSwatches(false);
  3049. });
  3050. bValInt.onBlurObservable.add(function () {
  3051. if (bValInt.text == "") {
  3052. bValInt.text = "0";
  3053. }
  3054. updateInt(bValInt, "b");
  3055. if (activeField == bValInt.name) {
  3056. activeField = "";
  3057. }
  3058. });
  3059. bValInt.onTextChangedObservable.add(function () {
  3060. if (activeField == bValInt.name) {
  3061. updateInt(bValInt, "b");
  3062. }
  3063. });
  3064. rgbValuesQuadrant.addControl(bValInt, 2, 1);
  3065. rValDec = new _inputText__WEBPACK_IMPORTED_MODULE_3__["InputText"]();
  3066. rValDec.width = 0.95;
  3067. rValDec.height = 0.72;
  3068. rValDec.name = "rDecField";
  3069. rValDec.fontSize = buttonFontSize;
  3070. rValDec.text = currentColor.r.toString();
  3071. rValDec.color = inputTextColor;
  3072. rValDec.background = inputTextBackgroundColor;
  3073. rValDec.onFocusObservable.add(function () {
  3074. activeField = rValDec.name;
  3075. lastVal = rValDec.text;
  3076. editSwatches(false);
  3077. });
  3078. rValDec.onBlurObservable.add(function () {
  3079. if (parseFloat(rValDec.text) == 0 || rValDec.text == "") {
  3080. rValDec.text = "0";
  3081. updateFloat(rValDec, "r");
  3082. }
  3083. if (activeField == rValDec.name) {
  3084. activeField = "";
  3085. }
  3086. });
  3087. rValDec.onTextChangedObservable.add(function () {
  3088. if (activeField == rValDec.name) {
  3089. updateFloat(rValDec, "r");
  3090. }
  3091. });
  3092. rgbValuesQuadrant.addControl(rValDec, 0, 2);
  3093. gValDec = new _inputText__WEBPACK_IMPORTED_MODULE_3__["InputText"]();
  3094. gValDec.width = 0.95;
  3095. gValDec.height = 0.72;
  3096. gValDec.name = "gDecField";
  3097. gValDec.fontSize = buttonFontSize;
  3098. gValDec.text = currentColor.g.toString();
  3099. gValDec.color = inputTextColor;
  3100. gValDec.background = inputTextBackgroundColor;
  3101. gValDec.onFocusObservable.add(function () {
  3102. activeField = gValDec.name;
  3103. lastVal = gValDec.text;
  3104. editSwatches(false);
  3105. });
  3106. gValDec.onBlurObservable.add(function () {
  3107. if (parseFloat(gValDec.text) == 0 || gValDec.text == "") {
  3108. gValDec.text = "0";
  3109. updateFloat(gValDec, "g");
  3110. }
  3111. if (activeField == gValDec.name) {
  3112. activeField = "";
  3113. }
  3114. });
  3115. gValDec.onTextChangedObservable.add(function () {
  3116. if (activeField == gValDec.name) {
  3117. updateFloat(gValDec, "g");
  3118. }
  3119. });
  3120. rgbValuesQuadrant.addControl(gValDec, 1, 2);
  3121. bValDec = new _inputText__WEBPACK_IMPORTED_MODULE_3__["InputText"]();
  3122. bValDec.width = 0.95;
  3123. bValDec.height = 0.72;
  3124. bValDec.name = "bDecField";
  3125. bValDec.fontSize = buttonFontSize;
  3126. bValDec.text = currentColor.b.toString();
  3127. bValDec.color = inputTextColor;
  3128. bValDec.background = inputTextBackgroundColor;
  3129. bValDec.onFocusObservable.add(function () {
  3130. activeField = bValDec.name;
  3131. lastVal = bValDec.text;
  3132. editSwatches(false);
  3133. });
  3134. bValDec.onBlurObservable.add(function () {
  3135. if (parseFloat(bValDec.text) == 0 || bValDec.text == "") {
  3136. bValDec.text = "0";
  3137. updateFloat(bValDec, "b");
  3138. }
  3139. if (activeField == bValDec.name) {
  3140. activeField = "";
  3141. }
  3142. });
  3143. bValDec.onTextChangedObservable.add(function () {
  3144. if (activeField == bValDec.name) {
  3145. updateFloat(bValDec, "b");
  3146. }
  3147. });
  3148. rgbValuesQuadrant.addControl(bValDec, 2, 2);
  3149. // Hex value input
  3150. var hexValueQuadrant = new _grid__WEBPACK_IMPORTED_MODULE_6__["Grid"]();
  3151. hexValueQuadrant.name = "Hex Value";
  3152. hexValueQuadrant.width = 0.82;
  3153. hexValueQuadrant.addRowDefinition(1.0, false);
  3154. hexValueQuadrant.addColumnDefinition(0.1, false);
  3155. hexValueQuadrant.addColumnDefinition(0.9, false);
  3156. pickerColorValues.addControl(hexValueQuadrant, 2, 0);
  3157. var labelText = new _controls_textBlock__WEBPACK_IMPORTED_MODULE_7__["TextBlock"]();
  3158. labelText.text = "#";
  3159. labelText.color = buttonColor;
  3160. labelText.fontSize = buttonFontSize;
  3161. hexValueQuadrant.addControl(labelText, 0, 0);
  3162. hexVal = new _inputText__WEBPACK_IMPORTED_MODULE_3__["InputText"]();
  3163. hexVal.width = 0.96;
  3164. hexVal.height = 0.72;
  3165. hexVal.name = "hexField";
  3166. hexVal.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].HORIZONTAL_ALIGNMENT_CENTER;
  3167. hexVal.fontSize = buttonFontSize;
  3168. var minusPound = options.lastColor.split("#");
  3169. hexVal.text = minusPound[1];
  3170. hexVal.color = inputTextColor;
  3171. hexVal.background = inputTextBackgroundColor;
  3172. hexVal.onFocusObservable.add(function () {
  3173. activeField = hexVal.name;
  3174. lastVal = hexVal.text;
  3175. editSwatches(false);
  3176. });
  3177. hexVal.onBlurObservable.add(function () {
  3178. if (hexVal.text.length == 3) {
  3179. var val = hexVal.text.split("");
  3180. hexVal.text = val[0] + val[0] + val[1] + val[1] + val[2] + val[2];
  3181. }
  3182. if (hexVal.text == "") {
  3183. hexVal.text = "000000";
  3184. updateValues(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].FromHexString(hexVal.text), "b");
  3185. }
  3186. if (activeField == hexVal.name) {
  3187. activeField = "";
  3188. }
  3189. });
  3190. hexVal.onTextChangedObservable.add(function () {
  3191. var newHexValue = hexVal.text;
  3192. var checkHex = /[^0-9A-F]/i.test(newHexValue);
  3193. if ((hexVal.text.length > 6 || checkHex) && activeField == hexVal.name) {
  3194. hexVal.text = lastVal;
  3195. }
  3196. else {
  3197. if (hexVal.text.length < 6) {
  3198. var leadingZero = 6 - hexVal.text.length;
  3199. for (var i = 0; i < leadingZero; i++) {
  3200. newHexValue = "0" + newHexValue;
  3201. }
  3202. }
  3203. if (hexVal.text.length == 3) {
  3204. var val = hexVal.text.split("");
  3205. newHexValue = val[0] + val[0] + val[1] + val[1] + val[2] + val[2];
  3206. }
  3207. newHexValue = "#" + newHexValue;
  3208. if (activeField == hexVal.name) {
  3209. lastVal = hexVal.text;
  3210. updateValues(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Color3"].FromHexString(newHexValue), hexVal.name);
  3211. }
  3212. }
  3213. });
  3214. hexValueQuadrant.addControl(hexVal, 0, 1);
  3215. if (options.savedColors && options.savedColors.length > 0) {
  3216. updateSwatches("", butSave);
  3217. }
  3218. });
  3219. };
  3220. ColorPicker._Epsilon = 0.000001;
  3221. return ColorPicker;
  3222. }(_control__WEBPACK_IMPORTED_MODULE_2__["Control"]));
  3223. babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredTypes["BABYLON.GUI.ColorPicker"] = ColorPicker;
  3224. /***/ }),
  3225. /***/ "./2D/controls/container.ts":
  3226. /*!**********************************!*\
  3227. !*** ./2D/controls/container.ts ***!
  3228. \**********************************/
  3229. /*! exports provided: Container */
  3230. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  3231. "use strict";
  3232. __webpack_require__.r(__webpack_exports__);
  3233. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Container", function() { return Container; });
  3234. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  3235. /* harmony import */ var babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/logger */ "babylonjs/Maths/math.vector");
  3236. /* harmony import */ var babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1__);
  3237. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  3238. /* harmony import */ var _measure__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../measure */ "./2D/measure.ts");
  3239. /**
  3240. * Root class for 2D containers
  3241. * @see https://doc.babylonjs.com/how_to/gui#containers
  3242. */
  3243. var Container = /** @class */ (function (_super) {
  3244. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(Container, _super);
  3245. /**
  3246. * Creates a new Container
  3247. * @param name defines the name of the container
  3248. */
  3249. function Container(name) {
  3250. var _this = _super.call(this, name) || this;
  3251. _this.name = name;
  3252. /** @hidden */
  3253. _this._children = new Array();
  3254. /** @hidden */
  3255. _this._measureForChildren = _measure__WEBPACK_IMPORTED_MODULE_3__["Measure"].Empty();
  3256. /** @hidden */
  3257. _this._background = "";
  3258. /** @hidden */
  3259. _this._adaptWidthToChildren = false;
  3260. /** @hidden */
  3261. _this._adaptHeightToChildren = false;
  3262. /**
  3263. * Gets or sets a boolean indicating that layout cycle errors should be displayed on the console
  3264. */
  3265. _this.logLayoutCycleErrors = false;
  3266. /**
  3267. * Gets or sets the number of layout cycles (a change involved by a control while evaluating the layout) allowed
  3268. */
  3269. _this.maxLayoutCycle = 3;
  3270. return _this;
  3271. }
  3272. Object.defineProperty(Container.prototype, "adaptHeightToChildren", {
  3273. /** Gets or sets a boolean indicating if the container should try to adapt to its children height */
  3274. get: function () {
  3275. return this._adaptHeightToChildren;
  3276. },
  3277. set: function (value) {
  3278. if (this._adaptHeightToChildren === value) {
  3279. return;
  3280. }
  3281. this._adaptHeightToChildren = value;
  3282. if (value) {
  3283. this.height = "100%";
  3284. }
  3285. this._markAsDirty();
  3286. },
  3287. enumerable: false,
  3288. configurable: true
  3289. });
  3290. Object.defineProperty(Container.prototype, "adaptWidthToChildren", {
  3291. /** Gets or sets a boolean indicating if the container should try to adapt to its children width */
  3292. get: function () {
  3293. return this._adaptWidthToChildren;
  3294. },
  3295. set: function (value) {
  3296. if (this._adaptWidthToChildren === value) {
  3297. return;
  3298. }
  3299. this._adaptWidthToChildren = value;
  3300. if (value) {
  3301. this.width = "100%";
  3302. }
  3303. this._markAsDirty();
  3304. },
  3305. enumerable: false,
  3306. configurable: true
  3307. });
  3308. Object.defineProperty(Container.prototype, "background", {
  3309. /** Gets or sets background color */
  3310. get: function () {
  3311. return this._background;
  3312. },
  3313. set: function (value) {
  3314. if (this._background === value) {
  3315. return;
  3316. }
  3317. this._background = value;
  3318. this._markAsDirty();
  3319. },
  3320. enumerable: false,
  3321. configurable: true
  3322. });
  3323. Object.defineProperty(Container.prototype, "children", {
  3324. /** Gets the list of children */
  3325. get: function () {
  3326. return this._children;
  3327. },
  3328. enumerable: false,
  3329. configurable: true
  3330. });
  3331. Container.prototype._getTypeName = function () {
  3332. return "Container";
  3333. };
  3334. Container.prototype._flagDescendantsAsMatrixDirty = function () {
  3335. for (var _i = 0, _a = this.children; _i < _a.length; _i++) {
  3336. var child = _a[_i];
  3337. child._markMatrixAsDirty();
  3338. }
  3339. };
  3340. /**
  3341. * Gets a child using its name
  3342. * @param name defines the child name to look for
  3343. * @returns the child control if found
  3344. */
  3345. Container.prototype.getChildByName = function (name) {
  3346. for (var _i = 0, _a = this.children; _i < _a.length; _i++) {
  3347. var child = _a[_i];
  3348. if (child.name === name) {
  3349. return child;
  3350. }
  3351. }
  3352. return null;
  3353. };
  3354. /**
  3355. * Gets a child using its type and its name
  3356. * @param name defines the child name to look for
  3357. * @param type defines the child type to look for
  3358. * @returns the child control if found
  3359. */
  3360. Container.prototype.getChildByType = function (name, type) {
  3361. for (var _i = 0, _a = this.children; _i < _a.length; _i++) {
  3362. var child = _a[_i];
  3363. if (child.typeName === type) {
  3364. return child;
  3365. }
  3366. }
  3367. return null;
  3368. };
  3369. /**
  3370. * Search for a specific control in children
  3371. * @param control defines the control to look for
  3372. * @returns true if the control is in child list
  3373. */
  3374. Container.prototype.containsControl = function (control) {
  3375. return this.children.indexOf(control) !== -1;
  3376. };
  3377. /**
  3378. * Adds a new control to the current container
  3379. * @param control defines the control to add
  3380. * @returns the current container
  3381. */
  3382. Container.prototype.addControl = function (control) {
  3383. if (!control) {
  3384. return this;
  3385. }
  3386. var index = this._children.indexOf(control);
  3387. if (index !== -1) {
  3388. return this;
  3389. }
  3390. control._link(this._host);
  3391. control._markAllAsDirty();
  3392. this._reOrderControl(control);
  3393. this._markAsDirty();
  3394. return this;
  3395. };
  3396. /**
  3397. * Removes all controls from the current container
  3398. * @returns the current container
  3399. */
  3400. Container.prototype.clearControls = function () {
  3401. var children = this.children.slice();
  3402. for (var _i = 0, children_1 = children; _i < children_1.length; _i++) {
  3403. var child = children_1[_i];
  3404. this.removeControl(child);
  3405. }
  3406. return this;
  3407. };
  3408. /**
  3409. * Removes a control from the current container
  3410. * @param control defines the control to remove
  3411. * @returns the current container
  3412. */
  3413. Container.prototype.removeControl = function (control) {
  3414. var index = this._children.indexOf(control);
  3415. if (index !== -1) {
  3416. this._children.splice(index, 1);
  3417. control.parent = null;
  3418. }
  3419. control.linkWithMesh(null);
  3420. if (this._host) {
  3421. this._host._cleanControlAfterRemoval(control);
  3422. }
  3423. this._markAsDirty();
  3424. return this;
  3425. };
  3426. /** @hidden */
  3427. Container.prototype._reOrderControl = function (control) {
  3428. this.removeControl(control);
  3429. var wasAdded = false;
  3430. for (var index = 0; index < this._children.length; index++) {
  3431. if (this._children[index].zIndex > control.zIndex) {
  3432. this._children.splice(index, 0, control);
  3433. wasAdded = true;
  3434. break;
  3435. }
  3436. }
  3437. if (!wasAdded) {
  3438. this._children.push(control);
  3439. }
  3440. control.parent = this;
  3441. this._markAsDirty();
  3442. };
  3443. /** @hidden */
  3444. Container.prototype._offsetLeft = function (offset) {
  3445. _super.prototype._offsetLeft.call(this, offset);
  3446. for (var _i = 0, _a = this._children; _i < _a.length; _i++) {
  3447. var child = _a[_i];
  3448. child._offsetLeft(offset);
  3449. }
  3450. };
  3451. /** @hidden */
  3452. Container.prototype._offsetTop = function (offset) {
  3453. _super.prototype._offsetTop.call(this, offset);
  3454. for (var _i = 0, _a = this._children; _i < _a.length; _i++) {
  3455. var child = _a[_i];
  3456. child._offsetTop(offset);
  3457. }
  3458. };
  3459. /** @hidden */
  3460. Container.prototype._markAllAsDirty = function () {
  3461. _super.prototype._markAllAsDirty.call(this);
  3462. for (var index = 0; index < this._children.length; index++) {
  3463. this._children[index]._markAllAsDirty();
  3464. }
  3465. };
  3466. /** @hidden */
  3467. Container.prototype._localDraw = function (context) {
  3468. if (this._background) {
  3469. context.save();
  3470. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  3471. context.shadowColor = this.shadowColor;
  3472. context.shadowBlur = this.shadowBlur;
  3473. context.shadowOffsetX = this.shadowOffsetX;
  3474. context.shadowOffsetY = this.shadowOffsetY;
  3475. }
  3476. context.fillStyle = this._background;
  3477. context.fillRect(this._currentMeasure.left, this._currentMeasure.top, this._currentMeasure.width, this._currentMeasure.height);
  3478. context.restore();
  3479. }
  3480. };
  3481. /** @hidden */
  3482. Container.prototype._link = function (host) {
  3483. _super.prototype._link.call(this, host);
  3484. for (var _i = 0, _a = this._children; _i < _a.length; _i++) {
  3485. var child = _a[_i];
  3486. child._link(host);
  3487. }
  3488. };
  3489. /** @hidden */
  3490. Container.prototype._beforeLayout = function () {
  3491. // Do nothing
  3492. };
  3493. /** @hidden */
  3494. Container.prototype._processMeasures = function (parentMeasure, context) {
  3495. if (this._isDirty || !this._cachedParentMeasure.isEqualsTo(parentMeasure)) {
  3496. _super.prototype._processMeasures.call(this, parentMeasure, context);
  3497. this._evaluateClippingState(parentMeasure);
  3498. }
  3499. };
  3500. /** @hidden */
  3501. Container.prototype._layout = function (parentMeasure, context) {
  3502. if (!this.isDirty && (!this.isVisible || this.notRenderable)) {
  3503. return false;
  3504. }
  3505. this.host._numLayoutCalls++;
  3506. if (this._isDirty) {
  3507. this._currentMeasure.transformToRef(this._transformMatrix, this._prevCurrentMeasureTransformedIntoGlobalSpace);
  3508. }
  3509. var rebuildCount = 0;
  3510. context.save();
  3511. this._applyStates(context);
  3512. this._beforeLayout();
  3513. do {
  3514. var computedWidth = -1;
  3515. var computedHeight = -1;
  3516. this._rebuildLayout = false;
  3517. this._processMeasures(parentMeasure, context);
  3518. if (!this._isClipped) {
  3519. for (var _i = 0, _a = this._children; _i < _a.length; _i++) {
  3520. var child = _a[_i];
  3521. child._tempParentMeasure.copyFrom(this._measureForChildren);
  3522. if (child._layout(this._measureForChildren, context)) {
  3523. if (this.adaptWidthToChildren && child._width.isPixel) {
  3524. computedWidth = Math.max(computedWidth, child._currentMeasure.width + child.paddingLeftInPixels + child.paddingRightInPixels);
  3525. }
  3526. if (this.adaptHeightToChildren && child._height.isPixel) {
  3527. computedHeight = Math.max(computedHeight, child._currentMeasure.height + child.paddingTopInPixels + child.paddingBottomInPixels);
  3528. }
  3529. }
  3530. }
  3531. if (this.adaptWidthToChildren && computedWidth >= 0) {
  3532. if (this.width !== computedWidth + "px") {
  3533. this.width = computedWidth + "px";
  3534. this._rebuildLayout = true;
  3535. }
  3536. }
  3537. if (this.adaptHeightToChildren && computedHeight >= 0) {
  3538. if (this.height !== computedHeight + "px") {
  3539. this.height = computedHeight + "px";
  3540. this._rebuildLayout = true;
  3541. }
  3542. }
  3543. this._postMeasure();
  3544. }
  3545. rebuildCount++;
  3546. } while (this._rebuildLayout && rebuildCount < this.maxLayoutCycle);
  3547. if (rebuildCount >= 3 && this.logLayoutCycleErrors) {
  3548. babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1__["Logger"].Error("Layout cycle detected in GUI (Container name=" + this.name + ", uniqueId=" + this.uniqueId + ")");
  3549. }
  3550. context.restore();
  3551. if (this._isDirty) {
  3552. this.invalidateRect();
  3553. this._isDirty = false;
  3554. }
  3555. return true;
  3556. };
  3557. Container.prototype._postMeasure = function () {
  3558. // Do nothing by default
  3559. };
  3560. /** @hidden */
  3561. Container.prototype._draw = function (context, invalidatedRectangle) {
  3562. this._localDraw(context);
  3563. if (this.clipChildren) {
  3564. this._clipForChildren(context);
  3565. }
  3566. for (var _i = 0, _a = this._children; _i < _a.length; _i++) {
  3567. var child = _a[_i];
  3568. // Only redraw parts of the screen that are invalidated
  3569. if (invalidatedRectangle) {
  3570. if (!child._intersectsRect(invalidatedRectangle)) {
  3571. continue;
  3572. }
  3573. }
  3574. child._render(context, invalidatedRectangle);
  3575. }
  3576. };
  3577. Container.prototype.getDescendantsToRef = function (results, directDescendantsOnly, predicate) {
  3578. if (directDescendantsOnly === void 0) { directDescendantsOnly = false; }
  3579. if (!this.children) {
  3580. return;
  3581. }
  3582. for (var index = 0; index < this.children.length; index++) {
  3583. var item = this.children[index];
  3584. if (!predicate || predicate(item)) {
  3585. results.push(item);
  3586. }
  3587. if (!directDescendantsOnly) {
  3588. item.getDescendantsToRef(results, false, predicate);
  3589. }
  3590. }
  3591. };
  3592. /** @hidden */
  3593. Container.prototype._processPicking = function (x, y, type, pointerId, buttonIndex, deltaX, deltaY) {
  3594. if (!this._isEnabled || !this.isVisible || this.notRenderable) {
  3595. return false;
  3596. }
  3597. if (!_super.prototype.contains.call(this, x, y)) {
  3598. return false;
  3599. }
  3600. // Checking backwards to pick closest first
  3601. for (var index = this._children.length - 1; index >= 0; index--) {
  3602. var child = this._children[index];
  3603. if (child._processPicking(x, y, type, pointerId, buttonIndex, deltaX, deltaY)) {
  3604. if (child.hoverCursor) {
  3605. this._host._changeCursor(child.hoverCursor);
  3606. }
  3607. return true;
  3608. }
  3609. }
  3610. if (!this.isHitTestVisible) {
  3611. return false;
  3612. }
  3613. return this._processObservables(type, x, y, pointerId, buttonIndex, deltaX, deltaY);
  3614. };
  3615. /** @hidden */
  3616. Container.prototype._additionalProcessing = function (parentMeasure, context) {
  3617. _super.prototype._additionalProcessing.call(this, parentMeasure, context);
  3618. this._measureForChildren.copyFrom(this._currentMeasure);
  3619. };
  3620. /** Releases associated resources */
  3621. Container.prototype.dispose = function () {
  3622. _super.prototype.dispose.call(this);
  3623. for (var index = this.children.length - 1; index >= 0; index--) {
  3624. this.children[index].dispose();
  3625. }
  3626. };
  3627. return Container;
  3628. }(_control__WEBPACK_IMPORTED_MODULE_2__["Control"]));
  3629. babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredTypes["BABYLON.GUI.Container"] = Container;
  3630. /***/ }),
  3631. /***/ "./2D/controls/control.ts":
  3632. /*!********************************!*\
  3633. !*** ./2D/controls/control.ts ***!
  3634. \********************************/
  3635. /*! exports provided: Control */
  3636. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  3637. "use strict";
  3638. __webpack_require__.r(__webpack_exports__);
  3639. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Control", function() { return Control; });
  3640. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math.vector");
  3641. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
  3642. /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
  3643. /* harmony import */ var _measure__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../measure */ "./2D/measure.ts");
  3644. /* harmony import */ var _math2D__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../math2D */ "./2D/math2D.ts");
  3645. /**
  3646. * Root class used for all 2D controls
  3647. * @see https://doc.babylonjs.com/how_to/gui#controls
  3648. */
  3649. var Control = /** @class */ (function () {
  3650. // Functions
  3651. /**
  3652. * Creates a new control
  3653. * @param name defines the name of the control
  3654. */
  3655. function Control(
  3656. /** defines the name of the control */
  3657. name) {
  3658. this.name = name;
  3659. this._alpha = 1;
  3660. this._alphaSet = false;
  3661. this._zIndex = 0;
  3662. /** @hidden */
  3663. this._currentMeasure = _measure__WEBPACK_IMPORTED_MODULE_2__["Measure"].Empty();
  3664. this._fontFamily = "Arial";
  3665. this._fontStyle = "";
  3666. this._fontWeight = "";
  3667. this._fontSize = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"](18, _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"].UNITMODE_PIXEL, false);
  3668. /** @hidden */
  3669. this._width = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"](1, _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"].UNITMODE_PERCENTAGE, false);
  3670. /** @hidden */
  3671. this._height = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"](1, _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"].UNITMODE_PERCENTAGE, false);
  3672. this._color = "";
  3673. this._style = null;
  3674. /** @hidden */
  3675. this._horizontalAlignment = Control.HORIZONTAL_ALIGNMENT_CENTER;
  3676. /** @hidden */
  3677. this._verticalAlignment = Control.VERTICAL_ALIGNMENT_CENTER;
  3678. /** @hidden */
  3679. this._isDirty = true;
  3680. /** @hidden */
  3681. this._wasDirty = false;
  3682. /** @hidden */
  3683. this._tempParentMeasure = _measure__WEBPACK_IMPORTED_MODULE_2__["Measure"].Empty();
  3684. /** @hidden */
  3685. this._prevCurrentMeasureTransformedIntoGlobalSpace = _measure__WEBPACK_IMPORTED_MODULE_2__["Measure"].Empty();
  3686. /** @hidden */
  3687. this._cachedParentMeasure = _measure__WEBPACK_IMPORTED_MODULE_2__["Measure"].Empty();
  3688. this._paddingLeft = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"](0);
  3689. this._paddingRight = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"](0);
  3690. this._paddingTop = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"](0);
  3691. this._paddingBottom = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"](0);
  3692. /** @hidden */
  3693. this._left = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"](0);
  3694. /** @hidden */
  3695. this._top = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"](0);
  3696. this._scaleX = 1.0;
  3697. this._scaleY = 1.0;
  3698. this._rotation = 0;
  3699. this._transformCenterX = 0.5;
  3700. this._transformCenterY = 0.5;
  3701. /** @hidden */
  3702. this._transformMatrix = _math2D__WEBPACK_IMPORTED_MODULE_3__["Matrix2D"].Identity();
  3703. /** @hidden */
  3704. this._invertTransformMatrix = _math2D__WEBPACK_IMPORTED_MODULE_3__["Matrix2D"].Identity();
  3705. /** @hidden */
  3706. this._transformedPosition = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Vector2"].Zero();
  3707. this._isMatrixDirty = true;
  3708. this._isVisible = true;
  3709. this._isHighlighted = false;
  3710. this._fontSet = false;
  3711. this._dummyVector2 = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Vector2"].Zero();
  3712. this._downCount = 0;
  3713. this._enterCount = -1;
  3714. this._doNotRender = false;
  3715. this._downPointerIds = {};
  3716. this._isEnabled = true;
  3717. this._disabledColor = "#9a9a9a";
  3718. this._disabledColorItem = "#6a6a6a";
  3719. /** @hidden */
  3720. this._rebuildLayout = false;
  3721. /** @hidden */
  3722. this._customData = {};
  3723. /** @hidden */
  3724. this._isClipped = false;
  3725. /** @hidden */
  3726. this._automaticSize = false;
  3727. /**
  3728. * Gets or sets an object used to store user defined information for the node
  3729. */
  3730. this.metadata = null;
  3731. /** Gets or sets a boolean indicating if the control can be hit with pointer events */
  3732. this.isHitTestVisible = true;
  3733. /** Gets or sets a boolean indicating if the control can block pointer events */
  3734. this.isPointerBlocker = false;
  3735. /** Gets or sets a boolean indicating if the control can be focusable */
  3736. this.isFocusInvisible = false;
  3737. /**
  3738. * Gets or sets a boolean indicating if the children are clipped to the current control bounds.
  3739. * Please note that not clipping children may generate issues with adt.useInvalidateRectOptimization so it is recommended to turn this optimization off if you want to use unclipped children
  3740. */
  3741. this.clipChildren = true;
  3742. /**
  3743. * Gets or sets a boolean indicating that control content must be clipped
  3744. * Please note that not clipping children may generate issues with adt.useInvalidateRectOptimization so it is recommended to turn this optimization off if you want to use unclipped children
  3745. */
  3746. this.clipContent = true;
  3747. /**
  3748. * Gets or sets a boolean indicating that the current control should cache its rendering (useful when the control does not change often)
  3749. */
  3750. this.useBitmapCache = false;
  3751. this._shadowOffsetX = 0;
  3752. this._shadowOffsetY = 0;
  3753. this._shadowBlur = 0;
  3754. this._shadowColor = 'black';
  3755. /** Gets or sets the cursor to use when the control is hovered */
  3756. this.hoverCursor = "";
  3757. /** @hidden */
  3758. this._linkOffsetX = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"](0);
  3759. /** @hidden */
  3760. this._linkOffsetY = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"](0);
  3761. /**
  3762. * An event triggered when pointer wheel is scrolled
  3763. */
  3764. this.onWheelObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  3765. /**
  3766. * An event triggered when the pointer move over the control.
  3767. */
  3768. this.onPointerMoveObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  3769. /**
  3770. * An event triggered when the pointer move out of the control.
  3771. */
  3772. this.onPointerOutObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  3773. /**
  3774. * An event triggered when the pointer taps the control
  3775. */
  3776. this.onPointerDownObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  3777. /**
  3778. * An event triggered when pointer up
  3779. */
  3780. this.onPointerUpObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  3781. /**
  3782. * An event triggered when a control is clicked on
  3783. */
  3784. this.onPointerClickObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  3785. /**
  3786. * An event triggered when pointer enters the control
  3787. */
  3788. this.onPointerEnterObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  3789. /**
  3790. * An event triggered when the control is marked as dirty
  3791. */
  3792. this.onDirtyObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  3793. /**
  3794. * An event triggered before drawing the control
  3795. */
  3796. this.onBeforeDrawObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  3797. /**
  3798. * An event triggered after the control was drawn
  3799. */
  3800. this.onAfterDrawObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  3801. /**
  3802. * An event triggered when the control has been disposed
  3803. */
  3804. this.onDisposeObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  3805. /**
  3806. * Gets or sets a fixed ratio for this control.
  3807. * When different from 0, the ratio is used to compute the "second" dimension.
  3808. * The first dimension used in the computation is the last one set (by setting width / widthInPixels or height / heightInPixels), and the
  3809. * second dimension is computed as first dimension * fixedRatio
  3810. */
  3811. this.fixedRatio = 0;
  3812. this._fixedRatioMasterIsWidth = true;
  3813. this._tmpMeasureA = new _measure__WEBPACK_IMPORTED_MODULE_2__["Measure"](0, 0, 0, 0);
  3814. }
  3815. Object.defineProperty(Control.prototype, "shadowOffsetX", {
  3816. /** Gets or sets a value indicating the offset to apply on X axis to render the shadow */
  3817. get: function () {
  3818. return this._shadowOffsetX;
  3819. },
  3820. set: function (value) {
  3821. if (this._shadowOffsetX === value) {
  3822. return;
  3823. }
  3824. this._shadowOffsetX = value;
  3825. this._markAsDirty();
  3826. },
  3827. enumerable: false,
  3828. configurable: true
  3829. });
  3830. Object.defineProperty(Control.prototype, "shadowOffsetY", {
  3831. /** Gets or sets a value indicating the offset to apply on Y axis to render the shadow */
  3832. get: function () {
  3833. return this._shadowOffsetY;
  3834. },
  3835. set: function (value) {
  3836. if (this._shadowOffsetY === value) {
  3837. return;
  3838. }
  3839. this._shadowOffsetY = value;
  3840. this._markAsDirty();
  3841. },
  3842. enumerable: false,
  3843. configurable: true
  3844. });
  3845. Object.defineProperty(Control.prototype, "shadowBlur", {
  3846. /** Gets or sets a value indicating the amount of blur to use to render the shadow */
  3847. get: function () {
  3848. return this._shadowBlur;
  3849. },
  3850. set: function (value) {
  3851. if (this._shadowBlur === value) {
  3852. return;
  3853. }
  3854. this._shadowBlur = value;
  3855. this._markAsDirty();
  3856. },
  3857. enumerable: false,
  3858. configurable: true
  3859. });
  3860. Object.defineProperty(Control.prototype, "shadowColor", {
  3861. /** Gets or sets a value indicating the color of the shadow (black by default ie. "#000") */
  3862. get: function () {
  3863. return this._shadowColor;
  3864. },
  3865. set: function (value) {
  3866. if (this._shadowColor === value) {
  3867. return;
  3868. }
  3869. this._shadowColor = value;
  3870. this._markAsDirty();
  3871. },
  3872. enumerable: false,
  3873. configurable: true
  3874. });
  3875. Object.defineProperty(Control.prototype, "typeName", {
  3876. // Properties
  3877. /** Gets the control type name */
  3878. get: function () {
  3879. return this._getTypeName();
  3880. },
  3881. enumerable: false,
  3882. configurable: true
  3883. });
  3884. /**
  3885. * Get the current class name of the control.
  3886. * @returns current class name
  3887. */
  3888. Control.prototype.getClassName = function () {
  3889. return this._getTypeName();
  3890. };
  3891. Object.defineProperty(Control.prototype, "host", {
  3892. /**
  3893. * Get the hosting AdvancedDynamicTexture
  3894. */
  3895. get: function () {
  3896. return this._host;
  3897. },
  3898. enumerable: false,
  3899. configurable: true
  3900. });
  3901. Object.defineProperty(Control.prototype, "fontOffset", {
  3902. /** Gets or set information about font offsets (used to render and align text) */
  3903. get: function () {
  3904. return this._fontOffset;
  3905. },
  3906. set: function (offset) {
  3907. this._fontOffset = offset;
  3908. },
  3909. enumerable: false,
  3910. configurable: true
  3911. });
  3912. Object.defineProperty(Control.prototype, "alpha", {
  3913. /** Gets or sets alpha value for the control (1 means opaque and 0 means entirely transparent) */
  3914. get: function () {
  3915. return this._alpha;
  3916. },
  3917. set: function (value) {
  3918. if (this._alpha === value) {
  3919. return;
  3920. }
  3921. this._alphaSet = true;
  3922. this._alpha = value;
  3923. this._markAsDirty();
  3924. },
  3925. enumerable: false,
  3926. configurable: true
  3927. });
  3928. Object.defineProperty(Control.prototype, "isHighlighted", {
  3929. /**
  3930. * Gets or sets a boolean indicating that we want to highlight the control (mostly for debugging purpose)
  3931. */
  3932. get: function () {
  3933. return this._isHighlighted;
  3934. },
  3935. set: function (value) {
  3936. if (this._isHighlighted === value) {
  3937. return;
  3938. }
  3939. this._isHighlighted = value;
  3940. this._markAsDirty();
  3941. },
  3942. enumerable: false,
  3943. configurable: true
  3944. });
  3945. Object.defineProperty(Control.prototype, "scaleX", {
  3946. /** Gets or sets a value indicating the scale factor on X axis (1 by default)
  3947. * @see https://doc.babylonjs.com/how_to/gui#rotation-and-scaling
  3948. */
  3949. get: function () {
  3950. return this._scaleX;
  3951. },
  3952. set: function (value) {
  3953. if (this._scaleX === value) {
  3954. return;
  3955. }
  3956. this._scaleX = value;
  3957. this._markAsDirty();
  3958. this._markMatrixAsDirty();
  3959. },
  3960. enumerable: false,
  3961. configurable: true
  3962. });
  3963. Object.defineProperty(Control.prototype, "scaleY", {
  3964. /** Gets or sets a value indicating the scale factor on Y axis (1 by default)
  3965. * @see https://doc.babylonjs.com/how_to/gui#rotation-and-scaling
  3966. */
  3967. get: function () {
  3968. return this._scaleY;
  3969. },
  3970. set: function (value) {
  3971. if (this._scaleY === value) {
  3972. return;
  3973. }
  3974. this._scaleY = value;
  3975. this._markAsDirty();
  3976. this._markMatrixAsDirty();
  3977. },
  3978. enumerable: false,
  3979. configurable: true
  3980. });
  3981. Object.defineProperty(Control.prototype, "rotation", {
  3982. /** Gets or sets the rotation angle (0 by default)
  3983. * @see https://doc.babylonjs.com/how_to/gui#rotation-and-scaling
  3984. */
  3985. get: function () {
  3986. return this._rotation;
  3987. },
  3988. set: function (value) {
  3989. if (this._rotation === value) {
  3990. return;
  3991. }
  3992. this._rotation = value;
  3993. this._markAsDirty();
  3994. this._markMatrixAsDirty();
  3995. },
  3996. enumerable: false,
  3997. configurable: true
  3998. });
  3999. Object.defineProperty(Control.prototype, "transformCenterY", {
  4000. /** Gets or sets the transformation center on Y axis (0 by default)
  4001. * @see https://doc.babylonjs.com/how_to/gui#rotation-and-scaling
  4002. */
  4003. get: function () {
  4004. return this._transformCenterY;
  4005. },
  4006. set: function (value) {
  4007. if (this._transformCenterY === value) {
  4008. return;
  4009. }
  4010. this._transformCenterY = value;
  4011. this._markAsDirty();
  4012. this._markMatrixAsDirty();
  4013. },
  4014. enumerable: false,
  4015. configurable: true
  4016. });
  4017. Object.defineProperty(Control.prototype, "transformCenterX", {
  4018. /** Gets or sets the transformation center on X axis (0 by default)
  4019. * @see https://doc.babylonjs.com/how_to/gui#rotation-and-scaling
  4020. */
  4021. get: function () {
  4022. return this._transformCenterX;
  4023. },
  4024. set: function (value) {
  4025. if (this._transformCenterX === value) {
  4026. return;
  4027. }
  4028. this._transformCenterX = value;
  4029. this._markAsDirty();
  4030. this._markMatrixAsDirty();
  4031. },
  4032. enumerable: false,
  4033. configurable: true
  4034. });
  4035. Object.defineProperty(Control.prototype, "horizontalAlignment", {
  4036. /**
  4037. * Gets or sets the horizontal alignment
  4038. * @see https://doc.babylonjs.com/how_to/gui#alignments
  4039. */
  4040. get: function () {
  4041. return this._horizontalAlignment;
  4042. },
  4043. set: function (value) {
  4044. if (this._horizontalAlignment === value) {
  4045. return;
  4046. }
  4047. this._horizontalAlignment = value;
  4048. this._markAsDirty();
  4049. },
  4050. enumerable: false,
  4051. configurable: true
  4052. });
  4053. Object.defineProperty(Control.prototype, "verticalAlignment", {
  4054. /**
  4055. * Gets or sets the vertical alignment
  4056. * @see https://doc.babylonjs.com/how_to/gui#alignments
  4057. */
  4058. get: function () {
  4059. return this._verticalAlignment;
  4060. },
  4061. set: function (value) {
  4062. if (this._verticalAlignment === value) {
  4063. return;
  4064. }
  4065. this._verticalAlignment = value;
  4066. this._markAsDirty();
  4067. },
  4068. enumerable: false,
  4069. configurable: true
  4070. });
  4071. Object.defineProperty(Control.prototype, "width", {
  4072. /**
  4073. * Gets or sets control width
  4074. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4075. */
  4076. get: function () {
  4077. return this._width.toString(this._host);
  4078. },
  4079. set: function (value) {
  4080. this._fixedRatioMasterIsWidth = true;
  4081. if (this._width.toString(this._host) === value) {
  4082. return;
  4083. }
  4084. if (this._width.fromString(value)) {
  4085. this._markAsDirty();
  4086. }
  4087. },
  4088. enumerable: false,
  4089. configurable: true
  4090. });
  4091. Object.defineProperty(Control.prototype, "widthInPixels", {
  4092. /**
  4093. * Gets or sets the control width in pixel
  4094. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4095. */
  4096. get: function () {
  4097. return this._width.getValueInPixel(this._host, this._cachedParentMeasure.width);
  4098. },
  4099. set: function (value) {
  4100. if (isNaN(value)) {
  4101. return;
  4102. }
  4103. this._fixedRatioMasterIsWidth = true;
  4104. this.width = value + "px";
  4105. },
  4106. enumerable: false,
  4107. configurable: true
  4108. });
  4109. Object.defineProperty(Control.prototype, "height", {
  4110. /**
  4111. * Gets or sets control height
  4112. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4113. */
  4114. get: function () {
  4115. return this._height.toString(this._host);
  4116. },
  4117. set: function (value) {
  4118. this._fixedRatioMasterIsWidth = false;
  4119. if (this._height.toString(this._host) === value) {
  4120. return;
  4121. }
  4122. if (this._height.fromString(value)) {
  4123. this._markAsDirty();
  4124. }
  4125. },
  4126. enumerable: false,
  4127. configurable: true
  4128. });
  4129. Object.defineProperty(Control.prototype, "heightInPixels", {
  4130. /**
  4131. * Gets or sets control height in pixel
  4132. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4133. */
  4134. get: function () {
  4135. return this._height.getValueInPixel(this._host, this._cachedParentMeasure.height);
  4136. },
  4137. set: function (value) {
  4138. if (isNaN(value)) {
  4139. return;
  4140. }
  4141. this._fixedRatioMasterIsWidth = false;
  4142. this.height = value + "px";
  4143. },
  4144. enumerable: false,
  4145. configurable: true
  4146. });
  4147. Object.defineProperty(Control.prototype, "fontFamily", {
  4148. /** Gets or set font family */
  4149. get: function () {
  4150. if (!this._fontSet) {
  4151. return "";
  4152. }
  4153. return this._fontFamily;
  4154. },
  4155. set: function (value) {
  4156. if (this._fontFamily === value) {
  4157. return;
  4158. }
  4159. this._fontFamily = value;
  4160. this._resetFontCache();
  4161. },
  4162. enumerable: false,
  4163. configurable: true
  4164. });
  4165. Object.defineProperty(Control.prototype, "fontStyle", {
  4166. /** Gets or sets font style */
  4167. get: function () {
  4168. return this._fontStyle;
  4169. },
  4170. set: function (value) {
  4171. if (this._fontStyle === value) {
  4172. return;
  4173. }
  4174. this._fontStyle = value;
  4175. this._resetFontCache();
  4176. },
  4177. enumerable: false,
  4178. configurable: true
  4179. });
  4180. Object.defineProperty(Control.prototype, "fontWeight", {
  4181. /** Gets or sets font weight */
  4182. get: function () {
  4183. return this._fontWeight;
  4184. },
  4185. set: function (value) {
  4186. if (this._fontWeight === value) {
  4187. return;
  4188. }
  4189. this._fontWeight = value;
  4190. this._resetFontCache();
  4191. },
  4192. enumerable: false,
  4193. configurable: true
  4194. });
  4195. Object.defineProperty(Control.prototype, "style", {
  4196. /**
  4197. * Gets or sets style
  4198. * @see https://doc.babylonjs.com/how_to/gui#styles
  4199. */
  4200. get: function () {
  4201. return this._style;
  4202. },
  4203. set: function (value) {
  4204. var _this = this;
  4205. if (this._style) {
  4206. this._style.onChangedObservable.remove(this._styleObserver);
  4207. this._styleObserver = null;
  4208. }
  4209. this._style = value;
  4210. if (this._style) {
  4211. this._styleObserver = this._style.onChangedObservable.add(function () {
  4212. _this._markAsDirty();
  4213. _this._resetFontCache();
  4214. });
  4215. }
  4216. this._markAsDirty();
  4217. this._resetFontCache();
  4218. },
  4219. enumerable: false,
  4220. configurable: true
  4221. });
  4222. Object.defineProperty(Control.prototype, "_isFontSizeInPercentage", {
  4223. /** @hidden */
  4224. get: function () {
  4225. return this._fontSize.isPercentage;
  4226. },
  4227. enumerable: false,
  4228. configurable: true
  4229. });
  4230. Object.defineProperty(Control.prototype, "fontSizeInPixels", {
  4231. /** Gets or sets font size in pixels */
  4232. get: function () {
  4233. var fontSizeToUse = this._style ? this._style._fontSize : this._fontSize;
  4234. if (fontSizeToUse.isPixel) {
  4235. return fontSizeToUse.getValue(this._host);
  4236. }
  4237. return fontSizeToUse.getValueInPixel(this._host, this._tempParentMeasure.height || this._cachedParentMeasure.height);
  4238. },
  4239. set: function (value) {
  4240. if (isNaN(value)) {
  4241. return;
  4242. }
  4243. this.fontSize = value + "px";
  4244. },
  4245. enumerable: false,
  4246. configurable: true
  4247. });
  4248. Object.defineProperty(Control.prototype, "fontSize", {
  4249. /** Gets or sets font size */
  4250. get: function () {
  4251. return this._fontSize.toString(this._host);
  4252. },
  4253. set: function (value) {
  4254. if (this._fontSize.toString(this._host) === value) {
  4255. return;
  4256. }
  4257. if (this._fontSize.fromString(value)) {
  4258. this._markAsDirty();
  4259. this._resetFontCache();
  4260. }
  4261. },
  4262. enumerable: false,
  4263. configurable: true
  4264. });
  4265. Object.defineProperty(Control.prototype, "color", {
  4266. /** Gets or sets foreground color */
  4267. get: function () {
  4268. return this._color;
  4269. },
  4270. set: function (value) {
  4271. if (this._color === value) {
  4272. return;
  4273. }
  4274. this._color = value;
  4275. this._markAsDirty();
  4276. },
  4277. enumerable: false,
  4278. configurable: true
  4279. });
  4280. Object.defineProperty(Control.prototype, "zIndex", {
  4281. /** Gets or sets z index which is used to reorder controls on the z axis */
  4282. get: function () {
  4283. return this._zIndex;
  4284. },
  4285. set: function (value) {
  4286. if (this.zIndex === value) {
  4287. return;
  4288. }
  4289. this._zIndex = value;
  4290. if (this.parent) {
  4291. this.parent._reOrderControl(this);
  4292. }
  4293. },
  4294. enumerable: false,
  4295. configurable: true
  4296. });
  4297. Object.defineProperty(Control.prototype, "notRenderable", {
  4298. /** Gets or sets a boolean indicating if the control can be rendered */
  4299. get: function () {
  4300. return this._doNotRender;
  4301. },
  4302. set: function (value) {
  4303. if (this._doNotRender === value) {
  4304. return;
  4305. }
  4306. this._doNotRender = value;
  4307. this._markAsDirty();
  4308. },
  4309. enumerable: false,
  4310. configurable: true
  4311. });
  4312. Object.defineProperty(Control.prototype, "isVisible", {
  4313. /** Gets or sets a boolean indicating if the control is visible */
  4314. get: function () {
  4315. return this._isVisible;
  4316. },
  4317. set: function (value) {
  4318. if (this._isVisible === value) {
  4319. return;
  4320. }
  4321. this._isVisible = value;
  4322. this._markAsDirty(true);
  4323. },
  4324. enumerable: false,
  4325. configurable: true
  4326. });
  4327. Object.defineProperty(Control.prototype, "isDirty", {
  4328. /** Gets a boolean indicating that the control needs to update its rendering */
  4329. get: function () {
  4330. return this._isDirty;
  4331. },
  4332. enumerable: false,
  4333. configurable: true
  4334. });
  4335. Object.defineProperty(Control.prototype, "linkedMesh", {
  4336. /**
  4337. * Gets the current linked mesh (or null if none)
  4338. */
  4339. get: function () {
  4340. return this._linkedMesh;
  4341. },
  4342. enumerable: false,
  4343. configurable: true
  4344. });
  4345. Object.defineProperty(Control.prototype, "paddingLeft", {
  4346. /**
  4347. * Gets or sets a value indicating the padding to use on the left of the control
  4348. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4349. */
  4350. get: function () {
  4351. return this._paddingLeft.toString(this._host);
  4352. },
  4353. set: function (value) {
  4354. if (this._paddingLeft.fromString(value)) {
  4355. this._markAsDirty();
  4356. }
  4357. },
  4358. enumerable: false,
  4359. configurable: true
  4360. });
  4361. Object.defineProperty(Control.prototype, "paddingLeftInPixels", {
  4362. /**
  4363. * Gets or sets a value indicating the padding in pixels to use on the left of the control
  4364. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4365. */
  4366. get: function () {
  4367. return this._paddingLeft.getValueInPixel(this._host, this._cachedParentMeasure.width);
  4368. },
  4369. set: function (value) {
  4370. if (isNaN(value)) {
  4371. return;
  4372. }
  4373. this.paddingLeft = value + "px";
  4374. },
  4375. enumerable: false,
  4376. configurable: true
  4377. });
  4378. Object.defineProperty(Control.prototype, "paddingRight", {
  4379. /**
  4380. * Gets or sets a value indicating the padding to use on the right of the control
  4381. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4382. */
  4383. get: function () {
  4384. return this._paddingRight.toString(this._host);
  4385. },
  4386. set: function (value) {
  4387. if (this._paddingRight.fromString(value)) {
  4388. this._markAsDirty();
  4389. }
  4390. },
  4391. enumerable: false,
  4392. configurable: true
  4393. });
  4394. Object.defineProperty(Control.prototype, "paddingRightInPixels", {
  4395. /**
  4396. * Gets or sets a value indicating the padding in pixels to use on the right of the control
  4397. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4398. */
  4399. get: function () {
  4400. return this._paddingRight.getValueInPixel(this._host, this._cachedParentMeasure.width);
  4401. },
  4402. set: function (value) {
  4403. if (isNaN(value)) {
  4404. return;
  4405. }
  4406. this.paddingRight = value + "px";
  4407. },
  4408. enumerable: false,
  4409. configurable: true
  4410. });
  4411. Object.defineProperty(Control.prototype, "paddingTop", {
  4412. /**
  4413. * Gets or sets a value indicating the padding to use on the top of the control
  4414. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4415. */
  4416. get: function () {
  4417. return this._paddingTop.toString(this._host);
  4418. },
  4419. set: function (value) {
  4420. if (this._paddingTop.fromString(value)) {
  4421. this._markAsDirty();
  4422. }
  4423. },
  4424. enumerable: false,
  4425. configurable: true
  4426. });
  4427. Object.defineProperty(Control.prototype, "paddingTopInPixels", {
  4428. /**
  4429. * Gets or sets a value indicating the padding in pixels to use on the top of the control
  4430. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4431. */
  4432. get: function () {
  4433. return this._paddingTop.getValueInPixel(this._host, this._cachedParentMeasure.height);
  4434. },
  4435. set: function (value) {
  4436. if (isNaN(value)) {
  4437. return;
  4438. }
  4439. this.paddingTop = value + "px";
  4440. },
  4441. enumerable: false,
  4442. configurable: true
  4443. });
  4444. Object.defineProperty(Control.prototype, "paddingBottom", {
  4445. /**
  4446. * Gets or sets a value indicating the padding to use on the bottom of the control
  4447. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4448. */
  4449. get: function () {
  4450. return this._paddingBottom.toString(this._host);
  4451. },
  4452. set: function (value) {
  4453. if (this._paddingBottom.fromString(value)) {
  4454. this._markAsDirty();
  4455. }
  4456. },
  4457. enumerable: false,
  4458. configurable: true
  4459. });
  4460. Object.defineProperty(Control.prototype, "paddingBottomInPixels", {
  4461. /**
  4462. * Gets or sets a value indicating the padding in pixels to use on the bottom of the control
  4463. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4464. */
  4465. get: function () {
  4466. return this._paddingBottom.getValueInPixel(this._host, this._cachedParentMeasure.height);
  4467. },
  4468. set: function (value) {
  4469. if (isNaN(value)) {
  4470. return;
  4471. }
  4472. this.paddingBottom = value + "px";
  4473. },
  4474. enumerable: false,
  4475. configurable: true
  4476. });
  4477. Object.defineProperty(Control.prototype, "left", {
  4478. /**
  4479. * Gets or sets a value indicating the left coordinate of the control
  4480. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4481. */
  4482. get: function () {
  4483. return this._left.toString(this._host);
  4484. },
  4485. set: function (value) {
  4486. if (this._left.fromString(value)) {
  4487. this._markAsDirty();
  4488. }
  4489. },
  4490. enumerable: false,
  4491. configurable: true
  4492. });
  4493. Object.defineProperty(Control.prototype, "leftInPixels", {
  4494. /**
  4495. * Gets or sets a value indicating the left coordinate in pixels of the control
  4496. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4497. */
  4498. get: function () {
  4499. return this._left.getValueInPixel(this._host, this._cachedParentMeasure.width);
  4500. },
  4501. set: function (value) {
  4502. if (isNaN(value)) {
  4503. return;
  4504. }
  4505. this.left = value + "px";
  4506. },
  4507. enumerable: false,
  4508. configurable: true
  4509. });
  4510. Object.defineProperty(Control.prototype, "top", {
  4511. /**
  4512. * Gets or sets a value indicating the top coordinate of the control
  4513. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4514. */
  4515. get: function () {
  4516. return this._top.toString(this._host);
  4517. },
  4518. set: function (value) {
  4519. if (this._top.fromString(value)) {
  4520. this._markAsDirty();
  4521. }
  4522. },
  4523. enumerable: false,
  4524. configurable: true
  4525. });
  4526. Object.defineProperty(Control.prototype, "topInPixels", {
  4527. /**
  4528. * Gets or sets a value indicating the top coordinate in pixels of the control
  4529. * @see https://doc.babylonjs.com/how_to/gui#position-and-size
  4530. */
  4531. get: function () {
  4532. return this._top.getValueInPixel(this._host, this._cachedParentMeasure.height);
  4533. },
  4534. set: function (value) {
  4535. if (isNaN(value)) {
  4536. return;
  4537. }
  4538. this.top = value + "px";
  4539. },
  4540. enumerable: false,
  4541. configurable: true
  4542. });
  4543. Object.defineProperty(Control.prototype, "linkOffsetX", {
  4544. /**
  4545. * Gets or sets a value indicating the offset on X axis to the linked mesh
  4546. * @see https://doc.babylonjs.com/how_to/gui#tracking-positions
  4547. */
  4548. get: function () {
  4549. return this._linkOffsetX.toString(this._host);
  4550. },
  4551. set: function (value) {
  4552. if (this._linkOffsetX.fromString(value)) {
  4553. this._markAsDirty();
  4554. }
  4555. },
  4556. enumerable: false,
  4557. configurable: true
  4558. });
  4559. Object.defineProperty(Control.prototype, "linkOffsetXInPixels", {
  4560. /**
  4561. * Gets or sets a value indicating the offset in pixels on X axis to the linked mesh
  4562. * @see https://doc.babylonjs.com/how_to/gui#tracking-positions
  4563. */
  4564. get: function () {
  4565. return this._linkOffsetX.getValueInPixel(this._host, this._cachedParentMeasure.width);
  4566. },
  4567. set: function (value) {
  4568. if (isNaN(value)) {
  4569. return;
  4570. }
  4571. this.linkOffsetX = value + "px";
  4572. },
  4573. enumerable: false,
  4574. configurable: true
  4575. });
  4576. Object.defineProperty(Control.prototype, "linkOffsetY", {
  4577. /**
  4578. * Gets or sets a value indicating the offset on Y axis to the linked mesh
  4579. * @see https://doc.babylonjs.com/how_to/gui#tracking-positions
  4580. */
  4581. get: function () {
  4582. return this._linkOffsetY.toString(this._host);
  4583. },
  4584. set: function (value) {
  4585. if (this._linkOffsetY.fromString(value)) {
  4586. this._markAsDirty();
  4587. }
  4588. },
  4589. enumerable: false,
  4590. configurable: true
  4591. });
  4592. Object.defineProperty(Control.prototype, "linkOffsetYInPixels", {
  4593. /**
  4594. * Gets or sets a value indicating the offset in pixels on Y axis to the linked mesh
  4595. * @see https://doc.babylonjs.com/how_to/gui#tracking-positions
  4596. */
  4597. get: function () {
  4598. return this._linkOffsetY.getValueInPixel(this._host, this._cachedParentMeasure.height);
  4599. },
  4600. set: function (value) {
  4601. if (isNaN(value)) {
  4602. return;
  4603. }
  4604. this.linkOffsetY = value + "px";
  4605. },
  4606. enumerable: false,
  4607. configurable: true
  4608. });
  4609. Object.defineProperty(Control.prototype, "centerX", {
  4610. /** Gets the center coordinate on X axis */
  4611. get: function () {
  4612. return this._currentMeasure.left + this._currentMeasure.width / 2;
  4613. },
  4614. enumerable: false,
  4615. configurable: true
  4616. });
  4617. Object.defineProperty(Control.prototype, "centerY", {
  4618. /** Gets the center coordinate on Y axis */
  4619. get: function () {
  4620. return this._currentMeasure.top + this._currentMeasure.height / 2;
  4621. },
  4622. enumerable: false,
  4623. configurable: true
  4624. });
  4625. Object.defineProperty(Control.prototype, "isEnabled", {
  4626. /** Gets or sets if control is Enabled*/
  4627. get: function () {
  4628. return this._isEnabled;
  4629. },
  4630. set: function (value) {
  4631. if (this._isEnabled === value) {
  4632. return;
  4633. }
  4634. this._isEnabled = value;
  4635. this._markAsDirty();
  4636. },
  4637. enumerable: false,
  4638. configurable: true
  4639. });
  4640. Object.defineProperty(Control.prototype, "disabledColor", {
  4641. /** Gets or sets background color of control if it's disabled*/
  4642. get: function () {
  4643. return this._disabledColor;
  4644. },
  4645. set: function (value) {
  4646. if (this._disabledColor === value) {
  4647. return;
  4648. }
  4649. this._disabledColor = value;
  4650. this._markAsDirty();
  4651. },
  4652. enumerable: false,
  4653. configurable: true
  4654. });
  4655. Object.defineProperty(Control.prototype, "disabledColorItem", {
  4656. /** Gets or sets front color of control if it's disabled*/
  4657. get: function () {
  4658. return this._disabledColorItem;
  4659. },
  4660. set: function (value) {
  4661. if (this._disabledColorItem === value) {
  4662. return;
  4663. }
  4664. this._disabledColorItem = value;
  4665. this._markAsDirty();
  4666. },
  4667. enumerable: false,
  4668. configurable: true
  4669. });
  4670. /** @hidden */
  4671. Control.prototype._getTypeName = function () {
  4672. return "Control";
  4673. };
  4674. /**
  4675. * Gets the first ascendant in the hierarchy of the given type
  4676. * @param className defines the required type
  4677. * @returns the ascendant or null if not found
  4678. */
  4679. Control.prototype.getAscendantOfClass = function (className) {
  4680. if (!this.parent) {
  4681. return null;
  4682. }
  4683. if (this.parent.getClassName() === className) {
  4684. return this.parent;
  4685. }
  4686. return this.parent.getAscendantOfClass(className);
  4687. };
  4688. /** @hidden */
  4689. Control.prototype._resetFontCache = function () {
  4690. this._fontSet = true;
  4691. this._markAsDirty();
  4692. };
  4693. /**
  4694. * Determines if a container is an ascendant of the current control
  4695. * @param container defines the container to look for
  4696. * @returns true if the container is one of the ascendant of the control
  4697. */
  4698. Control.prototype.isAscendant = function (container) {
  4699. if (!this.parent) {
  4700. return false;
  4701. }
  4702. if (this.parent === container) {
  4703. return true;
  4704. }
  4705. return this.parent.isAscendant(container);
  4706. };
  4707. /**
  4708. * Gets coordinates in local control space
  4709. * @param globalCoordinates defines the coordinates to transform
  4710. * @returns the new coordinates in local space
  4711. */
  4712. Control.prototype.getLocalCoordinates = function (globalCoordinates) {
  4713. var result = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Vector2"].Zero();
  4714. this.getLocalCoordinatesToRef(globalCoordinates, result);
  4715. return result;
  4716. };
  4717. /**
  4718. * Gets coordinates in local control space
  4719. * @param globalCoordinates defines the coordinates to transform
  4720. * @param result defines the target vector2 where to store the result
  4721. * @returns the current control
  4722. */
  4723. Control.prototype.getLocalCoordinatesToRef = function (globalCoordinates, result) {
  4724. result.x = globalCoordinates.x - this._currentMeasure.left;
  4725. result.y = globalCoordinates.y - this._currentMeasure.top;
  4726. return this;
  4727. };
  4728. /**
  4729. * Gets coordinates in parent local control space
  4730. * @param globalCoordinates defines the coordinates to transform
  4731. * @returns the new coordinates in parent local space
  4732. */
  4733. Control.prototype.getParentLocalCoordinates = function (globalCoordinates) {
  4734. var result = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Vector2"].Zero();
  4735. result.x = globalCoordinates.x - this._cachedParentMeasure.left;
  4736. result.y = globalCoordinates.y - this._cachedParentMeasure.top;
  4737. return result;
  4738. };
  4739. /**
  4740. * Move the current control to a vector3 position projected onto the screen.
  4741. * @param position defines the target position
  4742. * @param scene defines the hosting scene
  4743. */
  4744. Control.prototype.moveToVector3 = function (position, scene) {
  4745. if (!this._host || this.parent !== this._host._rootContainer) {
  4746. babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Tools"].Error("Cannot move a control to a vector3 if the control is not at root level");
  4747. return;
  4748. }
  4749. this.horizontalAlignment = Control.HORIZONTAL_ALIGNMENT_LEFT;
  4750. this.verticalAlignment = Control.VERTICAL_ALIGNMENT_TOP;
  4751. var globalViewport = this._host._getGlobalViewport(scene);
  4752. var projectedPosition = babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Vector3"].Project(position, babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Matrix"].Identity(), scene.getTransformMatrix(), globalViewport);
  4753. this._moveToProjectedPosition(projectedPosition);
  4754. if (projectedPosition.z < 0 || projectedPosition.z > 1) {
  4755. this.notRenderable = true;
  4756. return;
  4757. }
  4758. this.notRenderable = false;
  4759. };
  4760. /**
  4761. * Will store all controls that have this control as ascendant in a given array
  4762. * @param results defines the array where to store the descendants
  4763. * @param directDescendantsOnly defines if true only direct descendants of 'this' will be considered, if false direct and also indirect (children of children, an so on in a recursive manner) descendants of 'this' will be considered
  4764. * @param predicate defines an optional predicate that will be called on every evaluated child, the predicate must return true for a given child to be part of the result, otherwise it will be ignored
  4765. */
  4766. Control.prototype.getDescendantsToRef = function (results, directDescendantsOnly, predicate) {
  4767. if (directDescendantsOnly === void 0) { directDescendantsOnly = false; }
  4768. // Do nothing by default
  4769. };
  4770. /**
  4771. * Will return all controls that have this control as ascendant
  4772. * @param directDescendantsOnly defines if true only direct descendants of 'this' will be considered, if false direct and also indirect (children of children, an so on in a recursive manner) descendants of 'this' will be considered
  4773. * @param predicate defines an optional predicate that will be called on every evaluated child, the predicate must return true for a given child to be part of the result, otherwise it will be ignored
  4774. * @return all child controls
  4775. */
  4776. Control.prototype.getDescendants = function (directDescendantsOnly, predicate) {
  4777. var results = new Array();
  4778. this.getDescendantsToRef(results, directDescendantsOnly, predicate);
  4779. return results;
  4780. };
  4781. /**
  4782. * Link current control with a target mesh
  4783. * @param mesh defines the mesh to link with
  4784. * @see https://doc.babylonjs.com/how_to/gui#tracking-positions
  4785. */
  4786. Control.prototype.linkWithMesh = function (mesh) {
  4787. if (!this._host || this.parent && this.parent !== this._host._rootContainer) {
  4788. if (mesh) {
  4789. babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Tools"].Error("Cannot link a control to a mesh if the control is not at root level");
  4790. }
  4791. return;
  4792. }
  4793. var index = this._host._linkedControls.indexOf(this);
  4794. if (index !== -1) {
  4795. this._linkedMesh = mesh;
  4796. if (!mesh) {
  4797. this._host._linkedControls.splice(index, 1);
  4798. }
  4799. return;
  4800. }
  4801. else if (!mesh) {
  4802. return;
  4803. }
  4804. this.horizontalAlignment = Control.HORIZONTAL_ALIGNMENT_LEFT;
  4805. this.verticalAlignment = Control.VERTICAL_ALIGNMENT_TOP;
  4806. this._linkedMesh = mesh;
  4807. this._host._linkedControls.push(this);
  4808. };
  4809. /** @hidden */
  4810. Control.prototype._moveToProjectedPosition = function (projectedPosition) {
  4811. var oldLeft = this._left.getValue(this._host);
  4812. var oldTop = this._top.getValue(this._host);
  4813. var newLeft = ((projectedPosition.x + this._linkOffsetX.getValue(this._host)) - this._currentMeasure.width / 2);
  4814. var newTop = ((projectedPosition.y + this._linkOffsetY.getValue(this._host)) - this._currentMeasure.height / 2);
  4815. if (this._left.ignoreAdaptiveScaling && this._top.ignoreAdaptiveScaling) {
  4816. if (Math.abs(newLeft - oldLeft) < 0.5) {
  4817. newLeft = oldLeft;
  4818. }
  4819. if (Math.abs(newTop - oldTop) < 0.5) {
  4820. newTop = oldTop;
  4821. }
  4822. }
  4823. this.left = newLeft + "px";
  4824. this.top = newTop + "px";
  4825. this._left.ignoreAdaptiveScaling = true;
  4826. this._top.ignoreAdaptiveScaling = true;
  4827. this._markAsDirty();
  4828. };
  4829. /** @hidden */
  4830. Control.prototype._offsetLeft = function (offset) {
  4831. this._isDirty = true;
  4832. this._currentMeasure.left += offset;
  4833. };
  4834. /** @hidden */
  4835. Control.prototype._offsetTop = function (offset) {
  4836. this._isDirty = true;
  4837. this._currentMeasure.top += offset;
  4838. };
  4839. /** @hidden */
  4840. Control.prototype._markMatrixAsDirty = function () {
  4841. this._isMatrixDirty = true;
  4842. this._flagDescendantsAsMatrixDirty();
  4843. };
  4844. /** @hidden */
  4845. Control.prototype._flagDescendantsAsMatrixDirty = function () {
  4846. // No child
  4847. };
  4848. /** @hidden */
  4849. Control.prototype._intersectsRect = function (rect) {
  4850. // Rotate the control's current measure into local space and check if it intersects the passed in rectangle
  4851. this._currentMeasure.transformToRef(this._transformMatrix, this._tmpMeasureA);
  4852. if (this._tmpMeasureA.left >= rect.left + rect.width) {
  4853. return false;
  4854. }
  4855. if (this._tmpMeasureA.top >= rect.top + rect.height) {
  4856. return false;
  4857. }
  4858. if (this._tmpMeasureA.left + this._tmpMeasureA.width <= rect.left) {
  4859. return false;
  4860. }
  4861. if (this._tmpMeasureA.top + this._tmpMeasureA.height <= rect.top) {
  4862. return false;
  4863. }
  4864. return true;
  4865. };
  4866. /** @hidden */
  4867. Control.prototype.invalidateRect = function () {
  4868. this._transform();
  4869. if (this.host && this.host.useInvalidateRectOptimization) {
  4870. // Rotate by transform to get the measure transformed to global space
  4871. this._currentMeasure.transformToRef(this._transformMatrix, this._tmpMeasureA);
  4872. // get the boudning box of the current measure and last frames measure in global space and invalidate it
  4873. // the previous measure is used to properly clear a control that is scaled down
  4874. _measure__WEBPACK_IMPORTED_MODULE_2__["Measure"].CombineToRef(this._tmpMeasureA, this._prevCurrentMeasureTransformedIntoGlobalSpace, this._tmpMeasureA);
  4875. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  4876. // Expand rect based on shadows
  4877. var shadowOffsetX = this.shadowOffsetX;
  4878. var shadowOffsetY = this.shadowOffsetY;
  4879. var shadowBlur = this.shadowBlur;
  4880. var leftShadowOffset = Math.min(Math.min(shadowOffsetX, 0) - shadowBlur * 2, 0);
  4881. var rightShadowOffset = Math.max(Math.max(shadowOffsetX, 0) + shadowBlur * 2, 0);
  4882. var topShadowOffset = Math.min(Math.min(shadowOffsetY, 0) - shadowBlur * 2, 0);
  4883. var bottomShadowOffset = Math.max(Math.max(shadowOffsetY, 0) + shadowBlur * 2, 0);
  4884. this.host.invalidateRect(Math.floor(this._tmpMeasureA.left + leftShadowOffset), Math.floor(this._tmpMeasureA.top + topShadowOffset), Math.ceil(this._tmpMeasureA.left + this._tmpMeasureA.width + rightShadowOffset), Math.ceil(this._tmpMeasureA.top + this._tmpMeasureA.height + bottomShadowOffset));
  4885. }
  4886. else {
  4887. this.host.invalidateRect(Math.floor(this._tmpMeasureA.left), Math.floor(this._tmpMeasureA.top), Math.ceil(this._tmpMeasureA.left + this._tmpMeasureA.width), Math.ceil(this._tmpMeasureA.top + this._tmpMeasureA.height));
  4888. }
  4889. }
  4890. };
  4891. /** @hidden */
  4892. Control.prototype._markAsDirty = function (force) {
  4893. if (force === void 0) { force = false; }
  4894. if (!this._isVisible && !force) {
  4895. return;
  4896. }
  4897. this._isDirty = true;
  4898. // Redraw only this rectangle
  4899. if (this._host) {
  4900. this._host.markAsDirty();
  4901. }
  4902. };
  4903. /** @hidden */
  4904. Control.prototype._markAllAsDirty = function () {
  4905. this._markAsDirty();
  4906. if (this._font) {
  4907. this._prepareFont();
  4908. }
  4909. };
  4910. /** @hidden */
  4911. Control.prototype._link = function (host) {
  4912. this._host = host;
  4913. if (this._host) {
  4914. this.uniqueId = this._host.getScene().getUniqueId();
  4915. }
  4916. };
  4917. /** @hidden */
  4918. Control.prototype._transform = function (context) {
  4919. if (!this._isMatrixDirty && this._scaleX === 1 && this._scaleY === 1 && this._rotation === 0) {
  4920. return;
  4921. }
  4922. // postTranslate
  4923. var offsetX = this._currentMeasure.width * this._transformCenterX + this._currentMeasure.left;
  4924. var offsetY = this._currentMeasure.height * this._transformCenterY + this._currentMeasure.top;
  4925. if (context) {
  4926. context.translate(offsetX, offsetY);
  4927. // rotate
  4928. context.rotate(this._rotation);
  4929. // scale
  4930. context.scale(this._scaleX, this._scaleY);
  4931. // preTranslate
  4932. context.translate(-offsetX, -offsetY);
  4933. }
  4934. // Need to update matrices?
  4935. if (this._isMatrixDirty || this._cachedOffsetX !== offsetX || this._cachedOffsetY !== offsetY) {
  4936. this._cachedOffsetX = offsetX;
  4937. this._cachedOffsetY = offsetY;
  4938. this._isMatrixDirty = false;
  4939. this._flagDescendantsAsMatrixDirty();
  4940. _math2D__WEBPACK_IMPORTED_MODULE_3__["Matrix2D"].ComposeToRef(-offsetX, -offsetY, this._rotation, this._scaleX, this._scaleY, this.parent ? this.parent._transformMatrix : null, this._transformMatrix);
  4941. this._transformMatrix.invertToRef(this._invertTransformMatrix);
  4942. }
  4943. };
  4944. /** @hidden */
  4945. Control.prototype._renderHighlight = function (context) {
  4946. if (!this.isHighlighted) {
  4947. return;
  4948. }
  4949. context.save();
  4950. context.strokeStyle = "#4affff";
  4951. context.lineWidth = 2;
  4952. this._renderHighlightSpecific(context);
  4953. context.restore();
  4954. };
  4955. /** @hidden */
  4956. Control.prototype._renderHighlightSpecific = function (context) {
  4957. context.strokeRect(this._currentMeasure.left, this._currentMeasure.top, this._currentMeasure.width, this._currentMeasure.height);
  4958. };
  4959. /** @hidden */
  4960. Control.prototype._applyStates = function (context) {
  4961. if (this._isFontSizeInPercentage) {
  4962. this._fontSet = true;
  4963. }
  4964. if (this._fontSet) {
  4965. this._prepareFont();
  4966. this._fontSet = false;
  4967. }
  4968. if (this._font) {
  4969. context.font = this._font;
  4970. }
  4971. if (this._color) {
  4972. context.fillStyle = this._color;
  4973. }
  4974. if (Control.AllowAlphaInheritance) {
  4975. context.globalAlpha *= this._alpha;
  4976. }
  4977. else if (this._alphaSet) {
  4978. context.globalAlpha = this.parent ? this.parent.alpha * this._alpha : this._alpha;
  4979. }
  4980. };
  4981. /** @hidden */
  4982. Control.prototype._layout = function (parentMeasure, context) {
  4983. if (!this.isDirty && (!this.isVisible || this.notRenderable)) {
  4984. return false;
  4985. }
  4986. if (this._isDirty || !this._cachedParentMeasure.isEqualsTo(parentMeasure)) {
  4987. this.host._numLayoutCalls++;
  4988. this._currentMeasure.addAndTransformToRef(this._transformMatrix, -this.paddingLeftInPixels | 0, -this.paddingTopInPixels | 0, this.paddingRightInPixels | 0, this.paddingBottomInPixels | 0, this._prevCurrentMeasureTransformedIntoGlobalSpace);
  4989. context.save();
  4990. this._applyStates(context);
  4991. var rebuildCount = 0;
  4992. do {
  4993. this._rebuildLayout = false;
  4994. this._processMeasures(parentMeasure, context);
  4995. rebuildCount++;
  4996. } while (this._rebuildLayout && rebuildCount < 3);
  4997. if (rebuildCount >= 3) {
  4998. babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Logger"].Error("Layout cycle detected in GUI (Control name=" + this.name + ", uniqueId=" + this.uniqueId + ")");
  4999. }
  5000. context.restore();
  5001. this.invalidateRect();
  5002. this._evaluateClippingState(parentMeasure);
  5003. }
  5004. this._wasDirty = this._isDirty;
  5005. this._isDirty = false;
  5006. return true;
  5007. };
  5008. /** @hidden */
  5009. Control.prototype._processMeasures = function (parentMeasure, context) {
  5010. this._currentMeasure.copyFrom(parentMeasure);
  5011. // Let children take some pre-measurement actions
  5012. this._preMeasure(parentMeasure, context);
  5013. this._measure();
  5014. this._computeAlignment(parentMeasure, context);
  5015. // Convert to int values
  5016. this._currentMeasure.left = this._currentMeasure.left | 0;
  5017. this._currentMeasure.top = this._currentMeasure.top | 0;
  5018. this._currentMeasure.width = this._currentMeasure.width | 0;
  5019. this._currentMeasure.height = this._currentMeasure.height | 0;
  5020. // Let children add more features
  5021. this._additionalProcessing(parentMeasure, context);
  5022. this._cachedParentMeasure.copyFrom(parentMeasure);
  5023. if (this.onDirtyObservable.hasObservers()) {
  5024. this.onDirtyObservable.notifyObservers(this);
  5025. }
  5026. };
  5027. Control.prototype._evaluateClippingState = function (parentMeasure) {
  5028. if (this.parent && this.parent.clipChildren) {
  5029. // Early clip
  5030. if (this._currentMeasure.left > parentMeasure.left + parentMeasure.width) {
  5031. this._isClipped = true;
  5032. return;
  5033. }
  5034. if (this._currentMeasure.left + this._currentMeasure.width < parentMeasure.left) {
  5035. this._isClipped = true;
  5036. return;
  5037. }
  5038. if (this._currentMeasure.top > parentMeasure.top + parentMeasure.height) {
  5039. this._isClipped = true;
  5040. return;
  5041. }
  5042. if (this._currentMeasure.top + this._currentMeasure.height < parentMeasure.top) {
  5043. this._isClipped = true;
  5044. return;
  5045. }
  5046. }
  5047. this._isClipped = false;
  5048. };
  5049. /** @hidden */
  5050. Control.prototype._measure = function () {
  5051. // Width / Height
  5052. if (this._width.isPixel) {
  5053. this._currentMeasure.width = this._width.getValue(this._host);
  5054. }
  5055. else {
  5056. this._currentMeasure.width *= this._width.getValue(this._host);
  5057. }
  5058. if (this._height.isPixel) {
  5059. this._currentMeasure.height = this._height.getValue(this._host);
  5060. }
  5061. else {
  5062. this._currentMeasure.height *= this._height.getValue(this._host);
  5063. }
  5064. if (this.fixedRatio !== 0) {
  5065. if (this._fixedRatioMasterIsWidth) {
  5066. this._currentMeasure.height = this._currentMeasure.width * this.fixedRatio;
  5067. }
  5068. else {
  5069. this._currentMeasure.width = this._currentMeasure.height * this.fixedRatio;
  5070. }
  5071. }
  5072. };
  5073. /** @hidden */
  5074. Control.prototype._computeAlignment = function (parentMeasure, context) {
  5075. var width = this._currentMeasure.width;
  5076. var height = this._currentMeasure.height;
  5077. var parentWidth = parentMeasure.width;
  5078. var parentHeight = parentMeasure.height;
  5079. // Left / top
  5080. var x = 0;
  5081. var y = 0;
  5082. switch (this.horizontalAlignment) {
  5083. case Control.HORIZONTAL_ALIGNMENT_LEFT:
  5084. x = 0;
  5085. break;
  5086. case Control.HORIZONTAL_ALIGNMENT_RIGHT:
  5087. x = parentWidth - width;
  5088. break;
  5089. case Control.HORIZONTAL_ALIGNMENT_CENTER:
  5090. x = (parentWidth - width) / 2;
  5091. break;
  5092. }
  5093. switch (this.verticalAlignment) {
  5094. case Control.VERTICAL_ALIGNMENT_TOP:
  5095. y = 0;
  5096. break;
  5097. case Control.VERTICAL_ALIGNMENT_BOTTOM:
  5098. y = parentHeight - height;
  5099. break;
  5100. case Control.VERTICAL_ALIGNMENT_CENTER:
  5101. y = (parentHeight - height) / 2;
  5102. break;
  5103. }
  5104. if (this._paddingLeft.isPixel) {
  5105. this._currentMeasure.left += this._paddingLeft.getValue(this._host);
  5106. this._currentMeasure.width -= this._paddingLeft.getValue(this._host);
  5107. }
  5108. else {
  5109. this._currentMeasure.left += parentWidth * this._paddingLeft.getValue(this._host);
  5110. this._currentMeasure.width -= parentWidth * this._paddingLeft.getValue(this._host);
  5111. }
  5112. if (this._paddingRight.isPixel) {
  5113. this._currentMeasure.width -= this._paddingRight.getValue(this._host);
  5114. }
  5115. else {
  5116. this._currentMeasure.width -= parentWidth * this._paddingRight.getValue(this._host);
  5117. }
  5118. if (this._paddingTop.isPixel) {
  5119. this._currentMeasure.top += this._paddingTop.getValue(this._host);
  5120. this._currentMeasure.height -= this._paddingTop.getValue(this._host);
  5121. }
  5122. else {
  5123. this._currentMeasure.top += parentHeight * this._paddingTop.getValue(this._host);
  5124. this._currentMeasure.height -= parentHeight * this._paddingTop.getValue(this._host);
  5125. }
  5126. if (this._paddingBottom.isPixel) {
  5127. this._currentMeasure.height -= this._paddingBottom.getValue(this._host);
  5128. }
  5129. else {
  5130. this._currentMeasure.height -= parentHeight * this._paddingBottom.getValue(this._host);
  5131. }
  5132. if (this._left.isPixel) {
  5133. this._currentMeasure.left += this._left.getValue(this._host);
  5134. }
  5135. else {
  5136. this._currentMeasure.left += parentWidth * this._left.getValue(this._host);
  5137. }
  5138. if (this._top.isPixel) {
  5139. this._currentMeasure.top += this._top.getValue(this._host);
  5140. }
  5141. else {
  5142. this._currentMeasure.top += parentHeight * this._top.getValue(this._host);
  5143. }
  5144. this._currentMeasure.left += x;
  5145. this._currentMeasure.top += y;
  5146. };
  5147. /** @hidden */
  5148. Control.prototype._preMeasure = function (parentMeasure, context) {
  5149. // Do nothing
  5150. };
  5151. /** @hidden */
  5152. Control.prototype._additionalProcessing = function (parentMeasure, context) {
  5153. // Do nothing
  5154. };
  5155. /** @hidden */
  5156. Control.prototype._clipForChildren = function (context) {
  5157. // DO nothing
  5158. };
  5159. Control.prototype._clip = function (context, invalidatedRectangle) {
  5160. context.beginPath();
  5161. Control._ClipMeasure.copyFrom(this._currentMeasure);
  5162. if (invalidatedRectangle) {
  5163. // Rotate the invalidated rect into the control's space
  5164. invalidatedRectangle.transformToRef(this._invertTransformMatrix, this._tmpMeasureA);
  5165. // Get the intersection of the rect in context space and the current context
  5166. var intersection = new _measure__WEBPACK_IMPORTED_MODULE_2__["Measure"](0, 0, 0, 0);
  5167. intersection.left = Math.max(this._tmpMeasureA.left, this._currentMeasure.left);
  5168. intersection.top = Math.max(this._tmpMeasureA.top, this._currentMeasure.top);
  5169. intersection.width = Math.min(this._tmpMeasureA.left + this._tmpMeasureA.width, this._currentMeasure.left + this._currentMeasure.width) - intersection.left;
  5170. intersection.height = Math.min(this._tmpMeasureA.top + this._tmpMeasureA.height, this._currentMeasure.top + this._currentMeasure.height) - intersection.top;
  5171. Control._ClipMeasure.copyFrom(intersection);
  5172. }
  5173. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  5174. var shadowOffsetX = this.shadowOffsetX;
  5175. var shadowOffsetY = this.shadowOffsetY;
  5176. var shadowBlur = this.shadowBlur;
  5177. var leftShadowOffset = Math.min(Math.min(shadowOffsetX, 0) - shadowBlur * 2, 0);
  5178. var rightShadowOffset = Math.max(Math.max(shadowOffsetX, 0) + shadowBlur * 2, 0);
  5179. var topShadowOffset = Math.min(Math.min(shadowOffsetY, 0) - shadowBlur * 2, 0);
  5180. var bottomShadowOffset = Math.max(Math.max(shadowOffsetY, 0) + shadowBlur * 2, 0);
  5181. context.rect(Control._ClipMeasure.left + leftShadowOffset, Control._ClipMeasure.top + topShadowOffset, Control._ClipMeasure.width + rightShadowOffset - leftShadowOffset, Control._ClipMeasure.height + bottomShadowOffset - topShadowOffset);
  5182. }
  5183. else {
  5184. context.rect(Control._ClipMeasure.left, Control._ClipMeasure.top, Control._ClipMeasure.width, Control._ClipMeasure.height);
  5185. }
  5186. context.clip();
  5187. };
  5188. /** @hidden */
  5189. Control.prototype._render = function (context, invalidatedRectangle) {
  5190. if (!this.isVisible || this.notRenderable || this._isClipped) {
  5191. this._isDirty = false;
  5192. return false;
  5193. }
  5194. this.host._numRenderCalls++;
  5195. context.save();
  5196. this._applyStates(context);
  5197. // Transform
  5198. this._transform(context);
  5199. // Clip
  5200. if (this.clipContent) {
  5201. this._clip(context, invalidatedRectangle);
  5202. }
  5203. if (this.onBeforeDrawObservable.hasObservers()) {
  5204. this.onBeforeDrawObservable.notifyObservers(this);
  5205. }
  5206. if (this.useBitmapCache && !this._wasDirty && this._cacheData) {
  5207. context.putImageData(this._cacheData, this._currentMeasure.left, this._currentMeasure.top);
  5208. }
  5209. else {
  5210. this._draw(context, invalidatedRectangle);
  5211. }
  5212. if (this.useBitmapCache && this._wasDirty) {
  5213. this._cacheData = context.getImageData(this._currentMeasure.left, this._currentMeasure.top, this._currentMeasure.width, this._currentMeasure.height);
  5214. }
  5215. this._renderHighlight(context);
  5216. if (this.onAfterDrawObservable.hasObservers()) {
  5217. this.onAfterDrawObservable.notifyObservers(this);
  5218. }
  5219. context.restore();
  5220. return true;
  5221. };
  5222. /** @hidden */
  5223. Control.prototype._draw = function (context, invalidatedRectangle) {
  5224. // Do nothing
  5225. };
  5226. /**
  5227. * Tests if a given coordinates belong to the current control
  5228. * @param x defines x coordinate to test
  5229. * @param y defines y coordinate to test
  5230. * @returns true if the coordinates are inside the control
  5231. */
  5232. Control.prototype.contains = function (x, y) {
  5233. // Invert transform
  5234. this._invertTransformMatrix.transformCoordinates(x, y, this._transformedPosition);
  5235. x = this._transformedPosition.x;
  5236. y = this._transformedPosition.y;
  5237. // Check
  5238. if (x < this._currentMeasure.left) {
  5239. return false;
  5240. }
  5241. if (x > this._currentMeasure.left + this._currentMeasure.width) {
  5242. return false;
  5243. }
  5244. if (y < this._currentMeasure.top) {
  5245. return false;
  5246. }
  5247. if (y > this._currentMeasure.top + this._currentMeasure.height) {
  5248. return false;
  5249. }
  5250. if (this.isPointerBlocker) {
  5251. this._host._shouldBlockPointer = true;
  5252. }
  5253. return true;
  5254. };
  5255. /** @hidden */
  5256. Control.prototype._processPicking = function (x, y, type, pointerId, buttonIndex, deltaX, deltaY) {
  5257. if (!this._isEnabled) {
  5258. return false;
  5259. }
  5260. if (!this.isHitTestVisible || !this.isVisible || this._doNotRender) {
  5261. return false;
  5262. }
  5263. if (!this.contains(x, y)) {
  5264. return false;
  5265. }
  5266. this._processObservables(type, x, y, pointerId, buttonIndex, deltaX, deltaY);
  5267. return true;
  5268. };
  5269. /** @hidden */
  5270. Control.prototype._onPointerMove = function (target, coordinates, pointerId) {
  5271. var canNotify = this.onPointerMoveObservable.notifyObservers(coordinates, -1, target, this);
  5272. if (canNotify && this.parent != null) {
  5273. this.parent._onPointerMove(target, coordinates, pointerId);
  5274. }
  5275. };
  5276. /** @hidden */
  5277. Control.prototype._onPointerEnter = function (target) {
  5278. if (!this._isEnabled) {
  5279. return false;
  5280. }
  5281. if (this._enterCount > 0) {
  5282. return false;
  5283. }
  5284. if (this._enterCount === -1) { // -1 is for touch input, we are now sure we are with a mouse or pencil
  5285. this._enterCount = 0;
  5286. }
  5287. this._enterCount++;
  5288. var canNotify = this.onPointerEnterObservable.notifyObservers(this, -1, target, this);
  5289. if (canNotify && this.parent != null) {
  5290. this.parent._onPointerEnter(target);
  5291. }
  5292. return true;
  5293. };
  5294. /** @hidden */
  5295. Control.prototype._onPointerOut = function (target, force) {
  5296. if (force === void 0) { force = false; }
  5297. if (!force && (!this._isEnabled || target === this)) {
  5298. return;
  5299. }
  5300. this._enterCount = 0;
  5301. var canNotify = true;
  5302. if (!target.isAscendant(this)) {
  5303. canNotify = this.onPointerOutObservable.notifyObservers(this, -1, target, this);
  5304. }
  5305. if (canNotify && this.parent != null) {
  5306. this.parent._onPointerOut(target, force);
  5307. }
  5308. };
  5309. /** @hidden */
  5310. Control.prototype._onPointerDown = function (target, coordinates, pointerId, buttonIndex) {
  5311. // Prevent pointerout to lose control context.
  5312. // Event redundancy is checked inside the function.
  5313. this._onPointerEnter(this);
  5314. if (this._downCount !== 0) {
  5315. return false;
  5316. }
  5317. this._downCount++;
  5318. this._downPointerIds[pointerId] = true;
  5319. var canNotify = this.onPointerDownObservable.notifyObservers(new _math2D__WEBPACK_IMPORTED_MODULE_3__["Vector2WithInfo"](coordinates, buttonIndex), -1, target, this);
  5320. if (canNotify && this.parent != null) {
  5321. this.parent._onPointerDown(target, coordinates, pointerId, buttonIndex);
  5322. }
  5323. return true;
  5324. };
  5325. /** @hidden */
  5326. Control.prototype._onPointerUp = function (target, coordinates, pointerId, buttonIndex, notifyClick) {
  5327. if (!this._isEnabled) {
  5328. return;
  5329. }
  5330. this._downCount = 0;
  5331. delete this._downPointerIds[pointerId];
  5332. var canNotifyClick = notifyClick;
  5333. if (notifyClick && (this._enterCount > 0 || this._enterCount === -1)) {
  5334. canNotifyClick = this.onPointerClickObservable.notifyObservers(new _math2D__WEBPACK_IMPORTED_MODULE_3__["Vector2WithInfo"](coordinates, buttonIndex), -1, target, this);
  5335. }
  5336. var canNotify = this.onPointerUpObservable.notifyObservers(new _math2D__WEBPACK_IMPORTED_MODULE_3__["Vector2WithInfo"](coordinates, buttonIndex), -1, target, this);
  5337. if (canNotify && this.parent != null) {
  5338. this.parent._onPointerUp(target, coordinates, pointerId, buttonIndex, canNotifyClick);
  5339. }
  5340. };
  5341. /** @hidden */
  5342. Control.prototype._forcePointerUp = function (pointerId) {
  5343. if (pointerId === void 0) { pointerId = null; }
  5344. if (pointerId !== null) {
  5345. this._onPointerUp(this, babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Vector2"].Zero(), pointerId, 0, true);
  5346. }
  5347. else {
  5348. for (var key in this._downPointerIds) {
  5349. this._onPointerUp(this, babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Vector2"].Zero(), +key, 0, true);
  5350. }
  5351. }
  5352. };
  5353. /** @hidden */
  5354. Control.prototype._onWheelScroll = function (deltaX, deltaY) {
  5355. if (!this._isEnabled) {
  5356. return;
  5357. }
  5358. var canNotify = this.onWheelObservable.notifyObservers(new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Vector2"](deltaX, deltaY));
  5359. if (canNotify && this.parent != null) {
  5360. this.parent._onWheelScroll(deltaX, deltaY);
  5361. }
  5362. };
  5363. /** @hidden */
  5364. Control.prototype._onCanvasBlur = function () { };
  5365. /** @hidden */
  5366. Control.prototype._processObservables = function (type, x, y, pointerId, buttonIndex, deltaX, deltaY) {
  5367. if (!this._isEnabled) {
  5368. return false;
  5369. }
  5370. this._dummyVector2.copyFromFloats(x, y);
  5371. if (type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["PointerEventTypes"].POINTERMOVE) {
  5372. this._onPointerMove(this, this._dummyVector2, pointerId);
  5373. var previousControlOver = this._host._lastControlOver[pointerId];
  5374. if (previousControlOver && previousControlOver !== this) {
  5375. previousControlOver._onPointerOut(this);
  5376. }
  5377. if (previousControlOver !== this) {
  5378. this._onPointerEnter(this);
  5379. }
  5380. this._host._lastControlOver[pointerId] = this;
  5381. return true;
  5382. }
  5383. if (type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["PointerEventTypes"].POINTERDOWN) {
  5384. this._onPointerDown(this, this._dummyVector2, pointerId, buttonIndex);
  5385. this._host._registerLastControlDown(this, pointerId);
  5386. this._host._lastPickedControl = this;
  5387. return true;
  5388. }
  5389. if (type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["PointerEventTypes"].POINTERUP) {
  5390. if (this._host._lastControlDown[pointerId]) {
  5391. this._host._lastControlDown[pointerId]._onPointerUp(this, this._dummyVector2, pointerId, buttonIndex, true);
  5392. }
  5393. delete this._host._lastControlDown[pointerId];
  5394. return true;
  5395. }
  5396. if (type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["PointerEventTypes"].POINTERWHEEL) {
  5397. if (this._host._lastControlOver[pointerId]) {
  5398. this._host._lastControlOver[pointerId]._onWheelScroll(deltaX, deltaY);
  5399. return true;
  5400. }
  5401. }
  5402. return false;
  5403. };
  5404. Control.prototype._prepareFont = function () {
  5405. if (!this._font && !this._fontSet) {
  5406. return;
  5407. }
  5408. if (this._style) {
  5409. this._font = this._style.fontStyle + " " + this._style.fontWeight + " " + this.fontSizeInPixels + "px " + this._style.fontFamily;
  5410. }
  5411. else {
  5412. this._font = this._fontStyle + " " + this._fontWeight + " " + this.fontSizeInPixels + "px " + this._fontFamily;
  5413. }
  5414. this._fontOffset = Control._GetFontOffset(this._font);
  5415. };
  5416. /** Releases associated resources */
  5417. Control.prototype.dispose = function () {
  5418. this.onDirtyObservable.clear();
  5419. this.onBeforeDrawObservable.clear();
  5420. this.onAfterDrawObservable.clear();
  5421. this.onPointerDownObservable.clear();
  5422. this.onPointerEnterObservable.clear();
  5423. this.onPointerMoveObservable.clear();
  5424. this.onPointerOutObservable.clear();
  5425. this.onPointerUpObservable.clear();
  5426. this.onPointerClickObservable.clear();
  5427. this.onWheelObservable.clear();
  5428. if (this._styleObserver && this._style) {
  5429. this._style.onChangedObservable.remove(this._styleObserver);
  5430. this._styleObserver = null;
  5431. }
  5432. if (this.parent) {
  5433. this.parent.removeControl(this);
  5434. this.parent = null;
  5435. }
  5436. if (this._host) {
  5437. var index = this._host._linkedControls.indexOf(this);
  5438. if (index > -1) {
  5439. this.linkWithMesh(null);
  5440. }
  5441. }
  5442. // Callback
  5443. this.onDisposeObservable.notifyObservers(this);
  5444. this.onDisposeObservable.clear();
  5445. };
  5446. Object.defineProperty(Control, "HORIZONTAL_ALIGNMENT_LEFT", {
  5447. /** HORIZONTAL_ALIGNMENT_LEFT */
  5448. get: function () {
  5449. return Control._HORIZONTAL_ALIGNMENT_LEFT;
  5450. },
  5451. enumerable: false,
  5452. configurable: true
  5453. });
  5454. Object.defineProperty(Control, "HORIZONTAL_ALIGNMENT_RIGHT", {
  5455. /** HORIZONTAL_ALIGNMENT_RIGHT */
  5456. get: function () {
  5457. return Control._HORIZONTAL_ALIGNMENT_RIGHT;
  5458. },
  5459. enumerable: false,
  5460. configurable: true
  5461. });
  5462. Object.defineProperty(Control, "HORIZONTAL_ALIGNMENT_CENTER", {
  5463. /** HORIZONTAL_ALIGNMENT_CENTER */
  5464. get: function () {
  5465. return Control._HORIZONTAL_ALIGNMENT_CENTER;
  5466. },
  5467. enumerable: false,
  5468. configurable: true
  5469. });
  5470. Object.defineProperty(Control, "VERTICAL_ALIGNMENT_TOP", {
  5471. /** VERTICAL_ALIGNMENT_TOP */
  5472. get: function () {
  5473. return Control._VERTICAL_ALIGNMENT_TOP;
  5474. },
  5475. enumerable: false,
  5476. configurable: true
  5477. });
  5478. Object.defineProperty(Control, "VERTICAL_ALIGNMENT_BOTTOM", {
  5479. /** VERTICAL_ALIGNMENT_BOTTOM */
  5480. get: function () {
  5481. return Control._VERTICAL_ALIGNMENT_BOTTOM;
  5482. },
  5483. enumerable: false,
  5484. configurable: true
  5485. });
  5486. Object.defineProperty(Control, "VERTICAL_ALIGNMENT_CENTER", {
  5487. /** VERTICAL_ALIGNMENT_CENTER */
  5488. get: function () {
  5489. return Control._VERTICAL_ALIGNMENT_CENTER;
  5490. },
  5491. enumerable: false,
  5492. configurable: true
  5493. });
  5494. /** @hidden */
  5495. Control._GetFontOffset = function (font) {
  5496. if (Control._FontHeightSizes[font]) {
  5497. return Control._FontHeightSizes[font];
  5498. }
  5499. var text = document.createElement("span");
  5500. text.innerHTML = "Hg";
  5501. text.style.font = font;
  5502. var block = document.createElement("div");
  5503. block.style.display = "inline-block";
  5504. block.style.width = "1px";
  5505. block.style.height = "0px";
  5506. block.style.verticalAlign = "bottom";
  5507. var div = document.createElement("div");
  5508. div.appendChild(text);
  5509. div.appendChild(block);
  5510. document.body.appendChild(div);
  5511. var fontAscent = 0;
  5512. var fontHeight = 0;
  5513. try {
  5514. fontHeight = block.getBoundingClientRect().top - text.getBoundingClientRect().top;
  5515. block.style.verticalAlign = "baseline";
  5516. fontAscent = block.getBoundingClientRect().top - text.getBoundingClientRect().top;
  5517. }
  5518. finally {
  5519. document.body.removeChild(div);
  5520. }
  5521. var result = { ascent: fontAscent, height: fontHeight, descent: fontHeight - fontAscent };
  5522. Control._FontHeightSizes[font] = result;
  5523. return result;
  5524. };
  5525. /** @hidden */
  5526. Control.drawEllipse = function (x, y, width, height, context) {
  5527. context.translate(x, y);
  5528. context.scale(width, height);
  5529. context.beginPath();
  5530. context.arc(0, 0, 1, 0, 2 * Math.PI);
  5531. context.closePath();
  5532. context.scale(1 / width, 1 / height);
  5533. context.translate(-x, -y);
  5534. };
  5535. /**
  5536. * Gets or sets a boolean indicating if alpha must be an inherited value (false by default)
  5537. */
  5538. Control.AllowAlphaInheritance = false;
  5539. Control._ClipMeasure = new _measure__WEBPACK_IMPORTED_MODULE_2__["Measure"](0, 0, 0, 0);
  5540. // Statics
  5541. Control._HORIZONTAL_ALIGNMENT_LEFT = 0;
  5542. Control._HORIZONTAL_ALIGNMENT_RIGHT = 1;
  5543. Control._HORIZONTAL_ALIGNMENT_CENTER = 2;
  5544. Control._VERTICAL_ALIGNMENT_TOP = 0;
  5545. Control._VERTICAL_ALIGNMENT_BOTTOM = 1;
  5546. Control._VERTICAL_ALIGNMENT_CENTER = 2;
  5547. Control._FontHeightSizes = {};
  5548. /**
  5549. * Creates a stack panel that can be used to render headers
  5550. * @param control defines the control to associate with the header
  5551. * @param text defines the text of the header
  5552. * @param size defines the size of the header
  5553. * @param options defines options used to configure the header
  5554. * @returns a new StackPanel
  5555. * @ignore
  5556. * @hidden
  5557. */
  5558. Control.AddHeader = function () { };
  5559. return Control;
  5560. }());
  5561. babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["_TypeStore"].RegisteredTypes["BABYLON.GUI.Control"] = Control;
  5562. /***/ }),
  5563. /***/ "./2D/controls/displayGrid.ts":
  5564. /*!************************************!*\
  5565. !*** ./2D/controls/displayGrid.ts ***!
  5566. \************************************/
  5567. /*! exports provided: DisplayGrid */
  5568. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  5569. "use strict";
  5570. __webpack_require__.r(__webpack_exports__);
  5571. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "DisplayGrid", function() { return DisplayGrid; });
  5572. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  5573. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  5574. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math.vector");
  5575. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__);
  5576. /** Class used to render a grid */
  5577. var DisplayGrid = /** @class */ (function (_super) {
  5578. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(DisplayGrid, _super);
  5579. /**
  5580. * Creates a new GridDisplayRectangle
  5581. * @param name defines the control name
  5582. */
  5583. function DisplayGrid(name) {
  5584. var _this = _super.call(this, name) || this;
  5585. _this.name = name;
  5586. _this._cellWidth = 20;
  5587. _this._cellHeight = 20;
  5588. _this._minorLineTickness = 1;
  5589. _this._minorLineColor = "DarkGray";
  5590. _this._majorLineTickness = 2;
  5591. _this._majorLineColor = "White";
  5592. _this._majorLineFrequency = 5;
  5593. _this._background = "Black";
  5594. _this._displayMajorLines = true;
  5595. _this._displayMinorLines = true;
  5596. return _this;
  5597. }
  5598. Object.defineProperty(DisplayGrid.prototype, "displayMinorLines", {
  5599. /** Gets or sets a boolean indicating if minor lines must be rendered (true by default)) */
  5600. get: function () {
  5601. return this._displayMinorLines;
  5602. },
  5603. set: function (value) {
  5604. if (this._displayMinorLines === value) {
  5605. return;
  5606. }
  5607. this._displayMinorLines = value;
  5608. this._markAsDirty();
  5609. },
  5610. enumerable: false,
  5611. configurable: true
  5612. });
  5613. Object.defineProperty(DisplayGrid.prototype, "displayMajorLines", {
  5614. /** Gets or sets a boolean indicating if major lines must be rendered (true by default)) */
  5615. get: function () {
  5616. return this._displayMajorLines;
  5617. },
  5618. set: function (value) {
  5619. if (this._displayMajorLines === value) {
  5620. return;
  5621. }
  5622. this._displayMajorLines = value;
  5623. this._markAsDirty();
  5624. },
  5625. enumerable: false,
  5626. configurable: true
  5627. });
  5628. Object.defineProperty(DisplayGrid.prototype, "background", {
  5629. /** Gets or sets background color (Black by default) */
  5630. get: function () {
  5631. return this._background;
  5632. },
  5633. set: function (value) {
  5634. if (this._background === value) {
  5635. return;
  5636. }
  5637. this._background = value;
  5638. this._markAsDirty();
  5639. },
  5640. enumerable: false,
  5641. configurable: true
  5642. });
  5643. Object.defineProperty(DisplayGrid.prototype, "cellWidth", {
  5644. /** Gets or sets the width of each cell (20 by default) */
  5645. get: function () {
  5646. return this._cellWidth;
  5647. },
  5648. set: function (value) {
  5649. this._cellWidth = value;
  5650. this._markAsDirty();
  5651. },
  5652. enumerable: false,
  5653. configurable: true
  5654. });
  5655. Object.defineProperty(DisplayGrid.prototype, "cellHeight", {
  5656. /** Gets or sets the height of each cell (20 by default) */
  5657. get: function () {
  5658. return this._cellHeight;
  5659. },
  5660. set: function (value) {
  5661. this._cellHeight = value;
  5662. this._markAsDirty();
  5663. },
  5664. enumerable: false,
  5665. configurable: true
  5666. });
  5667. Object.defineProperty(DisplayGrid.prototype, "minorLineTickness", {
  5668. /** Gets or sets the tickness of minor lines (1 by default) */
  5669. get: function () {
  5670. return this._minorLineTickness;
  5671. },
  5672. set: function (value) {
  5673. this._minorLineTickness = value;
  5674. this._markAsDirty();
  5675. },
  5676. enumerable: false,
  5677. configurable: true
  5678. });
  5679. Object.defineProperty(DisplayGrid.prototype, "minorLineColor", {
  5680. /** Gets or sets the color of minor lines (DarkGray by default) */
  5681. get: function () {
  5682. return this._minorLineColor;
  5683. },
  5684. set: function (value) {
  5685. this._minorLineColor = value;
  5686. this._markAsDirty();
  5687. },
  5688. enumerable: false,
  5689. configurable: true
  5690. });
  5691. Object.defineProperty(DisplayGrid.prototype, "majorLineTickness", {
  5692. /** Gets or sets the tickness of major lines (2 by default) */
  5693. get: function () {
  5694. return this._majorLineTickness;
  5695. },
  5696. set: function (value) {
  5697. this._majorLineTickness = value;
  5698. this._markAsDirty();
  5699. },
  5700. enumerable: false,
  5701. configurable: true
  5702. });
  5703. Object.defineProperty(DisplayGrid.prototype, "majorLineColor", {
  5704. /** Gets or sets the color of major lines (White by default) */
  5705. get: function () {
  5706. return this._majorLineColor;
  5707. },
  5708. set: function (value) {
  5709. this._majorLineColor = value;
  5710. this._markAsDirty();
  5711. },
  5712. enumerable: false,
  5713. configurable: true
  5714. });
  5715. Object.defineProperty(DisplayGrid.prototype, "majorLineFrequency", {
  5716. /** Gets or sets the frequency of major lines (default is 1 every 5 minor lines)*/
  5717. get: function () {
  5718. return this._majorLineFrequency;
  5719. },
  5720. set: function (value) {
  5721. this._majorLineFrequency = value;
  5722. this._markAsDirty();
  5723. },
  5724. enumerable: false,
  5725. configurable: true
  5726. });
  5727. DisplayGrid.prototype._draw = function (context, invalidatedRectangle) {
  5728. context.save();
  5729. this._applyStates(context);
  5730. if (this._isEnabled) {
  5731. if (this._background) {
  5732. context.fillStyle = this._background;
  5733. context.fillRect(this._currentMeasure.left, this._currentMeasure.top, this._currentMeasure.width, this._currentMeasure.height);
  5734. }
  5735. var cellCountX = this._currentMeasure.width / this._cellWidth;
  5736. var cellCountY = this._currentMeasure.height / this._cellHeight;
  5737. // Minor lines
  5738. var left = this._currentMeasure.left + this._currentMeasure.width / 2;
  5739. var top_1 = this._currentMeasure.top + this._currentMeasure.height / 2;
  5740. if (this._displayMinorLines) {
  5741. context.strokeStyle = this._minorLineColor;
  5742. context.lineWidth = this._minorLineTickness;
  5743. for (var x = -cellCountX / 2; x < cellCountX / 2; x++) {
  5744. var cellX = left + x * this.cellWidth;
  5745. context.beginPath();
  5746. context.moveTo(cellX, this._currentMeasure.top);
  5747. context.lineTo(cellX, this._currentMeasure.top + this._currentMeasure.height);
  5748. context.stroke();
  5749. }
  5750. for (var y = -cellCountY / 2; y < cellCountY / 2; y++) {
  5751. var cellY = top_1 + y * this.cellHeight;
  5752. context.beginPath();
  5753. context.moveTo(this._currentMeasure.left, cellY);
  5754. context.lineTo(this._currentMeasure.left + this._currentMeasure.width, cellY);
  5755. context.stroke();
  5756. }
  5757. }
  5758. // Major lines
  5759. if (this._displayMajorLines) {
  5760. context.strokeStyle = this._majorLineColor;
  5761. context.lineWidth = this._majorLineTickness;
  5762. for (var x = -cellCountX / 2 + this._majorLineFrequency; x < cellCountX / 2; x += this._majorLineFrequency) {
  5763. var cellX = left + x * this.cellWidth;
  5764. context.beginPath();
  5765. context.moveTo(cellX, this._currentMeasure.top);
  5766. context.lineTo(cellX, this._currentMeasure.top + this._currentMeasure.height);
  5767. context.stroke();
  5768. }
  5769. for (var y = -cellCountY / 2 + this._majorLineFrequency; y < cellCountY / 2; y += this._majorLineFrequency) {
  5770. var cellY = top_1 + y * this.cellHeight;
  5771. context.moveTo(this._currentMeasure.left, cellY);
  5772. context.lineTo(this._currentMeasure.left + this._currentMeasure.width, cellY);
  5773. context.closePath();
  5774. context.stroke();
  5775. }
  5776. }
  5777. }
  5778. context.restore();
  5779. };
  5780. DisplayGrid.prototype._getTypeName = function () {
  5781. return "DisplayGrid";
  5782. };
  5783. return DisplayGrid;
  5784. }(_control__WEBPACK_IMPORTED_MODULE_1__["Control"]));
  5785. babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__["_TypeStore"].RegisteredTypes["BABYLON.GUI.DisplayGrid"] = DisplayGrid;
  5786. /***/ }),
  5787. /***/ "./2D/controls/ellipse.ts":
  5788. /*!********************************!*\
  5789. !*** ./2D/controls/ellipse.ts ***!
  5790. \********************************/
  5791. /*! exports provided: Ellipse */
  5792. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  5793. "use strict";
  5794. __webpack_require__.r(__webpack_exports__);
  5795. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Ellipse", function() { return Ellipse; });
  5796. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  5797. /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./container */ "./2D/controls/container.ts");
  5798. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  5799. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math.vector");
  5800. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3__);
  5801. /** Class used to create 2D ellipse containers */
  5802. var Ellipse = /** @class */ (function (_super) {
  5803. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(Ellipse, _super);
  5804. /**
  5805. * Creates a new Ellipse
  5806. * @param name defines the control name
  5807. */
  5808. function Ellipse(name) {
  5809. var _this = _super.call(this, name) || this;
  5810. _this.name = name;
  5811. _this._thickness = 1;
  5812. return _this;
  5813. }
  5814. Object.defineProperty(Ellipse.prototype, "thickness", {
  5815. /** Gets or sets border thickness */
  5816. get: function () {
  5817. return this._thickness;
  5818. },
  5819. set: function (value) {
  5820. if (this._thickness === value) {
  5821. return;
  5822. }
  5823. this._thickness = value;
  5824. this._markAsDirty();
  5825. },
  5826. enumerable: false,
  5827. configurable: true
  5828. });
  5829. Ellipse.prototype._getTypeName = function () {
  5830. return "Ellipse";
  5831. };
  5832. Ellipse.prototype._localDraw = function (context) {
  5833. context.save();
  5834. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  5835. context.shadowColor = this.shadowColor;
  5836. context.shadowBlur = this.shadowBlur;
  5837. context.shadowOffsetX = this.shadowOffsetX;
  5838. context.shadowOffsetY = this.shadowOffsetY;
  5839. }
  5840. _control__WEBPACK_IMPORTED_MODULE_2__["Control"].drawEllipse(this._currentMeasure.left + this._currentMeasure.width / 2, this._currentMeasure.top + this._currentMeasure.height / 2, this._currentMeasure.width / 2 - this._thickness / 2, this._currentMeasure.height / 2 - this._thickness / 2, context);
  5841. if (this._background) {
  5842. context.fillStyle = this._background;
  5843. context.fill();
  5844. }
  5845. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  5846. context.shadowBlur = 0;
  5847. context.shadowOffsetX = 0;
  5848. context.shadowOffsetY = 0;
  5849. }
  5850. if (this._thickness) {
  5851. if (this.color) {
  5852. context.strokeStyle = this.color;
  5853. }
  5854. context.lineWidth = this._thickness;
  5855. context.stroke();
  5856. }
  5857. context.restore();
  5858. };
  5859. Ellipse.prototype._additionalProcessing = function (parentMeasure, context) {
  5860. _super.prototype._additionalProcessing.call(this, parentMeasure, context);
  5861. this._measureForChildren.width -= 2 * this._thickness;
  5862. this._measureForChildren.height -= 2 * this._thickness;
  5863. this._measureForChildren.left += this._thickness;
  5864. this._measureForChildren.top += this._thickness;
  5865. };
  5866. Ellipse.prototype._clipForChildren = function (context) {
  5867. _control__WEBPACK_IMPORTED_MODULE_2__["Control"].drawEllipse(this._currentMeasure.left + this._currentMeasure.width / 2, this._currentMeasure.top + this._currentMeasure.height / 2, this._currentMeasure.width / 2, this._currentMeasure.height / 2, context);
  5868. context.clip();
  5869. };
  5870. return Ellipse;
  5871. }(_container__WEBPACK_IMPORTED_MODULE_1__["Container"]));
  5872. babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3__["_TypeStore"].RegisteredTypes["BABYLON.GUI.Ellipse"] = Ellipse;
  5873. /***/ }),
  5874. /***/ "./2D/controls/grid.ts":
  5875. /*!*****************************!*\
  5876. !*** ./2D/controls/grid.ts ***!
  5877. \*****************************/
  5878. /*! exports provided: Grid */
  5879. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  5880. "use strict";
  5881. __webpack_require__.r(__webpack_exports__);
  5882. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Grid", function() { return Grid; });
  5883. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  5884. /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./container */ "./2D/controls/container.ts");
  5885. /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
  5886. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  5887. /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Maths/math.vector");
  5888. /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4__);
  5889. /**
  5890. * Class used to create a 2D grid container
  5891. */
  5892. var Grid = /** @class */ (function (_super) {
  5893. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(Grid, _super);
  5894. /**
  5895. * Creates a new Grid
  5896. * @param name defines control name
  5897. */
  5898. function Grid(name) {
  5899. var _this = _super.call(this, name) || this;
  5900. _this.name = name;
  5901. _this._rowDefinitions = new Array();
  5902. _this._columnDefinitions = new Array();
  5903. _this._cells = {};
  5904. _this._childControls = new Array();
  5905. return _this;
  5906. }
  5907. Object.defineProperty(Grid.prototype, "columnCount", {
  5908. /**
  5909. * Gets the number of columns
  5910. */
  5911. get: function () {
  5912. return this._columnDefinitions.length;
  5913. },
  5914. enumerable: false,
  5915. configurable: true
  5916. });
  5917. Object.defineProperty(Grid.prototype, "rowCount", {
  5918. /**
  5919. * Gets the number of rows
  5920. */
  5921. get: function () {
  5922. return this._rowDefinitions.length;
  5923. },
  5924. enumerable: false,
  5925. configurable: true
  5926. });
  5927. Object.defineProperty(Grid.prototype, "children", {
  5928. /** Gets the list of children */
  5929. get: function () {
  5930. return this._childControls;
  5931. },
  5932. enumerable: false,
  5933. configurable: true
  5934. });
  5935. Object.defineProperty(Grid.prototype, "cells", {
  5936. /** Gets the list of cells (e.g. the containers) */
  5937. get: function () {
  5938. return this._cells;
  5939. },
  5940. enumerable: false,
  5941. configurable: true
  5942. });
  5943. /**
  5944. * Gets the definition of a specific row
  5945. * @param index defines the index of the row
  5946. * @returns the row definition
  5947. */
  5948. Grid.prototype.getRowDefinition = function (index) {
  5949. if (index < 0 || index >= this._rowDefinitions.length) {
  5950. return null;
  5951. }
  5952. return this._rowDefinitions[index];
  5953. };
  5954. /**
  5955. * Gets the definition of a specific column
  5956. * @param index defines the index of the column
  5957. * @returns the column definition
  5958. */
  5959. Grid.prototype.getColumnDefinition = function (index) {
  5960. if (index < 0 || index >= this._columnDefinitions.length) {
  5961. return null;
  5962. }
  5963. return this._columnDefinitions[index];
  5964. };
  5965. /**
  5966. * Adds a new row to the grid
  5967. * @param height defines the height of the row (either in pixel or a value between 0 and 1)
  5968. * @param isPixel defines if the height is expressed in pixel (or in percentage)
  5969. * @returns the current grid
  5970. */
  5971. Grid.prototype.addRowDefinition = function (height, isPixel) {
  5972. if (isPixel === void 0) { isPixel = false; }
  5973. this._rowDefinitions.push(new _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__["ValueAndUnit"](height, isPixel ? _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__["ValueAndUnit"].UNITMODE_PIXEL : _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__["ValueAndUnit"].UNITMODE_PERCENTAGE));
  5974. this._markAsDirty();
  5975. return this;
  5976. };
  5977. /**
  5978. * Adds a new column to the grid
  5979. * @param width defines the width of the column (either in pixel or a value between 0 and 1)
  5980. * @param isPixel defines if the width is expressed in pixel (or in percentage)
  5981. * @returns the current grid
  5982. */
  5983. Grid.prototype.addColumnDefinition = function (width, isPixel) {
  5984. if (isPixel === void 0) { isPixel = false; }
  5985. this._columnDefinitions.push(new _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__["ValueAndUnit"](width, isPixel ? _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__["ValueAndUnit"].UNITMODE_PIXEL : _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__["ValueAndUnit"].UNITMODE_PERCENTAGE));
  5986. this._markAsDirty();
  5987. return this;
  5988. };
  5989. /**
  5990. * Update a row definition
  5991. * @param index defines the index of the row to update
  5992. * @param height defines the height of the row (either in pixel or a value between 0 and 1)
  5993. * @param isPixel defines if the weight is expressed in pixel (or in percentage)
  5994. * @returns the current grid
  5995. */
  5996. Grid.prototype.setRowDefinition = function (index, height, isPixel) {
  5997. if (isPixel === void 0) { isPixel = false; }
  5998. if (index < 0 || index >= this._rowDefinitions.length) {
  5999. return this;
  6000. }
  6001. var current = this._rowDefinitions[index];
  6002. if (current && current.isPixel === isPixel && current.internalValue === height) {
  6003. return this;
  6004. }
  6005. this._rowDefinitions[index] = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__["ValueAndUnit"](height, isPixel ? _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__["ValueAndUnit"].UNITMODE_PIXEL : _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__["ValueAndUnit"].UNITMODE_PERCENTAGE);
  6006. this._markAsDirty();
  6007. return this;
  6008. };
  6009. /**
  6010. * Update a column definition
  6011. * @param index defines the index of the column to update
  6012. * @param width defines the width of the column (either in pixel or a value between 0 and 1)
  6013. * @param isPixel defines if the width is expressed in pixel (or in percentage)
  6014. * @returns the current grid
  6015. */
  6016. Grid.prototype.setColumnDefinition = function (index, width, isPixel) {
  6017. if (isPixel === void 0) { isPixel = false; }
  6018. if (index < 0 || index >= this._columnDefinitions.length) {
  6019. return this;
  6020. }
  6021. var current = this._columnDefinitions[index];
  6022. if (current && current.isPixel === isPixel && current.internalValue === width) {
  6023. return this;
  6024. }
  6025. this._columnDefinitions[index] = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__["ValueAndUnit"](width, isPixel ? _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__["ValueAndUnit"].UNITMODE_PIXEL : _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__["ValueAndUnit"].UNITMODE_PERCENTAGE);
  6026. this._markAsDirty();
  6027. return this;
  6028. };
  6029. /**
  6030. * Gets the list of children stored in a specific cell
  6031. * @param row defines the row to check
  6032. * @param column defines the column to check
  6033. * @returns the list of controls
  6034. */
  6035. Grid.prototype.getChildrenAt = function (row, column) {
  6036. var cell = this._cells[row + ":" + column];
  6037. if (!cell) {
  6038. return null;
  6039. }
  6040. return cell.children;
  6041. };
  6042. /**
  6043. * Gets a string representing the child cell info (row x column)
  6044. * @param child defines the control to get info from
  6045. * @returns a string containing the child cell info (row x column)
  6046. */
  6047. Grid.prototype.getChildCellInfo = function (child) {
  6048. return child._tag;
  6049. };
  6050. Grid.prototype._removeCell = function (cell, key) {
  6051. if (!cell) {
  6052. return;
  6053. }
  6054. _super.prototype.removeControl.call(this, cell);
  6055. for (var _i = 0, _a = cell.children; _i < _a.length; _i++) {
  6056. var control = _a[_i];
  6057. var childIndex = this._childControls.indexOf(control);
  6058. if (childIndex !== -1) {
  6059. this._childControls.splice(childIndex, 1);
  6060. }
  6061. }
  6062. delete this._cells[key];
  6063. };
  6064. Grid.prototype._offsetCell = function (previousKey, key) {
  6065. if (!this._cells[key]) {
  6066. return;
  6067. }
  6068. this._cells[previousKey] = this._cells[key];
  6069. for (var _i = 0, _a = this._cells[previousKey].children; _i < _a.length; _i++) {
  6070. var control = _a[_i];
  6071. control._tag = previousKey;
  6072. }
  6073. delete this._cells[key];
  6074. };
  6075. /**
  6076. * Remove a column definition at specified index
  6077. * @param index defines the index of the column to remove
  6078. * @returns the current grid
  6079. */
  6080. Grid.prototype.removeColumnDefinition = function (index) {
  6081. if (index < 0 || index >= this._columnDefinitions.length) {
  6082. return this;
  6083. }
  6084. for (var x = 0; x < this._rowDefinitions.length; x++) {
  6085. var key = x + ":" + index;
  6086. var cell = this._cells[key];
  6087. this._removeCell(cell, key);
  6088. }
  6089. for (var x = 0; x < this._rowDefinitions.length; x++) {
  6090. for (var y = index + 1; y < this._columnDefinitions.length; y++) {
  6091. var previousKey = x + ":" + (y - 1);
  6092. var key = x + ":" + y;
  6093. this._offsetCell(previousKey, key);
  6094. }
  6095. }
  6096. this._columnDefinitions.splice(index, 1);
  6097. this._markAsDirty();
  6098. return this;
  6099. };
  6100. /**
  6101. * Remove a row definition at specified index
  6102. * @param index defines the index of the row to remove
  6103. * @returns the current grid
  6104. */
  6105. Grid.prototype.removeRowDefinition = function (index) {
  6106. if (index < 0 || index >= this._rowDefinitions.length) {
  6107. return this;
  6108. }
  6109. for (var y = 0; y < this._columnDefinitions.length; y++) {
  6110. var key = index + ":" + y;
  6111. var cell = this._cells[key];
  6112. this._removeCell(cell, key);
  6113. }
  6114. for (var y = 0; y < this._columnDefinitions.length; y++) {
  6115. for (var x = index + 1; x < this._rowDefinitions.length; x++) {
  6116. var previousKey = x - 1 + ":" + y;
  6117. var key = x + ":" + y;
  6118. this._offsetCell(previousKey, key);
  6119. }
  6120. }
  6121. this._rowDefinitions.splice(index, 1);
  6122. this._markAsDirty();
  6123. return this;
  6124. };
  6125. /**
  6126. * Adds a new control to the current grid
  6127. * @param control defines the control to add
  6128. * @param row defines the row where to add the control (0 by default)
  6129. * @param column defines the column where to add the control (0 by default)
  6130. * @returns the current grid
  6131. */
  6132. Grid.prototype.addControl = function (control, row, column) {
  6133. if (row === void 0) { row = 0; }
  6134. if (column === void 0) { column = 0; }
  6135. if (this._rowDefinitions.length === 0) {
  6136. // Add default row definition
  6137. this.addRowDefinition(1, false);
  6138. }
  6139. if (this._columnDefinitions.length === 0) {
  6140. // Add default column definition
  6141. this.addColumnDefinition(1, false);
  6142. }
  6143. if (this._childControls.indexOf(control) !== -1) {
  6144. babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4__["Tools"].Warn("Control (Name:" + control.name + ", UniqueId:" + control.uniqueId + ") is already associated with this grid. You must remove it before reattaching it");
  6145. return this;
  6146. }
  6147. var x = Math.min(row, this._rowDefinitions.length - 1);
  6148. var y = Math.min(column, this._columnDefinitions.length - 1);
  6149. var key = x + ":" + y;
  6150. var goodContainer = this._cells[key];
  6151. if (!goodContainer) {
  6152. goodContainer = new _container__WEBPACK_IMPORTED_MODULE_1__["Container"](key);
  6153. this._cells[key] = goodContainer;
  6154. goodContainer.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  6155. goodContainer.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].VERTICAL_ALIGNMENT_TOP;
  6156. _super.prototype.addControl.call(this, goodContainer);
  6157. }
  6158. goodContainer.addControl(control);
  6159. this._childControls.push(control);
  6160. control._tag = key;
  6161. control.parent = this;
  6162. this._markAsDirty();
  6163. return this;
  6164. };
  6165. /**
  6166. * Removes a control from the current container
  6167. * @param control defines the control to remove
  6168. * @returns the current container
  6169. */
  6170. Grid.prototype.removeControl = function (control) {
  6171. var index = this._childControls.indexOf(control);
  6172. if (index !== -1) {
  6173. this._childControls.splice(index, 1);
  6174. }
  6175. var cell = this._cells[control._tag];
  6176. if (cell) {
  6177. cell.removeControl(control);
  6178. control._tag = null;
  6179. }
  6180. this._markAsDirty();
  6181. return this;
  6182. };
  6183. Grid.prototype._getTypeName = function () {
  6184. return "Grid";
  6185. };
  6186. Grid.prototype._getGridDefinitions = function (definitionCallback) {
  6187. var widths = [];
  6188. var heights = [];
  6189. var lefts = [];
  6190. var tops = [];
  6191. var availableWidth = this._currentMeasure.width;
  6192. var globalWidthPercentage = 0;
  6193. var availableHeight = this._currentMeasure.height;
  6194. var globalHeightPercentage = 0;
  6195. // Heights
  6196. var index = 0;
  6197. for (var _i = 0, _a = this._rowDefinitions; _i < _a.length; _i++) {
  6198. var value = _a[_i];
  6199. if (value.isPixel) {
  6200. var height = value.getValue(this._host);
  6201. availableHeight -= height;
  6202. heights[index] = height;
  6203. }
  6204. else {
  6205. globalHeightPercentage += value.internalValue;
  6206. }
  6207. index++;
  6208. }
  6209. var top = 0;
  6210. index = 0;
  6211. for (var _b = 0, _c = this._rowDefinitions; _b < _c.length; _b++) {
  6212. var value = _c[_b];
  6213. tops.push(top);
  6214. if (!value.isPixel) {
  6215. var height = (value.internalValue / globalHeightPercentage) * availableHeight;
  6216. top += height;
  6217. heights[index] = height;
  6218. }
  6219. else {
  6220. top += value.getValue(this._host);
  6221. }
  6222. index++;
  6223. }
  6224. // Widths
  6225. index = 0;
  6226. for (var _d = 0, _e = this._columnDefinitions; _d < _e.length; _d++) {
  6227. var value = _e[_d];
  6228. if (value.isPixel) {
  6229. var width = value.getValue(this._host);
  6230. availableWidth -= width;
  6231. widths[index] = width;
  6232. }
  6233. else {
  6234. globalWidthPercentage += value.internalValue;
  6235. }
  6236. index++;
  6237. }
  6238. var left = 0;
  6239. index = 0;
  6240. for (var _f = 0, _g = this._columnDefinitions; _f < _g.length; _f++) {
  6241. var value = _g[_f];
  6242. lefts.push(left);
  6243. if (!value.isPixel) {
  6244. var width = (value.internalValue / globalWidthPercentage) * availableWidth;
  6245. left += width;
  6246. widths[index] = width;
  6247. }
  6248. else {
  6249. left += value.getValue(this._host);
  6250. }
  6251. index++;
  6252. }
  6253. definitionCallback(lefts, tops, widths, heights);
  6254. };
  6255. Grid.prototype._additionalProcessing = function (parentMeasure, context) {
  6256. var _this = this;
  6257. this._getGridDefinitions(function (lefts, tops, widths, heights) {
  6258. // Setting child sizes
  6259. for (var key in _this._cells) {
  6260. if (!_this._cells.hasOwnProperty(key)) {
  6261. continue;
  6262. }
  6263. var split = key.split(":");
  6264. var x = parseInt(split[0]);
  6265. var y = parseInt(split[1]);
  6266. var cell = _this._cells[key];
  6267. cell.left = lefts[y] + "px";
  6268. cell.top = tops[x] + "px";
  6269. cell.width = widths[y] + "px";
  6270. cell.height = heights[x] + "px";
  6271. cell._left.ignoreAdaptiveScaling = true;
  6272. cell._top.ignoreAdaptiveScaling = true;
  6273. cell._width.ignoreAdaptiveScaling = true;
  6274. cell._height.ignoreAdaptiveScaling = true;
  6275. }
  6276. });
  6277. _super.prototype._additionalProcessing.call(this, parentMeasure, context);
  6278. };
  6279. Grid.prototype._flagDescendantsAsMatrixDirty = function () {
  6280. for (var key in this._cells) {
  6281. if (!this._cells.hasOwnProperty(key)) {
  6282. continue;
  6283. }
  6284. var child = this._cells[key];
  6285. child._markMatrixAsDirty();
  6286. }
  6287. };
  6288. Grid.prototype._renderHighlightSpecific = function (context) {
  6289. var _this = this;
  6290. _super.prototype._renderHighlightSpecific.call(this, context);
  6291. this._getGridDefinitions(function (lefts, tops, widths, heights) {
  6292. // Columns
  6293. for (var index = 0; index < lefts.length; index++) {
  6294. var left = _this._currentMeasure.left + lefts[index] + widths[index];
  6295. context.beginPath();
  6296. context.moveTo(left, _this._currentMeasure.top);
  6297. context.lineTo(left, _this._currentMeasure.top + _this._currentMeasure.height);
  6298. context.stroke();
  6299. }
  6300. // Rows
  6301. for (var index = 0; index < tops.length; index++) {
  6302. var top_1 = _this._currentMeasure.top + tops[index] + heights[index];
  6303. context.beginPath();
  6304. context.moveTo(_this._currentMeasure.left, top_1);
  6305. context.lineTo(_this._currentMeasure.left + _this._currentMeasure.width, top_1);
  6306. context.stroke();
  6307. }
  6308. });
  6309. context.restore();
  6310. };
  6311. /** Releases associated resources */
  6312. Grid.prototype.dispose = function () {
  6313. _super.prototype.dispose.call(this);
  6314. for (var _i = 0, _a = this._childControls; _i < _a.length; _i++) {
  6315. var control = _a[_i];
  6316. control.dispose();
  6317. }
  6318. this._childControls = [];
  6319. };
  6320. return Grid;
  6321. }(_container__WEBPACK_IMPORTED_MODULE_1__["Container"]));
  6322. babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4__["_TypeStore"].RegisteredTypes["BABYLON.GUI.Grid"] = Grid;
  6323. /***/ }),
  6324. /***/ "./2D/controls/image.ts":
  6325. /*!******************************!*\
  6326. !*** ./2D/controls/image.ts ***!
  6327. \******************************/
  6328. /*! exports provided: Image */
  6329. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  6330. "use strict";
  6331. __webpack_require__.r(__webpack_exports__);
  6332. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Image", function() { return Image; });
  6333. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  6334. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math.vector");
  6335. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
  6336. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  6337. /**
  6338. * Class used to create 2D images
  6339. */
  6340. var Image = /** @class */ (function (_super) {
  6341. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(Image, _super);
  6342. /**
  6343. * Creates a new Image
  6344. * @param name defines the control name
  6345. * @param url defines the image url
  6346. */
  6347. function Image(name, url) {
  6348. if (url === void 0) { url = null; }
  6349. var _this = _super.call(this, name) || this;
  6350. _this.name = name;
  6351. _this._workingCanvas = null;
  6352. _this._loaded = false;
  6353. _this._stretch = Image.STRETCH_FILL;
  6354. _this._autoScale = false;
  6355. _this._sourceLeft = 0;
  6356. _this._sourceTop = 0;
  6357. _this._sourceWidth = 0;
  6358. _this._sourceHeight = 0;
  6359. _this._svgAttributesComputationCompleted = false;
  6360. _this._isSVG = false;
  6361. _this._cellWidth = 0;
  6362. _this._cellHeight = 0;
  6363. _this._cellId = -1;
  6364. _this._populateNinePatchSlicesFromImage = false;
  6365. _this._imageDataCache = { data: null, key: "" };
  6366. /**
  6367. * Observable notified when the content is loaded
  6368. */
  6369. _this.onImageLoadedObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  6370. /**
  6371. * Observable notified when _sourceLeft, _sourceTop, _sourceWidth and _sourceHeight are computed
  6372. */
  6373. _this.onSVGAttributesComputedObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  6374. _this.source = url;
  6375. return _this;
  6376. }
  6377. Object.defineProperty(Image.prototype, "isLoaded", {
  6378. /**
  6379. * Gets a boolean indicating that the content is loaded
  6380. */
  6381. get: function () {
  6382. return this._loaded;
  6383. },
  6384. enumerable: false,
  6385. configurable: true
  6386. });
  6387. Object.defineProperty(Image.prototype, "populateNinePatchSlicesFromImage", {
  6388. /**
  6389. * Gets or sets a boolean indicating if nine patch slices (left, top, right, bottom) should be read from image data
  6390. */
  6391. get: function () {
  6392. return this._populateNinePatchSlicesFromImage;
  6393. },
  6394. set: function (value) {
  6395. if (this._populateNinePatchSlicesFromImage === value) {
  6396. return;
  6397. }
  6398. this._populateNinePatchSlicesFromImage = value;
  6399. if (this._populateNinePatchSlicesFromImage && this._loaded) {
  6400. this._extractNinePatchSliceDataFromImage();
  6401. }
  6402. },
  6403. enumerable: false,
  6404. configurable: true
  6405. });
  6406. Object.defineProperty(Image.prototype, "detectPointerOnOpaqueOnly", {
  6407. /**
  6408. * Gets or sets a boolean indicating if pointers should only be validated on pixels with alpha > 0.
  6409. * Beware using this as this will comsume more memory as the image has to be stored twice
  6410. */
  6411. get: function () {
  6412. return this._detectPointerOnOpaqueOnly;
  6413. },
  6414. set: function (value) {
  6415. if (this._detectPointerOnOpaqueOnly === value) {
  6416. return;
  6417. }
  6418. this._detectPointerOnOpaqueOnly = value;
  6419. },
  6420. enumerable: false,
  6421. configurable: true
  6422. });
  6423. Object.defineProperty(Image.prototype, "sliceLeft", {
  6424. /**
  6425. * Gets or sets the left value for slicing (9-patch)
  6426. */
  6427. get: function () {
  6428. return this._sliceLeft;
  6429. },
  6430. set: function (value) {
  6431. if (this._sliceLeft === value) {
  6432. return;
  6433. }
  6434. this._sliceLeft = value;
  6435. this._markAsDirty();
  6436. },
  6437. enumerable: false,
  6438. configurable: true
  6439. });
  6440. Object.defineProperty(Image.prototype, "sliceRight", {
  6441. /**
  6442. * Gets or sets the right value for slicing (9-patch)
  6443. */
  6444. get: function () {
  6445. return this._sliceRight;
  6446. },
  6447. set: function (value) {
  6448. if (this._sliceRight === value) {
  6449. return;
  6450. }
  6451. this._sliceRight = value;
  6452. this._markAsDirty();
  6453. },
  6454. enumerable: false,
  6455. configurable: true
  6456. });
  6457. Object.defineProperty(Image.prototype, "sliceTop", {
  6458. /**
  6459. * Gets or sets the top value for slicing (9-patch)
  6460. */
  6461. get: function () {
  6462. return this._sliceTop;
  6463. },
  6464. set: function (value) {
  6465. if (this._sliceTop === value) {
  6466. return;
  6467. }
  6468. this._sliceTop = value;
  6469. this._markAsDirty();
  6470. },
  6471. enumerable: false,
  6472. configurable: true
  6473. });
  6474. Object.defineProperty(Image.prototype, "sliceBottom", {
  6475. /**
  6476. * Gets or sets the bottom value for slicing (9-patch)
  6477. */
  6478. get: function () {
  6479. return this._sliceBottom;
  6480. },
  6481. set: function (value) {
  6482. if (this._sliceBottom === value) {
  6483. return;
  6484. }
  6485. this._sliceBottom = value;
  6486. this._markAsDirty();
  6487. },
  6488. enumerable: false,
  6489. configurable: true
  6490. });
  6491. Object.defineProperty(Image.prototype, "sourceLeft", {
  6492. /**
  6493. * Gets or sets the left coordinate in the source image
  6494. */
  6495. get: function () {
  6496. return this._sourceLeft;
  6497. },
  6498. set: function (value) {
  6499. if (this._sourceLeft === value) {
  6500. return;
  6501. }
  6502. this._sourceLeft = value;
  6503. this._markAsDirty();
  6504. },
  6505. enumerable: false,
  6506. configurable: true
  6507. });
  6508. Object.defineProperty(Image.prototype, "sourceTop", {
  6509. /**
  6510. * Gets or sets the top coordinate in the source image
  6511. */
  6512. get: function () {
  6513. return this._sourceTop;
  6514. },
  6515. set: function (value) {
  6516. if (this._sourceTop === value) {
  6517. return;
  6518. }
  6519. this._sourceTop = value;
  6520. this._markAsDirty();
  6521. },
  6522. enumerable: false,
  6523. configurable: true
  6524. });
  6525. Object.defineProperty(Image.prototype, "sourceWidth", {
  6526. /**
  6527. * Gets or sets the width to capture in the source image
  6528. */
  6529. get: function () {
  6530. return this._sourceWidth;
  6531. },
  6532. set: function (value) {
  6533. if (this._sourceWidth === value) {
  6534. return;
  6535. }
  6536. this._sourceWidth = value;
  6537. this._markAsDirty();
  6538. },
  6539. enumerable: false,
  6540. configurable: true
  6541. });
  6542. Object.defineProperty(Image.prototype, "sourceHeight", {
  6543. /**
  6544. * Gets or sets the height to capture in the source image
  6545. */
  6546. get: function () {
  6547. return this._sourceHeight;
  6548. },
  6549. set: function (value) {
  6550. if (this._sourceHeight === value) {
  6551. return;
  6552. }
  6553. this._sourceHeight = value;
  6554. this._markAsDirty();
  6555. },
  6556. enumerable: false,
  6557. configurable: true
  6558. });
  6559. Object.defineProperty(Image.prototype, "isSVG", {
  6560. /** Indicates if the format of the image is SVG */
  6561. get: function () {
  6562. return this._isSVG;
  6563. },
  6564. enumerable: false,
  6565. configurable: true
  6566. });
  6567. Object.defineProperty(Image.prototype, "svgAttributesComputationCompleted", {
  6568. /** Gets the status of the SVG attributes computation (sourceLeft, sourceTop, sourceWidth, sourceHeight) */
  6569. get: function () {
  6570. return this._svgAttributesComputationCompleted;
  6571. },
  6572. enumerable: false,
  6573. configurable: true
  6574. });
  6575. Object.defineProperty(Image.prototype, "autoScale", {
  6576. /**
  6577. * Gets or sets a boolean indicating if the image can force its container to adapt its size
  6578. * @see https://doc.babylonjs.com/how_to/gui#image
  6579. */
  6580. get: function () {
  6581. return this._autoScale;
  6582. },
  6583. set: function (value) {
  6584. if (this._autoScale === value) {
  6585. return;
  6586. }
  6587. this._autoScale = value;
  6588. if (value && this._loaded) {
  6589. this.synchronizeSizeWithContent();
  6590. }
  6591. },
  6592. enumerable: false,
  6593. configurable: true
  6594. });
  6595. Object.defineProperty(Image.prototype, "stretch", {
  6596. /** Gets or sets the streching mode used by the image */
  6597. get: function () {
  6598. return this._stretch;
  6599. },
  6600. set: function (value) {
  6601. if (this._stretch === value) {
  6602. return;
  6603. }
  6604. this._stretch = value;
  6605. this._markAsDirty();
  6606. },
  6607. enumerable: false,
  6608. configurable: true
  6609. });
  6610. /** @hidden */
  6611. Image.prototype._rotate90 = function (n, preserveProperties) {
  6612. if (preserveProperties === void 0) { preserveProperties = false; }
  6613. var canvas = document.createElement('canvas');
  6614. var context = canvas.getContext('2d');
  6615. var width = this._domImage.width;
  6616. var height = this._domImage.height;
  6617. canvas.width = height;
  6618. canvas.height = width;
  6619. context.translate(canvas.width / 2, canvas.height / 2);
  6620. context.rotate(n * Math.PI / 2);
  6621. context.drawImage(this._domImage, 0, 0, width, height, -width / 2, -height / 2, width, height);
  6622. var dataUrl = canvas.toDataURL("image/jpg");
  6623. var rotatedImage = new Image(this.name + "rotated", dataUrl);
  6624. if (preserveProperties) {
  6625. rotatedImage._stretch = this._stretch;
  6626. rotatedImage._autoScale = this._autoScale;
  6627. rotatedImage._cellId = this._cellId;
  6628. rotatedImage._cellWidth = n % 1 ? this._cellHeight : this._cellWidth;
  6629. rotatedImage._cellHeight = n % 1 ? this._cellWidth : this._cellHeight;
  6630. }
  6631. this._handleRotationForSVGImage(this, rotatedImage, n);
  6632. this._imageDataCache.data = null;
  6633. return rotatedImage;
  6634. };
  6635. Image.prototype._handleRotationForSVGImage = function (srcImage, dstImage, n) {
  6636. var _this = this;
  6637. if (!srcImage._isSVG) {
  6638. return;
  6639. }
  6640. if (srcImage._svgAttributesComputationCompleted) {
  6641. this._rotate90SourceProperties(srcImage, dstImage, n);
  6642. this._markAsDirty();
  6643. }
  6644. else {
  6645. srcImage.onSVGAttributesComputedObservable.addOnce(function () {
  6646. _this._rotate90SourceProperties(srcImage, dstImage, n);
  6647. _this._markAsDirty();
  6648. });
  6649. }
  6650. };
  6651. Image.prototype._rotate90SourceProperties = function (srcImage, dstImage, n) {
  6652. var _a, _b;
  6653. var srcLeft = srcImage.sourceLeft, srcTop = srcImage.sourceTop, srcWidth = srcImage.domImage.width, srcHeight = srcImage.domImage.height;
  6654. var dstLeft = srcLeft, dstTop = srcTop, dstWidth = srcImage.sourceWidth, dstHeight = srcImage.sourceHeight;
  6655. if (n != 0) {
  6656. var mult = n < 0 ? -1 : 1;
  6657. n = n % 4;
  6658. for (var i = 0; i < Math.abs(n); ++i) {
  6659. dstLeft = -(srcTop - srcHeight / 2) * mult + srcHeight / 2;
  6660. dstTop = (srcLeft - srcWidth / 2) * mult + srcWidth / 2;
  6661. _a = [dstHeight, dstWidth], dstWidth = _a[0], dstHeight = _a[1];
  6662. if (n < 0) {
  6663. dstTop -= dstHeight;
  6664. }
  6665. else {
  6666. dstLeft -= dstWidth;
  6667. }
  6668. srcLeft = dstLeft;
  6669. srcTop = dstTop;
  6670. _b = [srcHeight, srcWidth], srcWidth = _b[0], srcHeight = _b[1];
  6671. }
  6672. }
  6673. dstImage.sourceLeft = dstLeft;
  6674. dstImage.sourceTop = dstTop;
  6675. dstImage.sourceWidth = dstWidth;
  6676. dstImage.sourceHeight = dstHeight;
  6677. };
  6678. Object.defineProperty(Image.prototype, "domImage", {
  6679. get: function () {
  6680. return this._domImage;
  6681. },
  6682. /**
  6683. * Gets or sets the internal DOM image used to render the control
  6684. */
  6685. set: function (value) {
  6686. var _this = this;
  6687. this._domImage = value;
  6688. this._loaded = false;
  6689. this._imageDataCache.data = null;
  6690. if (this._domImage.width) {
  6691. this._onImageLoaded();
  6692. }
  6693. else {
  6694. this._domImage.onload = function () {
  6695. _this._onImageLoaded();
  6696. };
  6697. }
  6698. },
  6699. enumerable: false,
  6700. configurable: true
  6701. });
  6702. Image.prototype._onImageLoaded = function () {
  6703. this._imageDataCache.data = null;
  6704. this._imageWidth = this._domImage.width;
  6705. this._imageHeight = this._domImage.height;
  6706. this._loaded = true;
  6707. if (this._populateNinePatchSlicesFromImage) {
  6708. this._extractNinePatchSliceDataFromImage();
  6709. }
  6710. if (this._autoScale) {
  6711. this.synchronizeSizeWithContent();
  6712. }
  6713. this.onImageLoadedObservable.notifyObservers(this);
  6714. this._markAsDirty();
  6715. };
  6716. Image.prototype._extractNinePatchSliceDataFromImage = function () {
  6717. if (!this._workingCanvas) {
  6718. this._workingCanvas = document.createElement('canvas');
  6719. }
  6720. var canvas = this._workingCanvas;
  6721. var context = canvas.getContext('2d');
  6722. var width = this._domImage.width;
  6723. var height = this._domImage.height;
  6724. canvas.width = width;
  6725. canvas.height = height;
  6726. context.drawImage(this._domImage, 0, 0, width, height);
  6727. var imageData = context.getImageData(0, 0, width, height);
  6728. // Left and right
  6729. this._sliceLeft = -1;
  6730. this._sliceRight = -1;
  6731. for (var x = 0; x < width; x++) {
  6732. var alpha = imageData.data[x * 4 + 3];
  6733. if (alpha > 127 && this._sliceLeft === -1) {
  6734. this._sliceLeft = x;
  6735. continue;
  6736. }
  6737. if (alpha < 127 && this._sliceLeft > -1) {
  6738. this._sliceRight = x;
  6739. break;
  6740. }
  6741. }
  6742. // top and bottom
  6743. this._sliceTop = -1;
  6744. this._sliceBottom = -1;
  6745. for (var y = 0; y < height; y++) {
  6746. var alpha = imageData.data[y * width * 4 + 3];
  6747. if (alpha > 127 && this._sliceTop === -1) {
  6748. this._sliceTop = y;
  6749. continue;
  6750. }
  6751. if (alpha < 127 && this._sliceTop > -1) {
  6752. this._sliceBottom = y;
  6753. break;
  6754. }
  6755. }
  6756. };
  6757. Object.defineProperty(Image.prototype, "source", {
  6758. /**
  6759. * Gets or sets image source url
  6760. */
  6761. set: function (value) {
  6762. var _this = this;
  6763. if (this._source === value) {
  6764. return;
  6765. }
  6766. this._loaded = false;
  6767. this._source = value;
  6768. this._imageDataCache.data = null;
  6769. if (value) {
  6770. value = this._svgCheck(value);
  6771. }
  6772. this._domImage = document.createElement("img");
  6773. this._domImage.onload = function () {
  6774. _this._onImageLoaded();
  6775. };
  6776. if (value) {
  6777. babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Tools"].SetCorsBehavior(value, this._domImage);
  6778. this._domImage.src = value;
  6779. }
  6780. },
  6781. enumerable: false,
  6782. configurable: true
  6783. });
  6784. /**
  6785. * Checks for svg document with icon id present
  6786. */
  6787. Image.prototype._svgCheck = function (value) {
  6788. var _this = this;
  6789. if (window.SVGSVGElement && (value.search(/.svg#/gi) !== -1) && (value.indexOf("#") === value.lastIndexOf("#"))) {
  6790. this._isSVG = true;
  6791. var svgsrc = value.split('#')[0];
  6792. var elemid = value.split('#')[1];
  6793. // check if object alr exist in document
  6794. var svgExist = document.body.querySelector('object[data="' + svgsrc + '"]');
  6795. if (svgExist) {
  6796. var svgDoc = svgExist.contentDocument;
  6797. // get viewbox width and height, get svg document width and height in px
  6798. if (svgDoc && svgDoc.documentElement) {
  6799. var vb = svgDoc.documentElement.getAttribute("viewBox");
  6800. var docwidth = Number(svgDoc.documentElement.getAttribute("width"));
  6801. var docheight = Number(svgDoc.documentElement.getAttribute("height"));
  6802. var elem = svgDoc.getElementById(elemid);
  6803. if (elem && vb && docwidth && docheight) {
  6804. this._getSVGAttribs(svgExist, elemid);
  6805. return value;
  6806. }
  6807. }
  6808. // wait for object to load
  6809. svgExist.addEventListener("load", function () {
  6810. _this._getSVGAttribs(svgExist, elemid);
  6811. });
  6812. }
  6813. else {
  6814. // create document object
  6815. var svgImage = document.createElement("object");
  6816. svgImage.data = svgsrc;
  6817. svgImage.type = "image/svg+xml";
  6818. svgImage.width = "0%";
  6819. svgImage.height = "0%";
  6820. document.body.appendChild(svgImage);
  6821. // when the object has loaded, get the element attribs
  6822. svgImage.onload = function () {
  6823. var svgobj = document.body.querySelector('object[data="' + svgsrc + '"]');
  6824. if (svgobj) {
  6825. _this._getSVGAttribs(svgobj, elemid);
  6826. }
  6827. };
  6828. }
  6829. return svgsrc;
  6830. }
  6831. else {
  6832. return value;
  6833. }
  6834. };
  6835. /**
  6836. * Sets sourceLeft, sourceTop, sourceWidth, sourceHeight automatically
  6837. * given external svg file and icon id
  6838. */
  6839. Image.prototype._getSVGAttribs = function (svgsrc, elemid) {
  6840. var svgDoc = svgsrc.contentDocument;
  6841. // get viewbox width and height, get svg document width and height in px
  6842. if (svgDoc && svgDoc.documentElement) {
  6843. var vb = svgDoc.documentElement.getAttribute("viewBox");
  6844. var docwidth = Number(svgDoc.documentElement.getAttribute("width"));
  6845. var docheight = Number(svgDoc.documentElement.getAttribute("height"));
  6846. // get element bbox and matrix transform
  6847. var elem = svgDoc.getElementById(elemid);
  6848. if (vb && docwidth && docheight && elem) {
  6849. var vb_width = Number(vb.split(" ")[2]);
  6850. var vb_height = Number(vb.split(" ")[3]);
  6851. var elem_bbox = elem.getBBox();
  6852. var elem_matrix_a = 1;
  6853. var elem_matrix_d = 1;
  6854. var elem_matrix_e = 0;
  6855. var elem_matrix_f = 0;
  6856. if (elem.transform && elem.transform.baseVal.consolidate()) {
  6857. elem_matrix_a = elem.transform.baseVal.consolidate().matrix.a;
  6858. elem_matrix_d = elem.transform.baseVal.consolidate().matrix.d;
  6859. elem_matrix_e = elem.transform.baseVal.consolidate().matrix.e;
  6860. elem_matrix_f = elem.transform.baseVal.consolidate().matrix.f;
  6861. }
  6862. // compute source coordinates and dimensions
  6863. this.sourceLeft = ((elem_matrix_a * elem_bbox.x + elem_matrix_e) * docwidth) / vb_width;
  6864. this.sourceTop = ((elem_matrix_d * elem_bbox.y + elem_matrix_f) * docheight) / vb_height;
  6865. this.sourceWidth = (elem_bbox.width * elem_matrix_a) * (docwidth / vb_width);
  6866. this.sourceHeight = (elem_bbox.height * elem_matrix_d) * (docheight / vb_height);
  6867. this._svgAttributesComputationCompleted = true;
  6868. this.onSVGAttributesComputedObservable.notifyObservers(this);
  6869. }
  6870. }
  6871. };
  6872. Object.defineProperty(Image.prototype, "cellWidth", {
  6873. /**
  6874. * Gets or sets the cell width to use when animation sheet is enabled
  6875. * @see https://doc.babylonjs.com/how_to/gui#image
  6876. */
  6877. get: function () {
  6878. return this._cellWidth;
  6879. },
  6880. set: function (value) {
  6881. if (this._cellWidth === value) {
  6882. return;
  6883. }
  6884. this._cellWidth = value;
  6885. this._markAsDirty();
  6886. },
  6887. enumerable: false,
  6888. configurable: true
  6889. });
  6890. Object.defineProperty(Image.prototype, "cellHeight", {
  6891. /**
  6892. * Gets or sets the cell height to use when animation sheet is enabled
  6893. * @see https://doc.babylonjs.com/how_to/gui#image
  6894. */
  6895. get: function () {
  6896. return this._cellHeight;
  6897. },
  6898. set: function (value) {
  6899. if (this._cellHeight === value) {
  6900. return;
  6901. }
  6902. this._cellHeight = value;
  6903. this._markAsDirty();
  6904. },
  6905. enumerable: false,
  6906. configurable: true
  6907. });
  6908. Object.defineProperty(Image.prototype, "cellId", {
  6909. /**
  6910. * Gets or sets the cell id to use (this will turn on the animation sheet mode)
  6911. * @see https://doc.babylonjs.com/how_to/gui#image
  6912. */
  6913. get: function () {
  6914. return this._cellId;
  6915. },
  6916. set: function (value) {
  6917. if (this._cellId === value) {
  6918. return;
  6919. }
  6920. this._cellId = value;
  6921. this._markAsDirty();
  6922. },
  6923. enumerable: false,
  6924. configurable: true
  6925. });
  6926. /**
  6927. * Tests if a given coordinates belong to the current control
  6928. * @param x defines x coordinate to test
  6929. * @param y defines y coordinate to test
  6930. * @returns true if the coordinates are inside the control
  6931. */
  6932. Image.prototype.contains = function (x, y) {
  6933. if (!_super.prototype.contains.call(this, x, y)) {
  6934. return false;
  6935. }
  6936. if (!this._detectPointerOnOpaqueOnly || !this._workingCanvas) {
  6937. return true;
  6938. }
  6939. var width = this._currentMeasure.width | 0;
  6940. var height = this._currentMeasure.height | 0;
  6941. var key = width + "_" + height;
  6942. var imageData = this._imageDataCache.data;
  6943. if (!imageData || this._imageDataCache.key !== key) {
  6944. var canvas = this._workingCanvas;
  6945. var context_1 = canvas.getContext("2d");
  6946. this._imageDataCache.data = imageData = context_1.getImageData(0, 0, width, height).data;
  6947. this._imageDataCache.key = key;
  6948. }
  6949. x = (x - this._currentMeasure.left) | 0;
  6950. y = (y - this._currentMeasure.top) | 0;
  6951. var pickedPixel = imageData[(x + y * width) * 4 + 3];
  6952. return pickedPixel > 0;
  6953. };
  6954. Image.prototype._getTypeName = function () {
  6955. return "Image";
  6956. };
  6957. /** Force the control to synchronize with its content */
  6958. Image.prototype.synchronizeSizeWithContent = function () {
  6959. if (!this._loaded) {
  6960. return;
  6961. }
  6962. this.width = this._domImage.width + "px";
  6963. this.height = this._domImage.height + "px";
  6964. };
  6965. Image.prototype._processMeasures = function (parentMeasure, context) {
  6966. if (this._loaded) {
  6967. switch (this._stretch) {
  6968. case Image.STRETCH_NONE:
  6969. break;
  6970. case Image.STRETCH_FILL:
  6971. break;
  6972. case Image.STRETCH_UNIFORM:
  6973. break;
  6974. case Image.STRETCH_NINE_PATCH:
  6975. break;
  6976. case Image.STRETCH_EXTEND:
  6977. if (this._autoScale) {
  6978. this.synchronizeSizeWithContent();
  6979. }
  6980. if (this.parent && this.parent.parent) { // Will update root size if root is not the top root
  6981. this.parent.adaptWidthToChildren = true;
  6982. this.parent.adaptHeightToChildren = true;
  6983. }
  6984. break;
  6985. }
  6986. }
  6987. _super.prototype._processMeasures.call(this, parentMeasure, context);
  6988. };
  6989. Image.prototype._prepareWorkingCanvasForOpaqueDetection = function () {
  6990. if (!this._detectPointerOnOpaqueOnly) {
  6991. return;
  6992. }
  6993. if (!this._workingCanvas) {
  6994. this._workingCanvas = document.createElement('canvas');
  6995. }
  6996. var canvas = this._workingCanvas;
  6997. var width = this._currentMeasure.width;
  6998. var height = this._currentMeasure.height;
  6999. var context = canvas.getContext("2d");
  7000. canvas.width = width;
  7001. canvas.height = height;
  7002. context.clearRect(0, 0, width, height);
  7003. };
  7004. Image.prototype._drawImage = function (context, sx, sy, sw, sh, tx, ty, tw, th) {
  7005. context.drawImage(this._domImage, sx, sy, sw, sh, tx, ty, tw, th);
  7006. if (!this._detectPointerOnOpaqueOnly) {
  7007. return;
  7008. }
  7009. var canvas = this._workingCanvas;
  7010. context = canvas.getContext("2d");
  7011. context.drawImage(this._domImage, sx, sy, sw, sh, tx - this._currentMeasure.left, ty - this._currentMeasure.top, tw, th);
  7012. };
  7013. Image.prototype._draw = function (context) {
  7014. context.save();
  7015. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  7016. context.shadowColor = this.shadowColor;
  7017. context.shadowBlur = this.shadowBlur;
  7018. context.shadowOffsetX = this.shadowOffsetX;
  7019. context.shadowOffsetY = this.shadowOffsetY;
  7020. }
  7021. var x, y, width, height;
  7022. if (this.cellId == -1) {
  7023. x = this._sourceLeft;
  7024. y = this._sourceTop;
  7025. width = this._sourceWidth ? this._sourceWidth : this._imageWidth;
  7026. height = this._sourceHeight ? this._sourceHeight : this._imageHeight;
  7027. }
  7028. else {
  7029. var rowCount = this._domImage.naturalWidth / this.cellWidth;
  7030. var column = (this.cellId / rowCount) >> 0;
  7031. var row = this.cellId % rowCount;
  7032. x = this.cellWidth * row;
  7033. y = this.cellHeight * column;
  7034. width = this.cellWidth;
  7035. height = this.cellHeight;
  7036. }
  7037. this._prepareWorkingCanvasForOpaqueDetection();
  7038. this._applyStates(context);
  7039. if (this._loaded) {
  7040. switch (this._stretch) {
  7041. case Image.STRETCH_NONE:
  7042. this._drawImage(context, x, y, width, height, this._currentMeasure.left, this._currentMeasure.top, this._currentMeasure.width, this._currentMeasure.height);
  7043. break;
  7044. case Image.STRETCH_FILL:
  7045. this._drawImage(context, x, y, width, height, this._currentMeasure.left, this._currentMeasure.top, this._currentMeasure.width, this._currentMeasure.height);
  7046. break;
  7047. case Image.STRETCH_UNIFORM:
  7048. var hRatio = this._currentMeasure.width / width;
  7049. var vRatio = this._currentMeasure.height / height;
  7050. var ratio = Math.min(hRatio, vRatio);
  7051. var centerX = (this._currentMeasure.width - width * ratio) / 2;
  7052. var centerY = (this._currentMeasure.height - height * ratio) / 2;
  7053. this._drawImage(context, x, y, width, height, this._currentMeasure.left + centerX, this._currentMeasure.top + centerY, width * ratio, height * ratio);
  7054. break;
  7055. case Image.STRETCH_EXTEND:
  7056. this._drawImage(context, x, y, width, height, this._currentMeasure.left, this._currentMeasure.top, this._currentMeasure.width, this._currentMeasure.height);
  7057. break;
  7058. case Image.STRETCH_NINE_PATCH:
  7059. this._renderNinePatch(context);
  7060. break;
  7061. }
  7062. }
  7063. context.restore();
  7064. };
  7065. Image.prototype._renderCornerPatch = function (context, x, y, width, height, targetX, targetY) {
  7066. this._drawImage(context, x, y, width, height, this._currentMeasure.left + targetX, this._currentMeasure.top + targetY, width, height);
  7067. };
  7068. Image.prototype._renderNinePatch = function (context) {
  7069. var height = this._imageHeight;
  7070. var leftWidth = this._sliceLeft;
  7071. var topHeight = this._sliceTop;
  7072. var bottomHeight = this._imageHeight - this._sliceBottom;
  7073. var rightWidth = this._imageWidth - this._sliceRight;
  7074. var left = 0;
  7075. var top = 0;
  7076. if (this._populateNinePatchSlicesFromImage) {
  7077. left = 1;
  7078. top = 1;
  7079. height -= 2;
  7080. leftWidth -= 1;
  7081. topHeight -= 1;
  7082. bottomHeight -= 1;
  7083. rightWidth -= 1;
  7084. }
  7085. var centerWidth = this._sliceRight - this._sliceLeft;
  7086. var targetCenterWidth = this._currentMeasure.width - rightWidth - this.sliceLeft;
  7087. var targetTopHeight = this._currentMeasure.height - height + this._sliceBottom;
  7088. // Corners
  7089. this._renderCornerPatch(context, left, top, leftWidth, topHeight, 0, 0);
  7090. this._renderCornerPatch(context, left, this._sliceBottom, leftWidth, height - this._sliceBottom, 0, targetTopHeight);
  7091. this._renderCornerPatch(context, this._sliceRight, top, rightWidth, topHeight, this._currentMeasure.width - rightWidth, 0);
  7092. this._renderCornerPatch(context, this._sliceRight, this._sliceBottom, rightWidth, height - this._sliceBottom, this._currentMeasure.width - rightWidth, targetTopHeight);
  7093. // Center
  7094. this._drawImage(context, this._sliceLeft, this._sliceTop, centerWidth, this._sliceBottom - this._sliceTop, this._currentMeasure.left + leftWidth, this._currentMeasure.top + topHeight, targetCenterWidth, targetTopHeight - topHeight);
  7095. // Borders
  7096. this._drawImage(context, left, this._sliceTop, leftWidth, this._sliceBottom - this._sliceTop, this._currentMeasure.left, this._currentMeasure.top + topHeight, leftWidth, targetTopHeight - topHeight);
  7097. this._drawImage(context, this._sliceRight, this._sliceTop, leftWidth, this._sliceBottom - this._sliceTop, this._currentMeasure.left + this._currentMeasure.width - rightWidth, this._currentMeasure.top + topHeight, leftWidth, targetTopHeight - topHeight);
  7098. this._drawImage(context, this._sliceLeft, top, centerWidth, topHeight, this._currentMeasure.left + leftWidth, this._currentMeasure.top, targetCenterWidth, topHeight);
  7099. this._drawImage(context, this._sliceLeft, this._sliceBottom, centerWidth, bottomHeight, this._currentMeasure.left + leftWidth, this._currentMeasure.top + targetTopHeight, targetCenterWidth, bottomHeight);
  7100. };
  7101. Image.prototype.dispose = function () {
  7102. _super.prototype.dispose.call(this);
  7103. this.onImageLoadedObservable.clear();
  7104. this.onSVGAttributesComputedObservable.clear();
  7105. };
  7106. // Static
  7107. /** STRETCH_NONE */
  7108. Image.STRETCH_NONE = 0;
  7109. /** STRETCH_FILL */
  7110. Image.STRETCH_FILL = 1;
  7111. /** STRETCH_UNIFORM */
  7112. Image.STRETCH_UNIFORM = 2;
  7113. /** STRETCH_EXTEND */
  7114. Image.STRETCH_EXTEND = 3;
  7115. /** NINE_PATCH */
  7116. Image.STRETCH_NINE_PATCH = 4;
  7117. return Image;
  7118. }(_control__WEBPACK_IMPORTED_MODULE_2__["Control"]));
  7119. babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredTypes["BABYLON.GUI.Image"] = Image;
  7120. /***/ }),
  7121. /***/ "./2D/controls/index.ts":
  7122. /*!******************************!*\
  7123. !*** ./2D/controls/index.ts ***!
  7124. \******************************/
  7125. /*! exports provided: Button, Checkbox, ColorPicker, Container, Control, Ellipse, Grid, Image, InputText, InputPassword, Line, MultiLine, RadioButton, StackPanel, SelectorGroup, CheckboxGroup, RadioGroup, SliderGroup, SelectionPanel, ScrollViewer, TextWrapping, TextBlock, KeyPropertySet, VirtualKeyboard, Rectangle, DisplayGrid, BaseSlider, Slider, ImageBasedSlider, ScrollBar, ImageScrollBar, name */
  7126. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  7127. "use strict";
  7128. __webpack_require__.r(__webpack_exports__);
  7129. /* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./button */ "./2D/controls/button.ts");
  7130. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Button", function() { return _button__WEBPACK_IMPORTED_MODULE_0__["Button"]; });
  7131. /* harmony import */ var _checkbox__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./checkbox */ "./2D/controls/checkbox.ts");
  7132. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Checkbox", function() { return _checkbox__WEBPACK_IMPORTED_MODULE_1__["Checkbox"]; });
  7133. /* harmony import */ var _colorpicker__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./colorpicker */ "./2D/controls/colorpicker.ts");
  7134. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ColorPicker", function() { return _colorpicker__WEBPACK_IMPORTED_MODULE_2__["ColorPicker"]; });
  7135. /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./container */ "./2D/controls/container.ts");
  7136. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Container", function() { return _container__WEBPACK_IMPORTED_MODULE_3__["Container"]; });
  7137. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  7138. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Control", function() { return _control__WEBPACK_IMPORTED_MODULE_4__["Control"]; });
  7139. /* harmony import */ var _ellipse__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./ellipse */ "./2D/controls/ellipse.ts");
  7140. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Ellipse", function() { return _ellipse__WEBPACK_IMPORTED_MODULE_5__["Ellipse"]; });
  7141. /* harmony import */ var _grid__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./grid */ "./2D/controls/grid.ts");
  7142. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Grid", function() { return _grid__WEBPACK_IMPORTED_MODULE_6__["Grid"]; });
  7143. /* harmony import */ var _image__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./image */ "./2D/controls/image.ts");
  7144. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Image", function() { return _image__WEBPACK_IMPORTED_MODULE_7__["Image"]; });
  7145. /* harmony import */ var _inputText__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./inputText */ "./2D/controls/inputText.ts");
  7146. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "InputText", function() { return _inputText__WEBPACK_IMPORTED_MODULE_8__["InputText"]; });
  7147. /* harmony import */ var _inputPassword__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./inputPassword */ "./2D/controls/inputPassword.ts");
  7148. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "InputPassword", function() { return _inputPassword__WEBPACK_IMPORTED_MODULE_9__["InputPassword"]; });
  7149. /* harmony import */ var _line__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./line */ "./2D/controls/line.ts");
  7150. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Line", function() { return _line__WEBPACK_IMPORTED_MODULE_10__["Line"]; });
  7151. /* harmony import */ var _multiLine__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./multiLine */ "./2D/controls/multiLine.ts");
  7152. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MultiLine", function() { return _multiLine__WEBPACK_IMPORTED_MODULE_11__["MultiLine"]; });
  7153. /* harmony import */ var _radioButton__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./radioButton */ "./2D/controls/radioButton.ts");
  7154. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "RadioButton", function() { return _radioButton__WEBPACK_IMPORTED_MODULE_12__["RadioButton"]; });
  7155. /* harmony import */ var _stackPanel__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./stackPanel */ "./2D/controls/stackPanel.ts");
  7156. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "StackPanel", function() { return _stackPanel__WEBPACK_IMPORTED_MODULE_13__["StackPanel"]; });
  7157. /* harmony import */ var _selector__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./selector */ "./2D/controls/selector.ts");
  7158. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SelectorGroup", function() { return _selector__WEBPACK_IMPORTED_MODULE_14__["SelectorGroup"]; });
  7159. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "CheckboxGroup", function() { return _selector__WEBPACK_IMPORTED_MODULE_14__["CheckboxGroup"]; });
  7160. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "RadioGroup", function() { return _selector__WEBPACK_IMPORTED_MODULE_14__["RadioGroup"]; });
  7161. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SliderGroup", function() { return _selector__WEBPACK_IMPORTED_MODULE_14__["SliderGroup"]; });
  7162. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SelectionPanel", function() { return _selector__WEBPACK_IMPORTED_MODULE_14__["SelectionPanel"]; });
  7163. /* harmony import */ var _scrollViewers_scrollViewer__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./scrollViewers/scrollViewer */ "./2D/controls/scrollViewers/scrollViewer.ts");
  7164. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ScrollViewer", function() { return _scrollViewers_scrollViewer__WEBPACK_IMPORTED_MODULE_15__["ScrollViewer"]; });
  7165. /* harmony import */ var _textBlock__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./textBlock */ "./2D/controls/textBlock.ts");
  7166. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "TextWrapping", function() { return _textBlock__WEBPACK_IMPORTED_MODULE_16__["TextWrapping"]; });
  7167. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "TextBlock", function() { return _textBlock__WEBPACK_IMPORTED_MODULE_16__["TextBlock"]; });
  7168. /* harmony import */ var _virtualKeyboard__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./virtualKeyboard */ "./2D/controls/virtualKeyboard.ts");
  7169. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "KeyPropertySet", function() { return _virtualKeyboard__WEBPACK_IMPORTED_MODULE_17__["KeyPropertySet"]; });
  7170. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "VirtualKeyboard", function() { return _virtualKeyboard__WEBPACK_IMPORTED_MODULE_17__["VirtualKeyboard"]; });
  7171. /* harmony import */ var _rectangle__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./rectangle */ "./2D/controls/rectangle.ts");
  7172. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Rectangle", function() { return _rectangle__WEBPACK_IMPORTED_MODULE_18__["Rectangle"]; });
  7173. /* harmony import */ var _displayGrid__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./displayGrid */ "./2D/controls/displayGrid.ts");
  7174. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DisplayGrid", function() { return _displayGrid__WEBPACK_IMPORTED_MODULE_19__["DisplayGrid"]; });
  7175. /* harmony import */ var _sliders_baseSlider__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./sliders/baseSlider */ "./2D/controls/sliders/baseSlider.ts");
  7176. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "BaseSlider", function() { return _sliders_baseSlider__WEBPACK_IMPORTED_MODULE_20__["BaseSlider"]; });
  7177. /* harmony import */ var _sliders_slider__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ./sliders/slider */ "./2D/controls/sliders/slider.ts");
  7178. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Slider", function() { return _sliders_slider__WEBPACK_IMPORTED_MODULE_21__["Slider"]; });
  7179. /* harmony import */ var _sliders_imageBasedSlider__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./sliders/imageBasedSlider */ "./2D/controls/sliders/imageBasedSlider.ts");
  7180. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ImageBasedSlider", function() { return _sliders_imageBasedSlider__WEBPACK_IMPORTED_MODULE_22__["ImageBasedSlider"]; });
  7181. /* harmony import */ var _sliders_scrollBar__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ./sliders/scrollBar */ "./2D/controls/sliders/scrollBar.ts");
  7182. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ScrollBar", function() { return _sliders_scrollBar__WEBPACK_IMPORTED_MODULE_23__["ScrollBar"]; });
  7183. /* harmony import */ var _sliders_imageScrollBar__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ./sliders/imageScrollBar */ "./2D/controls/sliders/imageScrollBar.ts");
  7184. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ImageScrollBar", function() { return _sliders_imageScrollBar__WEBPACK_IMPORTED_MODULE_24__["ImageScrollBar"]; });
  7185. /* harmony import */ var _statics__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ./statics */ "./2D/controls/statics.ts");
  7186. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "name", function() { return _statics__WEBPACK_IMPORTED_MODULE_25__["name"]; });
  7187. /***/ }),
  7188. /***/ "./2D/controls/inputPassword.ts":
  7189. /*!**************************************!*\
  7190. !*** ./2D/controls/inputPassword.ts ***!
  7191. \**************************************/
  7192. /*! exports provided: InputPassword */
  7193. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  7194. "use strict";
  7195. __webpack_require__.r(__webpack_exports__);
  7196. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "InputPassword", function() { return InputPassword; });
  7197. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  7198. /* harmony import */ var _inputText__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./inputText */ "./2D/controls/inputText.ts");
  7199. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math.vector");
  7200. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__);
  7201. /**
  7202. * Class used to create a password control
  7203. */
  7204. var InputPassword = /** @class */ (function (_super) {
  7205. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(InputPassword, _super);
  7206. function InputPassword() {
  7207. return _super !== null && _super.apply(this, arguments) || this;
  7208. }
  7209. InputPassword.prototype._beforeRenderText = function (text) {
  7210. var txt = "";
  7211. for (var i = 0; i < text.length; i++) {
  7212. txt += "\u2022";
  7213. }
  7214. return txt;
  7215. };
  7216. return InputPassword;
  7217. }(_inputText__WEBPACK_IMPORTED_MODULE_1__["InputText"]));
  7218. babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__["_TypeStore"].RegisteredTypes["BABYLON.GUI.InputPassword"] = InputPassword;
  7219. /***/ }),
  7220. /***/ "./2D/controls/inputText.ts":
  7221. /*!**********************************!*\
  7222. !*** ./2D/controls/inputText.ts ***!
  7223. \**********************************/
  7224. /*! exports provided: InputText */
  7225. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  7226. "use strict";
  7227. __webpack_require__.r(__webpack_exports__);
  7228. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "InputText", function() { return InputText; });
  7229. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  7230. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math.vector");
  7231. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
  7232. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  7233. /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
  7234. /**
  7235. * Class used to create input text control
  7236. */
  7237. var InputText = /** @class */ (function (_super) {
  7238. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(InputText, _super);
  7239. /**
  7240. * Creates a new InputText
  7241. * @param name defines the control name
  7242. * @param text defines the text of the control
  7243. */
  7244. function InputText(name, text) {
  7245. if (text === void 0) { text = ""; }
  7246. var _this = _super.call(this, name) || this;
  7247. _this.name = name;
  7248. _this._text = "";
  7249. _this._placeholderText = "";
  7250. _this._background = "#222222";
  7251. _this._focusedBackground = "#000000";
  7252. _this._focusedColor = "white";
  7253. _this._placeholderColor = "gray";
  7254. _this._thickness = 1;
  7255. _this._margin = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__["ValueAndUnit"](10, _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__["ValueAndUnit"].UNITMODE_PIXEL);
  7256. _this._autoStretchWidth = true;
  7257. _this._maxWidth = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__["ValueAndUnit"](1, _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__["ValueAndUnit"].UNITMODE_PERCENTAGE, false);
  7258. _this._isFocused = false;
  7259. _this._blinkIsEven = false;
  7260. _this._cursorOffset = 0;
  7261. _this._deadKey = false;
  7262. _this._addKey = true;
  7263. _this._currentKey = "";
  7264. _this._isTextHighlightOn = false;
  7265. _this._textHighlightColor = "#d5e0ff";
  7266. _this._highligherOpacity = 0.4;
  7267. _this._highlightedText = "";
  7268. _this._startHighlightIndex = 0;
  7269. _this._endHighlightIndex = 0;
  7270. _this._cursorIndex = -1;
  7271. _this._onFocusSelectAll = false;
  7272. _this._isPointerDown = false;
  7273. /** Gets or sets a string representing the message displayed on mobile when the control gets the focus */
  7274. _this.promptMessage = "Please enter text:";
  7275. /** Force disable prompt on mobile device */
  7276. _this.disableMobilePrompt = false;
  7277. /** Observable raised when the text changes */
  7278. _this.onTextChangedObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  7279. /** Observable raised just before an entered character is to be added */
  7280. _this.onBeforeKeyAddObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  7281. /** Observable raised when the control gets the focus */
  7282. _this.onFocusObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  7283. /** Observable raised when the control loses the focus */
  7284. _this.onBlurObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  7285. /**Observable raised when the text is highlighted */
  7286. _this.onTextHighlightObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  7287. /**Observable raised when copy event is triggered */
  7288. _this.onTextCopyObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  7289. /** Observable raised when cut event is triggered */
  7290. _this.onTextCutObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  7291. /** Observable raised when paste event is triggered */
  7292. _this.onTextPasteObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  7293. /** Observable raised when a key event was processed */
  7294. _this.onKeyboardEventProcessedObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  7295. _this.text = text;
  7296. _this.isPointerBlocker = true;
  7297. return _this;
  7298. }
  7299. Object.defineProperty(InputText.prototype, "maxWidth", {
  7300. /** Gets or sets the maximum width allowed by the control */
  7301. get: function () {
  7302. return this._maxWidth.toString(this._host);
  7303. },
  7304. set: function (value) {
  7305. if (this._maxWidth.toString(this._host) === value) {
  7306. return;
  7307. }
  7308. if (this._maxWidth.fromString(value)) {
  7309. this._markAsDirty();
  7310. }
  7311. },
  7312. enumerable: false,
  7313. configurable: true
  7314. });
  7315. Object.defineProperty(InputText.prototype, "maxWidthInPixels", {
  7316. /** Gets the maximum width allowed by the control in pixels */
  7317. get: function () {
  7318. return this._maxWidth.getValueInPixel(this._host, this._cachedParentMeasure.width);
  7319. },
  7320. enumerable: false,
  7321. configurable: true
  7322. });
  7323. Object.defineProperty(InputText.prototype, "highligherOpacity", {
  7324. /** Gets or sets the text highlighter transparency; default: 0.4 */
  7325. get: function () {
  7326. return this._highligherOpacity;
  7327. },
  7328. set: function (value) {
  7329. if (this._highligherOpacity === value) {
  7330. return;
  7331. }
  7332. this._highligherOpacity = value;
  7333. this._markAsDirty();
  7334. },
  7335. enumerable: false,
  7336. configurable: true
  7337. });
  7338. Object.defineProperty(InputText.prototype, "onFocusSelectAll", {
  7339. /** Gets or sets a boolean indicating whether to select complete text by default on input focus */
  7340. get: function () {
  7341. return this._onFocusSelectAll;
  7342. },
  7343. set: function (value) {
  7344. if (this._onFocusSelectAll === value) {
  7345. return;
  7346. }
  7347. this._onFocusSelectAll = value;
  7348. this._markAsDirty();
  7349. },
  7350. enumerable: false,
  7351. configurable: true
  7352. });
  7353. Object.defineProperty(InputText.prototype, "textHighlightColor", {
  7354. /** Gets or sets the text hightlight color */
  7355. get: function () {
  7356. return this._textHighlightColor;
  7357. },
  7358. set: function (value) {
  7359. if (this._textHighlightColor === value) {
  7360. return;
  7361. }
  7362. this._textHighlightColor = value;
  7363. this._markAsDirty();
  7364. },
  7365. enumerable: false,
  7366. configurable: true
  7367. });
  7368. Object.defineProperty(InputText.prototype, "margin", {
  7369. /** Gets or sets control margin */
  7370. get: function () {
  7371. return this._margin.toString(this._host);
  7372. },
  7373. set: function (value) {
  7374. if (this._margin.toString(this._host) === value) {
  7375. return;
  7376. }
  7377. if (this._margin.fromString(value)) {
  7378. this._markAsDirty();
  7379. }
  7380. },
  7381. enumerable: false,
  7382. configurable: true
  7383. });
  7384. Object.defineProperty(InputText.prototype, "marginInPixels", {
  7385. /** Gets control margin in pixels */
  7386. get: function () {
  7387. return this._margin.getValueInPixel(this._host, this._cachedParentMeasure.width);
  7388. },
  7389. enumerable: false,
  7390. configurable: true
  7391. });
  7392. Object.defineProperty(InputText.prototype, "autoStretchWidth", {
  7393. /** Gets or sets a boolean indicating if the control can auto stretch its width to adapt to the text */
  7394. get: function () {
  7395. return this._autoStretchWidth;
  7396. },
  7397. set: function (value) {
  7398. if (this._autoStretchWidth === value) {
  7399. return;
  7400. }
  7401. this._autoStretchWidth = value;
  7402. this._markAsDirty();
  7403. },
  7404. enumerable: false,
  7405. configurable: true
  7406. });
  7407. Object.defineProperty(InputText.prototype, "thickness", {
  7408. /** Gets or sets border thickness */
  7409. get: function () {
  7410. return this._thickness;
  7411. },
  7412. set: function (value) {
  7413. if (this._thickness === value) {
  7414. return;
  7415. }
  7416. this._thickness = value;
  7417. this._markAsDirty();
  7418. },
  7419. enumerable: false,
  7420. configurable: true
  7421. });
  7422. Object.defineProperty(InputText.prototype, "focusedBackground", {
  7423. /** Gets or sets the background color when focused */
  7424. get: function () {
  7425. return this._focusedBackground;
  7426. },
  7427. set: function (value) {
  7428. if (this._focusedBackground === value) {
  7429. return;
  7430. }
  7431. this._focusedBackground = value;
  7432. this._markAsDirty();
  7433. },
  7434. enumerable: false,
  7435. configurable: true
  7436. });
  7437. Object.defineProperty(InputText.prototype, "focusedColor", {
  7438. /** Gets or sets the background color when focused */
  7439. get: function () {
  7440. return this._focusedColor;
  7441. },
  7442. set: function (value) {
  7443. if (this._focusedColor === value) {
  7444. return;
  7445. }
  7446. this._focusedColor = value;
  7447. this._markAsDirty();
  7448. },
  7449. enumerable: false,
  7450. configurable: true
  7451. });
  7452. Object.defineProperty(InputText.prototype, "background", {
  7453. /** Gets or sets the background color */
  7454. get: function () {
  7455. return this._background;
  7456. },
  7457. set: function (value) {
  7458. if (this._background === value) {
  7459. return;
  7460. }
  7461. this._background = value;
  7462. this._markAsDirty();
  7463. },
  7464. enumerable: false,
  7465. configurable: true
  7466. });
  7467. Object.defineProperty(InputText.prototype, "placeholderColor", {
  7468. /** Gets or sets the placeholder color */
  7469. get: function () {
  7470. return this._placeholderColor;
  7471. },
  7472. set: function (value) {
  7473. if (this._placeholderColor === value) {
  7474. return;
  7475. }
  7476. this._placeholderColor = value;
  7477. this._markAsDirty();
  7478. },
  7479. enumerable: false,
  7480. configurable: true
  7481. });
  7482. Object.defineProperty(InputText.prototype, "placeholderText", {
  7483. /** Gets or sets the text displayed when the control is empty */
  7484. get: function () {
  7485. return this._placeholderText;
  7486. },
  7487. set: function (value) {
  7488. if (this._placeholderText === value) {
  7489. return;
  7490. }
  7491. this._placeholderText = value;
  7492. this._markAsDirty();
  7493. },
  7494. enumerable: false,
  7495. configurable: true
  7496. });
  7497. Object.defineProperty(InputText.prototype, "deadKey", {
  7498. /** Gets or sets the dead key flag */
  7499. get: function () {
  7500. return this._deadKey;
  7501. },
  7502. set: function (flag) {
  7503. this._deadKey = flag;
  7504. },
  7505. enumerable: false,
  7506. configurable: true
  7507. });
  7508. Object.defineProperty(InputText.prototype, "highlightedText", {
  7509. /** Gets or sets the highlight text */
  7510. get: function () {
  7511. return this._highlightedText;
  7512. },
  7513. set: function (text) {
  7514. if (this._highlightedText === text) {
  7515. return;
  7516. }
  7517. this._highlightedText = text;
  7518. this._markAsDirty();
  7519. },
  7520. enumerable: false,
  7521. configurable: true
  7522. });
  7523. Object.defineProperty(InputText.prototype, "addKey", {
  7524. /** Gets or sets if the current key should be added */
  7525. get: function () {
  7526. return this._addKey;
  7527. },
  7528. set: function (flag) {
  7529. this._addKey = flag;
  7530. },
  7531. enumerable: false,
  7532. configurable: true
  7533. });
  7534. Object.defineProperty(InputText.prototype, "currentKey", {
  7535. /** Gets or sets the value of the current key being entered */
  7536. get: function () {
  7537. return this._currentKey;
  7538. },
  7539. set: function (key) {
  7540. this._currentKey = key;
  7541. },
  7542. enumerable: false,
  7543. configurable: true
  7544. });
  7545. Object.defineProperty(InputText.prototype, "text", {
  7546. /** Gets or sets the text displayed in the control */
  7547. get: function () {
  7548. return this._text;
  7549. },
  7550. set: function (value) {
  7551. var valueAsString = value.toString(); // Forcing convertion
  7552. if (this._text === valueAsString) {
  7553. return;
  7554. }
  7555. this._text = valueAsString;
  7556. this._markAsDirty();
  7557. this.onTextChangedObservable.notifyObservers(this);
  7558. },
  7559. enumerable: false,
  7560. configurable: true
  7561. });
  7562. Object.defineProperty(InputText.prototype, "width", {
  7563. /** Gets or sets control width */
  7564. get: function () {
  7565. return this._width.toString(this._host);
  7566. },
  7567. set: function (value) {
  7568. if (this._width.toString(this._host) === value) {
  7569. return;
  7570. }
  7571. if (this._width.fromString(value)) {
  7572. this._markAsDirty();
  7573. }
  7574. this.autoStretchWidth = false;
  7575. },
  7576. enumerable: false,
  7577. configurable: true
  7578. });
  7579. /** @hidden */
  7580. InputText.prototype.onBlur = function () {
  7581. this._isFocused = false;
  7582. this._scrollLeft = null;
  7583. this._cursorOffset = 0;
  7584. clearTimeout(this._blinkTimeout);
  7585. this._markAsDirty();
  7586. this.onBlurObservable.notifyObservers(this);
  7587. this._host.unRegisterClipboardEvents();
  7588. if (this._onClipboardObserver) {
  7589. this._host.onClipboardObservable.remove(this._onClipboardObserver);
  7590. }
  7591. var scene = this._host.getScene();
  7592. if (this._onPointerDblTapObserver && scene) {
  7593. scene.onPointerObservable.remove(this._onPointerDblTapObserver);
  7594. }
  7595. };
  7596. /** @hidden */
  7597. InputText.prototype.onFocus = function () {
  7598. var _this = this;
  7599. if (!this._isEnabled) {
  7600. return;
  7601. }
  7602. this._scrollLeft = null;
  7603. this._isFocused = true;
  7604. this._blinkIsEven = false;
  7605. this._cursorOffset = 0;
  7606. this._markAsDirty();
  7607. this.onFocusObservable.notifyObservers(this);
  7608. if (navigator.userAgent.indexOf("Mobile") !== -1 && !this.disableMobilePrompt) {
  7609. var value = prompt(this.promptMessage);
  7610. if (value !== null) {
  7611. this.text = value;
  7612. }
  7613. this._host.focusedControl = null;
  7614. return;
  7615. }
  7616. this._host.registerClipboardEvents();
  7617. this._onClipboardObserver = this._host.onClipboardObservable.add(function (clipboardInfo) {
  7618. // process clipboard event, can be configured.
  7619. switch (clipboardInfo.type) {
  7620. case babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["ClipboardEventTypes"].COPY:
  7621. _this._onCopyText(clipboardInfo.event);
  7622. _this.onTextCopyObservable.notifyObservers(_this);
  7623. break;
  7624. case babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["ClipboardEventTypes"].CUT:
  7625. _this._onCutText(clipboardInfo.event);
  7626. _this.onTextCutObservable.notifyObservers(_this);
  7627. break;
  7628. case babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["ClipboardEventTypes"].PASTE:
  7629. _this._onPasteText(clipboardInfo.event);
  7630. _this.onTextPasteObservable.notifyObservers(_this);
  7631. break;
  7632. default: return;
  7633. }
  7634. });
  7635. var scene = this._host.getScene();
  7636. if (scene) {
  7637. //register the pointer double tap event
  7638. this._onPointerDblTapObserver = scene.onPointerObservable.add(function (pointerInfo) {
  7639. if (!_this._isFocused) {
  7640. return;
  7641. }
  7642. if (pointerInfo.type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["PointerEventTypes"].POINTERDOUBLETAP) {
  7643. _this._processDblClick(pointerInfo);
  7644. }
  7645. });
  7646. }
  7647. if (this._onFocusSelectAll) {
  7648. this._selectAllText();
  7649. }
  7650. };
  7651. InputText.prototype._getTypeName = function () {
  7652. return "InputText";
  7653. };
  7654. /**
  7655. * Function called to get the list of controls that should not steal the focus from this control
  7656. * @returns an array of controls
  7657. */
  7658. InputText.prototype.keepsFocusWith = function () {
  7659. if (!this._connectedVirtualKeyboard) {
  7660. return null;
  7661. }
  7662. return [this._connectedVirtualKeyboard];
  7663. };
  7664. /** @hidden */
  7665. InputText.prototype.processKey = function (keyCode, key, evt) {
  7666. //return if clipboard event keys (i.e -ctr/cmd + c,v,x)
  7667. if (evt && (evt.ctrlKey || evt.metaKey) && (keyCode === 67 || keyCode === 86 || keyCode === 88)) {
  7668. return;
  7669. }
  7670. //select all
  7671. if (evt && (evt.ctrlKey || evt.metaKey) && keyCode === 65) {
  7672. this._selectAllText();
  7673. evt.preventDefault();
  7674. return;
  7675. }
  7676. // Specific cases
  7677. switch (keyCode) {
  7678. case 32: //SPACE
  7679. key = " "; //ie11 key for space is "Spacebar"
  7680. break;
  7681. case 191: //SLASH
  7682. if (evt) {
  7683. evt.preventDefault();
  7684. }
  7685. break;
  7686. case 8: // BACKSPACE
  7687. if (this._text && this._text.length > 0) {
  7688. //delete the highlighted text
  7689. if (this._isTextHighlightOn) {
  7690. this.text = this._text.slice(0, this._startHighlightIndex) + this._text.slice(this._endHighlightIndex);
  7691. this._isTextHighlightOn = false;
  7692. this._cursorOffset = this.text.length - this._startHighlightIndex;
  7693. this._blinkIsEven = false;
  7694. if (evt) {
  7695. evt.preventDefault();
  7696. }
  7697. return;
  7698. }
  7699. //delete single character
  7700. if (this._cursorOffset === 0) {
  7701. this.text = this._text.substr(0, this._text.length - 1);
  7702. }
  7703. else {
  7704. var deletePosition = this._text.length - this._cursorOffset;
  7705. if (deletePosition > 0) {
  7706. this.text = this._text.slice(0, deletePosition - 1) + this._text.slice(deletePosition);
  7707. }
  7708. }
  7709. }
  7710. if (evt) {
  7711. evt.preventDefault();
  7712. }
  7713. return;
  7714. case 46: // DELETE
  7715. if (this._isTextHighlightOn) {
  7716. this.text = this._text.slice(0, this._startHighlightIndex) + this._text.slice(this._endHighlightIndex);
  7717. var decrementor = (this._endHighlightIndex - this._startHighlightIndex);
  7718. while (decrementor > 0 && this._cursorOffset > 0) {
  7719. this._cursorOffset--;
  7720. }
  7721. this._isTextHighlightOn = false;
  7722. this._cursorOffset = this.text.length - this._startHighlightIndex;
  7723. if (evt) {
  7724. evt.preventDefault();
  7725. }
  7726. return;
  7727. }
  7728. if (this._text && this._text.length > 0 && this._cursorOffset > 0) {
  7729. var deletePosition = this._text.length - this._cursorOffset;
  7730. this.text = this._text.slice(0, deletePosition) + this._text.slice(deletePosition + 1);
  7731. this._cursorOffset--;
  7732. }
  7733. if (evt) {
  7734. evt.preventDefault();
  7735. }
  7736. return;
  7737. case 13: // RETURN
  7738. this._host.focusedControl = null;
  7739. this._isTextHighlightOn = false;
  7740. return;
  7741. case 35: // END
  7742. this._cursorOffset = 0;
  7743. this._blinkIsEven = false;
  7744. this._isTextHighlightOn = false;
  7745. this._markAsDirty();
  7746. return;
  7747. case 36: // HOME
  7748. this._cursorOffset = this._text.length;
  7749. this._blinkIsEven = false;
  7750. this._isTextHighlightOn = false;
  7751. this._markAsDirty();
  7752. return;
  7753. case 37: // LEFT
  7754. this._cursorOffset++;
  7755. if (this._cursorOffset > this._text.length) {
  7756. this._cursorOffset = this._text.length;
  7757. }
  7758. if (evt && evt.shiftKey) {
  7759. // update the cursor
  7760. this._blinkIsEven = false;
  7761. // shift + ctrl/cmd + <-
  7762. if (evt.ctrlKey || evt.metaKey) {
  7763. if (!this._isTextHighlightOn) {
  7764. if (this._text.length === this._cursorOffset) {
  7765. return;
  7766. }
  7767. else {
  7768. this._endHighlightIndex = this._text.length - this._cursorOffset + 1;
  7769. }
  7770. }
  7771. this._startHighlightIndex = 0;
  7772. this._cursorIndex = this._text.length - this._endHighlightIndex;
  7773. this._cursorOffset = this._text.length;
  7774. this._isTextHighlightOn = true;
  7775. this._markAsDirty();
  7776. return;
  7777. }
  7778. //store the starting point
  7779. if (!this._isTextHighlightOn) {
  7780. this._isTextHighlightOn = true;
  7781. this._cursorIndex = (this._cursorOffset >= this._text.length) ? this._text.length : this._cursorOffset - 1;
  7782. }
  7783. //if text is already highlighted
  7784. else if (this._cursorIndex === -1) {
  7785. this._cursorIndex = this._text.length - this._endHighlightIndex;
  7786. this._cursorOffset = (this._startHighlightIndex === 0) ? this._text.length : this._text.length - this._startHighlightIndex + 1;
  7787. }
  7788. //set the highlight indexes
  7789. if (this._cursorIndex < this._cursorOffset) {
  7790. this._endHighlightIndex = this._text.length - this._cursorIndex;
  7791. this._startHighlightIndex = this._text.length - this._cursorOffset;
  7792. }
  7793. else if (this._cursorIndex > this._cursorOffset) {
  7794. this._endHighlightIndex = this._text.length - this._cursorOffset;
  7795. this._startHighlightIndex = this._text.length - this._cursorIndex;
  7796. }
  7797. else {
  7798. this._isTextHighlightOn = false;
  7799. }
  7800. this._markAsDirty();
  7801. return;
  7802. }
  7803. if (this._isTextHighlightOn) {
  7804. this._cursorOffset = this._text.length - this._startHighlightIndex;
  7805. this._isTextHighlightOn = false;
  7806. }
  7807. if (evt && (evt.ctrlKey || evt.metaKey)) {
  7808. this._cursorOffset = this.text.length;
  7809. evt.preventDefault();
  7810. }
  7811. this._blinkIsEven = false;
  7812. this._isTextHighlightOn = false;
  7813. this._cursorIndex = -1;
  7814. this._markAsDirty();
  7815. return;
  7816. case 39: // RIGHT
  7817. this._cursorOffset--;
  7818. if (this._cursorOffset < 0) {
  7819. this._cursorOffset = 0;
  7820. }
  7821. if (evt && evt.shiftKey) {
  7822. //update the cursor
  7823. this._blinkIsEven = false;
  7824. //shift + ctrl/cmd + ->
  7825. if (evt.ctrlKey || evt.metaKey) {
  7826. if (!this._isTextHighlightOn) {
  7827. if (this._cursorOffset === 0) {
  7828. return;
  7829. }
  7830. else {
  7831. this._startHighlightIndex = this._text.length - this._cursorOffset - 1;
  7832. }
  7833. }
  7834. this._endHighlightIndex = this._text.length;
  7835. this._isTextHighlightOn = true;
  7836. this._cursorIndex = this._text.length - this._startHighlightIndex;
  7837. this._cursorOffset = 0;
  7838. this._markAsDirty();
  7839. return;
  7840. }
  7841. if (!this._isTextHighlightOn) {
  7842. this._isTextHighlightOn = true;
  7843. this._cursorIndex = (this._cursorOffset <= 0) ? 0 : this._cursorOffset + 1;
  7844. }
  7845. //if text is already highlighted
  7846. else if (this._cursorIndex === -1) {
  7847. this._cursorIndex = this._text.length - this._startHighlightIndex;
  7848. this._cursorOffset = (this._text.length === this._endHighlightIndex) ? 0 : this._text.length - this._endHighlightIndex - 1;
  7849. }
  7850. //set the highlight indexes
  7851. if (this._cursorIndex < this._cursorOffset) {
  7852. this._endHighlightIndex = this._text.length - this._cursorIndex;
  7853. this._startHighlightIndex = this._text.length - this._cursorOffset;
  7854. }
  7855. else if (this._cursorIndex > this._cursorOffset) {
  7856. this._endHighlightIndex = this._text.length - this._cursorOffset;
  7857. this._startHighlightIndex = this._text.length - this._cursorIndex;
  7858. }
  7859. else {
  7860. this._isTextHighlightOn = false;
  7861. }
  7862. this._markAsDirty();
  7863. return;
  7864. }
  7865. if (this._isTextHighlightOn) {
  7866. this._cursorOffset = this._text.length - this._endHighlightIndex;
  7867. this._isTextHighlightOn = false;
  7868. }
  7869. //ctr + ->
  7870. if (evt && (evt.ctrlKey || evt.metaKey)) {
  7871. this._cursorOffset = 0;
  7872. evt.preventDefault();
  7873. }
  7874. this._blinkIsEven = false;
  7875. this._isTextHighlightOn = false;
  7876. this._cursorIndex = -1;
  7877. this._markAsDirty();
  7878. return;
  7879. case 222: // Dead
  7880. if (evt) {
  7881. evt.preventDefault();
  7882. }
  7883. this._cursorIndex = -1;
  7884. this.deadKey = true;
  7885. break;
  7886. }
  7887. // Printable characters
  7888. if (key &&
  7889. ((keyCode === -1) || // Direct access
  7890. (keyCode === 32) || // Space
  7891. (keyCode > 47 && keyCode < 64) || // Numbers
  7892. (keyCode > 64 && keyCode < 91) || // Letters
  7893. (keyCode > 159 && keyCode < 193) || // Special characters
  7894. (keyCode > 218 && keyCode < 223) || // Special characters
  7895. (keyCode > 95 && keyCode < 112))) { // Numpad
  7896. this._currentKey = key;
  7897. this.onBeforeKeyAddObservable.notifyObservers(this);
  7898. key = this._currentKey;
  7899. if (this._addKey) {
  7900. if (this._isTextHighlightOn) {
  7901. this.text = this._text.slice(0, this._startHighlightIndex) + key + this._text.slice(this._endHighlightIndex);
  7902. this._cursorOffset = this.text.length - (this._startHighlightIndex + 1);
  7903. this._isTextHighlightOn = false;
  7904. this._blinkIsEven = false;
  7905. this._markAsDirty();
  7906. }
  7907. else if (this._cursorOffset === 0) {
  7908. this.text += key;
  7909. }
  7910. else {
  7911. var insertPosition = this._text.length - this._cursorOffset;
  7912. this.text = this._text.slice(0, insertPosition) + key + this._text.slice(insertPosition);
  7913. }
  7914. }
  7915. }
  7916. };
  7917. /** @hidden */
  7918. InputText.prototype._updateValueFromCursorIndex = function (offset) {
  7919. //update the cursor
  7920. this._blinkIsEven = false;
  7921. if (this._cursorIndex === -1) {
  7922. this._cursorIndex = offset;
  7923. }
  7924. else {
  7925. if (this._cursorIndex < this._cursorOffset) {
  7926. this._endHighlightIndex = this._text.length - this._cursorIndex;
  7927. this._startHighlightIndex = this._text.length - this._cursorOffset;
  7928. }
  7929. else if (this._cursorIndex > this._cursorOffset) {
  7930. this._endHighlightIndex = this._text.length - this._cursorOffset;
  7931. this._startHighlightIndex = this._text.length - this._cursorIndex;
  7932. }
  7933. else {
  7934. this._isTextHighlightOn = false;
  7935. this._markAsDirty();
  7936. return;
  7937. }
  7938. }
  7939. this._isTextHighlightOn = true;
  7940. this._markAsDirty();
  7941. };
  7942. /** @hidden */
  7943. InputText.prototype._processDblClick = function (evt) {
  7944. //pre-find the start and end index of the word under cursor, speeds up the rendering
  7945. this._startHighlightIndex = this._text.length - this._cursorOffset;
  7946. this._endHighlightIndex = this._startHighlightIndex;
  7947. var rWord = /\w+/g, moveLeft, moveRight;
  7948. do {
  7949. moveRight = this._endHighlightIndex < this._text.length && (this._text[this._endHighlightIndex].search(rWord) !== -1) ? ++this._endHighlightIndex : 0;
  7950. moveLeft = this._startHighlightIndex > 0 && (this._text[this._startHighlightIndex - 1].search(rWord) !== -1) ? --this._startHighlightIndex : 0;
  7951. } while (moveLeft || moveRight);
  7952. this._cursorOffset = this.text.length - this._startHighlightIndex;
  7953. this.onTextHighlightObservable.notifyObservers(this);
  7954. this._isTextHighlightOn = true;
  7955. this._clickedCoordinate = null;
  7956. this._blinkIsEven = true;
  7957. this._cursorIndex = -1;
  7958. this._markAsDirty();
  7959. };
  7960. /** @hidden */
  7961. InputText.prototype._selectAllText = function () {
  7962. this._blinkIsEven = true;
  7963. this._isTextHighlightOn = true;
  7964. this._startHighlightIndex = 0;
  7965. this._endHighlightIndex = this._text.length;
  7966. this._cursorOffset = this._text.length;
  7967. this._cursorIndex = -1;
  7968. this._markAsDirty();
  7969. };
  7970. /**
  7971. * Handles the keyboard event
  7972. * @param evt Defines the KeyboardEvent
  7973. */
  7974. InputText.prototype.processKeyboard = function (evt) {
  7975. // process pressed key
  7976. this.processKey(evt.keyCode, evt.key, evt);
  7977. this.onKeyboardEventProcessedObservable.notifyObservers(evt);
  7978. };
  7979. /** @hidden */
  7980. InputText.prototype._onCopyText = function (ev) {
  7981. this._isTextHighlightOn = false;
  7982. //when write permission to clipbaord data is denied
  7983. try {
  7984. ev.clipboardData && ev.clipboardData.setData("text/plain", this._highlightedText);
  7985. }
  7986. catch (_a) { } //pass
  7987. this._host.clipboardData = this._highlightedText;
  7988. };
  7989. /** @hidden */
  7990. InputText.prototype._onCutText = function (ev) {
  7991. if (!this._highlightedText) {
  7992. return;
  7993. }
  7994. this.text = this._text.slice(0, this._startHighlightIndex) + this._text.slice(this._endHighlightIndex);
  7995. this._isTextHighlightOn = false;
  7996. this._cursorOffset = this.text.length - this._startHighlightIndex;
  7997. //when write permission to clipbaord data is denied
  7998. try {
  7999. ev.clipboardData && ev.clipboardData.setData("text/plain", this._highlightedText);
  8000. }
  8001. catch (_a) { } //pass
  8002. this._host.clipboardData = this._highlightedText;
  8003. this._highlightedText = "";
  8004. };
  8005. /** @hidden */
  8006. InputText.prototype._onPasteText = function (ev) {
  8007. var data = "";
  8008. if (ev.clipboardData && ev.clipboardData.types.indexOf("text/plain") !== -1) {
  8009. data = ev.clipboardData.getData("text/plain");
  8010. }
  8011. else {
  8012. //get the cached data; returns blank string by default
  8013. data = this._host.clipboardData;
  8014. }
  8015. var insertPosition = this._text.length - this._cursorOffset;
  8016. this.text = this._text.slice(0, insertPosition) + data + this._text.slice(insertPosition);
  8017. };
  8018. InputText.prototype._draw = function (context, invalidatedRectangle) {
  8019. var _this = this;
  8020. context.save();
  8021. this._applyStates(context);
  8022. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  8023. context.shadowColor = this.shadowColor;
  8024. context.shadowBlur = this.shadowBlur;
  8025. context.shadowOffsetX = this.shadowOffsetX;
  8026. context.shadowOffsetY = this.shadowOffsetY;
  8027. }
  8028. // Background
  8029. if (this._isFocused) {
  8030. if (this._focusedBackground) {
  8031. context.fillStyle = this._isEnabled ? this._focusedBackground : this._disabledColor;
  8032. context.fillRect(this._currentMeasure.left, this._currentMeasure.top, this._currentMeasure.width, this._currentMeasure.height);
  8033. }
  8034. }
  8035. else if (this._background) {
  8036. context.fillStyle = this._isEnabled ? this._background : this._disabledColor;
  8037. context.fillRect(this._currentMeasure.left, this._currentMeasure.top, this._currentMeasure.width, this._currentMeasure.height);
  8038. }
  8039. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  8040. context.shadowBlur = 0;
  8041. context.shadowOffsetX = 0;
  8042. context.shadowOffsetY = 0;
  8043. }
  8044. if (!this._fontOffset) {
  8045. this._fontOffset = _control__WEBPACK_IMPORTED_MODULE_2__["Control"]._GetFontOffset(context.font);
  8046. }
  8047. // Text
  8048. var clipTextLeft = this._currentMeasure.left + this._margin.getValueInPixel(this._host, this._tempParentMeasure.width);
  8049. if (this.color) {
  8050. context.fillStyle = this.color;
  8051. }
  8052. var text = this._beforeRenderText(this._text);
  8053. if (!this._isFocused && !this._text && this._placeholderText) {
  8054. text = this._placeholderText;
  8055. if (this._placeholderColor) {
  8056. context.fillStyle = this._placeholderColor;
  8057. }
  8058. }
  8059. this._textWidth = context.measureText(text).width;
  8060. var marginWidth = this._margin.getValueInPixel(this._host, this._tempParentMeasure.width) * 2;
  8061. if (this._autoStretchWidth) {
  8062. this.width = Math.min(this._maxWidth.getValueInPixel(this._host, this._tempParentMeasure.width), this._textWidth + marginWidth) + "px";
  8063. }
  8064. var rootY = this._fontOffset.ascent + (this._currentMeasure.height - this._fontOffset.height) / 2;
  8065. var availableWidth = this._width.getValueInPixel(this._host, this._tempParentMeasure.width) - marginWidth;
  8066. context.save();
  8067. context.beginPath();
  8068. context.rect(clipTextLeft, this._currentMeasure.top + (this._currentMeasure.height - this._fontOffset.height) / 2, availableWidth + 2, this._currentMeasure.height);
  8069. context.clip();
  8070. if (this._isFocused && this._textWidth > availableWidth) {
  8071. var textLeft = clipTextLeft - this._textWidth + availableWidth;
  8072. if (!this._scrollLeft) {
  8073. this._scrollLeft = textLeft;
  8074. }
  8075. }
  8076. else {
  8077. this._scrollLeft = clipTextLeft;
  8078. }
  8079. context.fillText(text, this._scrollLeft, this._currentMeasure.top + rootY);
  8080. // Cursor
  8081. if (this._isFocused) {
  8082. // Need to move cursor
  8083. if (this._clickedCoordinate) {
  8084. var rightPosition = this._scrollLeft + this._textWidth;
  8085. var absoluteCursorPosition = rightPosition - this._clickedCoordinate;
  8086. var currentSize = 0;
  8087. this._cursorOffset = 0;
  8088. var previousDist = 0;
  8089. do {
  8090. if (this._cursorOffset) {
  8091. previousDist = Math.abs(absoluteCursorPosition - currentSize);
  8092. }
  8093. this._cursorOffset++;
  8094. currentSize = context.measureText(text.substr(text.length - this._cursorOffset, this._cursorOffset)).width;
  8095. } while (currentSize < absoluteCursorPosition && (text.length >= this._cursorOffset));
  8096. // Find closest move
  8097. if (Math.abs(absoluteCursorPosition - currentSize) > previousDist) {
  8098. this._cursorOffset--;
  8099. }
  8100. this._blinkIsEven = false;
  8101. this._clickedCoordinate = null;
  8102. }
  8103. // Render cursor
  8104. if (!this._blinkIsEven) {
  8105. var cursorOffsetText = this.text.substr(this._text.length - this._cursorOffset);
  8106. var cursorOffsetWidth = context.measureText(cursorOffsetText).width;
  8107. var cursorLeft = this._scrollLeft + this._textWidth - cursorOffsetWidth;
  8108. if (cursorLeft < clipTextLeft) {
  8109. this._scrollLeft += (clipTextLeft - cursorLeft);
  8110. cursorLeft = clipTextLeft;
  8111. this._markAsDirty();
  8112. }
  8113. else if (cursorLeft > clipTextLeft + availableWidth) {
  8114. this._scrollLeft += (clipTextLeft + availableWidth - cursorLeft);
  8115. cursorLeft = clipTextLeft + availableWidth;
  8116. this._markAsDirty();
  8117. }
  8118. if (!this._isTextHighlightOn) {
  8119. context.fillRect(cursorLeft, this._currentMeasure.top + (this._currentMeasure.height - this._fontOffset.height) / 2, 2, this._fontOffset.height);
  8120. }
  8121. }
  8122. clearTimeout(this._blinkTimeout);
  8123. this._blinkTimeout = setTimeout(function () {
  8124. _this._blinkIsEven = !_this._blinkIsEven;
  8125. _this._markAsDirty();
  8126. }, 500);
  8127. //show the highlighted text
  8128. if (this._isTextHighlightOn) {
  8129. clearTimeout(this._blinkTimeout);
  8130. var highlightCursorOffsetWidth = context.measureText(this.text.substring(this._startHighlightIndex)).width;
  8131. var highlightCursorLeft = this._scrollLeft + this._textWidth - highlightCursorOffsetWidth;
  8132. this._highlightedText = this.text.substring(this._startHighlightIndex, this._endHighlightIndex);
  8133. var width = context.measureText(this.text.substring(this._startHighlightIndex, this._endHighlightIndex)).width;
  8134. if (highlightCursorLeft < clipTextLeft) {
  8135. width = width - (clipTextLeft - highlightCursorLeft);
  8136. if (!width) {
  8137. // when using left arrow on text.length > availableWidth;
  8138. // assigns the width of the first letter after clipTextLeft
  8139. width = context.measureText(this.text.charAt(this.text.length - this._cursorOffset)).width;
  8140. }
  8141. highlightCursorLeft = clipTextLeft;
  8142. }
  8143. //for transparancy
  8144. context.globalAlpha = this._highligherOpacity;
  8145. context.fillStyle = this._textHighlightColor;
  8146. context.fillRect(highlightCursorLeft, this._currentMeasure.top + (this._currentMeasure.height - this._fontOffset.height) / 2, width, this._fontOffset.height);
  8147. context.globalAlpha = 1.0;
  8148. }
  8149. }
  8150. context.restore();
  8151. // Border
  8152. if (this._thickness) {
  8153. if (this._isFocused) {
  8154. if (this.focusedColor) {
  8155. context.strokeStyle = this.focusedColor;
  8156. }
  8157. }
  8158. else {
  8159. if (this.color) {
  8160. context.strokeStyle = this.color;
  8161. }
  8162. }
  8163. context.lineWidth = this._thickness;
  8164. context.strokeRect(this._currentMeasure.left + this._thickness / 2, this._currentMeasure.top + this._thickness / 2, this._currentMeasure.width - this._thickness, this._currentMeasure.height - this._thickness);
  8165. }
  8166. context.restore();
  8167. };
  8168. InputText.prototype._onPointerDown = function (target, coordinates, pointerId, buttonIndex) {
  8169. if (!_super.prototype._onPointerDown.call(this, target, coordinates, pointerId, buttonIndex)) {
  8170. return false;
  8171. }
  8172. this._clickedCoordinate = coordinates.x;
  8173. this._isTextHighlightOn = false;
  8174. this._highlightedText = "";
  8175. this._cursorIndex = -1;
  8176. this._isPointerDown = true;
  8177. this._host._capturingControl[pointerId] = this;
  8178. if (this._host.focusedControl === this) {
  8179. // Move cursor
  8180. clearTimeout(this._blinkTimeout);
  8181. this._markAsDirty();
  8182. return true;
  8183. }
  8184. if (!this._isEnabled) {
  8185. return false;
  8186. }
  8187. this._host.focusedControl = this;
  8188. return true;
  8189. };
  8190. InputText.prototype._onPointerMove = function (target, coordinates, pointerId) {
  8191. if (this._host.focusedControl === this && this._isPointerDown) {
  8192. this._clickedCoordinate = coordinates.x;
  8193. this._markAsDirty();
  8194. this._updateValueFromCursorIndex(this._cursorOffset);
  8195. }
  8196. _super.prototype._onPointerMove.call(this, target, coordinates, pointerId);
  8197. };
  8198. InputText.prototype._onPointerUp = function (target, coordinates, pointerId, buttonIndex, notifyClick) {
  8199. this._isPointerDown = false;
  8200. delete this._host._capturingControl[pointerId];
  8201. _super.prototype._onPointerUp.call(this, target, coordinates, pointerId, buttonIndex, notifyClick);
  8202. };
  8203. InputText.prototype._beforeRenderText = function (text) {
  8204. return text;
  8205. };
  8206. InputText.prototype.dispose = function () {
  8207. _super.prototype.dispose.call(this);
  8208. this.onBlurObservable.clear();
  8209. this.onFocusObservable.clear();
  8210. this.onTextChangedObservable.clear();
  8211. this.onTextCopyObservable.clear();
  8212. this.onTextCutObservable.clear();
  8213. this.onTextPasteObservable.clear();
  8214. this.onTextHighlightObservable.clear();
  8215. this.onKeyboardEventProcessedObservable.clear();
  8216. };
  8217. return InputText;
  8218. }(_control__WEBPACK_IMPORTED_MODULE_2__["Control"]));
  8219. babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredTypes["BABYLON.GUI.InputText"] = InputText;
  8220. /***/ }),
  8221. /***/ "./2D/controls/line.ts":
  8222. /*!*****************************!*\
  8223. !*** ./2D/controls/line.ts ***!
  8224. \*****************************/
  8225. /*! exports provided: Line */
  8226. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  8227. "use strict";
  8228. __webpack_require__.r(__webpack_exports__);
  8229. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Line", function() { return Line; });
  8230. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  8231. /* harmony import */ var babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math.vector */ "babylonjs/Maths/math.vector");
  8232. /* harmony import */ var babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__);
  8233. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  8234. /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
  8235. /** Class used to render 2D lines */
  8236. var Line = /** @class */ (function (_super) {
  8237. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(Line, _super);
  8238. /**
  8239. * Creates a new Line
  8240. * @param name defines the control name
  8241. */
  8242. function Line(name) {
  8243. var _this = _super.call(this, name) || this;
  8244. _this.name = name;
  8245. _this._lineWidth = 1;
  8246. _this._x1 = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__["ValueAndUnit"](0);
  8247. _this._y1 = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__["ValueAndUnit"](0);
  8248. _this._x2 = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__["ValueAndUnit"](0);
  8249. _this._y2 = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__["ValueAndUnit"](0);
  8250. _this._dash = new Array();
  8251. _this._automaticSize = true;
  8252. _this.isHitTestVisible = false;
  8253. _this._horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  8254. _this._verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].VERTICAL_ALIGNMENT_TOP;
  8255. return _this;
  8256. }
  8257. Object.defineProperty(Line.prototype, "dash", {
  8258. /** Gets or sets the dash pattern */
  8259. get: function () {
  8260. return this._dash;
  8261. },
  8262. set: function (value) {
  8263. if (this._dash === value) {
  8264. return;
  8265. }
  8266. this._dash = value;
  8267. this._markAsDirty();
  8268. },
  8269. enumerable: false,
  8270. configurable: true
  8271. });
  8272. Object.defineProperty(Line.prototype, "connectedControl", {
  8273. /** Gets or sets the control connected with the line end */
  8274. get: function () {
  8275. return this._connectedControl;
  8276. },
  8277. set: function (value) {
  8278. var _this = this;
  8279. if (this._connectedControl === value) {
  8280. return;
  8281. }
  8282. if (this._connectedControlDirtyObserver && this._connectedControl) {
  8283. this._connectedControl.onDirtyObservable.remove(this._connectedControlDirtyObserver);
  8284. this._connectedControlDirtyObserver = null;
  8285. }
  8286. if (value) {
  8287. this._connectedControlDirtyObserver = value.onDirtyObservable.add(function () { return _this._markAsDirty(); });
  8288. }
  8289. this._connectedControl = value;
  8290. this._markAsDirty();
  8291. },
  8292. enumerable: false,
  8293. configurable: true
  8294. });
  8295. Object.defineProperty(Line.prototype, "x1", {
  8296. /** Gets or sets start coordinates on X axis */
  8297. get: function () {
  8298. return this._x1.toString(this._host);
  8299. },
  8300. set: function (value) {
  8301. if (this._x1.toString(this._host) === value) {
  8302. return;
  8303. }
  8304. if (this._x1.fromString(value)) {
  8305. this._markAsDirty();
  8306. }
  8307. },
  8308. enumerable: false,
  8309. configurable: true
  8310. });
  8311. Object.defineProperty(Line.prototype, "y1", {
  8312. /** Gets or sets start coordinates on Y axis */
  8313. get: function () {
  8314. return this._y1.toString(this._host);
  8315. },
  8316. set: function (value) {
  8317. if (this._y1.toString(this._host) === value) {
  8318. return;
  8319. }
  8320. if (this._y1.fromString(value)) {
  8321. this._markAsDirty();
  8322. }
  8323. },
  8324. enumerable: false,
  8325. configurable: true
  8326. });
  8327. Object.defineProperty(Line.prototype, "x2", {
  8328. /** Gets or sets end coordinates on X axis */
  8329. get: function () {
  8330. return this._x2.toString(this._host);
  8331. },
  8332. set: function (value) {
  8333. if (this._x2.toString(this._host) === value) {
  8334. return;
  8335. }
  8336. if (this._x2.fromString(value)) {
  8337. this._markAsDirty();
  8338. }
  8339. },
  8340. enumerable: false,
  8341. configurable: true
  8342. });
  8343. Object.defineProperty(Line.prototype, "y2", {
  8344. /** Gets or sets end coordinates on Y axis */
  8345. get: function () {
  8346. return this._y2.toString(this._host);
  8347. },
  8348. set: function (value) {
  8349. if (this._y2.toString(this._host) === value) {
  8350. return;
  8351. }
  8352. if (this._y2.fromString(value)) {
  8353. this._markAsDirty();
  8354. }
  8355. },
  8356. enumerable: false,
  8357. configurable: true
  8358. });
  8359. Object.defineProperty(Line.prototype, "lineWidth", {
  8360. /** Gets or sets line width */
  8361. get: function () {
  8362. return this._lineWidth;
  8363. },
  8364. set: function (value) {
  8365. if (this._lineWidth === value) {
  8366. return;
  8367. }
  8368. this._lineWidth = value;
  8369. this._markAsDirty();
  8370. },
  8371. enumerable: false,
  8372. configurable: true
  8373. });
  8374. Object.defineProperty(Line.prototype, "horizontalAlignment", {
  8375. /** Gets or sets horizontal alignment */
  8376. set: function (value) {
  8377. return;
  8378. },
  8379. enumerable: false,
  8380. configurable: true
  8381. });
  8382. Object.defineProperty(Line.prototype, "verticalAlignment", {
  8383. /** Gets or sets vertical alignment */
  8384. set: function (value) {
  8385. return;
  8386. },
  8387. enumerable: false,
  8388. configurable: true
  8389. });
  8390. Object.defineProperty(Line.prototype, "_effectiveX2", {
  8391. get: function () {
  8392. return (this._connectedControl ? this._connectedControl.centerX : 0) + this._x2.getValue(this._host);
  8393. },
  8394. enumerable: false,
  8395. configurable: true
  8396. });
  8397. Object.defineProperty(Line.prototype, "_effectiveY2", {
  8398. get: function () {
  8399. return (this._connectedControl ? this._connectedControl.centerY : 0) + this._y2.getValue(this._host);
  8400. },
  8401. enumerable: false,
  8402. configurable: true
  8403. });
  8404. Line.prototype._getTypeName = function () {
  8405. return "Line";
  8406. };
  8407. Line.prototype._draw = function (context) {
  8408. context.save();
  8409. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  8410. context.shadowColor = this.shadowColor;
  8411. context.shadowBlur = this.shadowBlur;
  8412. context.shadowOffsetX = this.shadowOffsetX;
  8413. context.shadowOffsetY = this.shadowOffsetY;
  8414. }
  8415. this._applyStates(context);
  8416. context.strokeStyle = this.color;
  8417. context.lineWidth = this._lineWidth;
  8418. context.setLineDash(this._dash);
  8419. context.beginPath();
  8420. context.moveTo(this._cachedParentMeasure.left + this._x1.getValue(this._host), this._cachedParentMeasure.top + this._y1.getValue(this._host));
  8421. context.lineTo(this._cachedParentMeasure.left + this._effectiveX2, this._cachedParentMeasure.top + this._effectiveY2);
  8422. context.stroke();
  8423. context.restore();
  8424. };
  8425. Line.prototype._measure = function () {
  8426. // Width / Height
  8427. this._currentMeasure.width = Math.abs(this._x1.getValue(this._host) - this._effectiveX2) + this._lineWidth;
  8428. this._currentMeasure.height = Math.abs(this._y1.getValue(this._host) - this._effectiveY2) + this._lineWidth;
  8429. };
  8430. Line.prototype._computeAlignment = function (parentMeasure, context) {
  8431. this._currentMeasure.left = parentMeasure.left + Math.min(this._x1.getValue(this._host), this._effectiveX2) - this._lineWidth / 2;
  8432. this._currentMeasure.top = parentMeasure.top + Math.min(this._y1.getValue(this._host), this._effectiveY2) - this._lineWidth / 2;
  8433. };
  8434. /**
  8435. * Move one end of the line given 3D cartesian coordinates.
  8436. * @param position Targeted world position
  8437. * @param scene Scene
  8438. * @param end (opt) Set to true to assign x2 and y2 coordinates of the line. Default assign to x1 and y1.
  8439. */
  8440. Line.prototype.moveToVector3 = function (position, scene, end) {
  8441. if (end === void 0) { end = false; }
  8442. if (!this._host || this.parent !== this._host._rootContainer) {
  8443. babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["Tools"].Error("Cannot move a control to a vector3 if the control is not at root level");
  8444. return;
  8445. }
  8446. var globalViewport = this._host._getGlobalViewport(scene);
  8447. var projectedPosition = babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["Vector3"].Project(position, babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["Matrix"].Identity(), scene.getTransformMatrix(), globalViewport);
  8448. this._moveToProjectedPosition(projectedPosition, end);
  8449. if (projectedPosition.z < 0 || projectedPosition.z > 1) {
  8450. this.notRenderable = true;
  8451. return;
  8452. }
  8453. this.notRenderable = false;
  8454. };
  8455. /**
  8456. * Move one end of the line to a position in screen absolute space.
  8457. * @param projectedPosition Position in screen absolute space (X, Y)
  8458. * @param end (opt) Set to true to assign x2 and y2 coordinates of the line. Default assign to x1 and y1.
  8459. */
  8460. Line.prototype._moveToProjectedPosition = function (projectedPosition, end) {
  8461. if (end === void 0) { end = false; }
  8462. var x = (projectedPosition.x + this._linkOffsetX.getValue(this._host)) + "px";
  8463. var y = (projectedPosition.y + this._linkOffsetY.getValue(this._host)) + "px";
  8464. if (end) {
  8465. this.x2 = x;
  8466. this.y2 = y;
  8467. this._x2.ignoreAdaptiveScaling = true;
  8468. this._y2.ignoreAdaptiveScaling = true;
  8469. }
  8470. else {
  8471. this.x1 = x;
  8472. this.y1 = y;
  8473. this._x1.ignoreAdaptiveScaling = true;
  8474. this._y1.ignoreAdaptiveScaling = true;
  8475. }
  8476. };
  8477. return Line;
  8478. }(_control__WEBPACK_IMPORTED_MODULE_2__["Control"]));
  8479. babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredTypes["BABYLON.GUI.Line"] = Line;
  8480. /***/ }),
  8481. /***/ "./2D/controls/multiLine.ts":
  8482. /*!**********************************!*\
  8483. !*** ./2D/controls/multiLine.ts ***!
  8484. \**********************************/
  8485. /*! exports provided: MultiLine */
  8486. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  8487. "use strict";
  8488. __webpack_require__.r(__webpack_exports__);
  8489. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MultiLine", function() { return MultiLine; });
  8490. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  8491. /* harmony import */ var babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Meshes/abstractMesh */ "babylonjs/Maths/math.vector");
  8492. /* harmony import */ var babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1__);
  8493. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  8494. /* harmony import */ var _multiLinePoint__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../multiLinePoint */ "./2D/multiLinePoint.ts");
  8495. /**
  8496. * Class used to create multi line control
  8497. */
  8498. var MultiLine = /** @class */ (function (_super) {
  8499. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(MultiLine, _super);
  8500. /**
  8501. * Creates a new MultiLine
  8502. * @param name defines the control name
  8503. */
  8504. function MultiLine(name) {
  8505. var _this = _super.call(this, name) || this;
  8506. _this.name = name;
  8507. _this._lineWidth = 1;
  8508. /** Function called when a point is updated */
  8509. _this.onPointUpdate = function () {
  8510. _this._markAsDirty();
  8511. };
  8512. _this._automaticSize = true;
  8513. _this.isHitTestVisible = false;
  8514. _this._horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  8515. _this._verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].VERTICAL_ALIGNMENT_TOP;
  8516. _this._dash = [];
  8517. _this._points = [];
  8518. return _this;
  8519. }
  8520. Object.defineProperty(MultiLine.prototype, "dash", {
  8521. /** Gets or sets dash pattern */
  8522. get: function () {
  8523. return this._dash;
  8524. },
  8525. set: function (value) {
  8526. if (this._dash === value) {
  8527. return;
  8528. }
  8529. this._dash = value;
  8530. this._markAsDirty();
  8531. },
  8532. enumerable: false,
  8533. configurable: true
  8534. });
  8535. /**
  8536. * Gets point stored at specified index
  8537. * @param index defines the index to look for
  8538. * @returns the requested point if found
  8539. */
  8540. MultiLine.prototype.getAt = function (index) {
  8541. if (!this._points[index]) {
  8542. this._points[index] = new _multiLinePoint__WEBPACK_IMPORTED_MODULE_3__["MultiLinePoint"](this);
  8543. }
  8544. return this._points[index];
  8545. };
  8546. /**
  8547. * Adds new points to the point collection
  8548. * @param items defines the list of items (mesh, control or 2d coordiantes) to add
  8549. * @returns the list of created MultiLinePoint
  8550. */
  8551. MultiLine.prototype.add = function () {
  8552. var _this = this;
  8553. var items = [];
  8554. for (var _i = 0; _i < arguments.length; _i++) {
  8555. items[_i] = arguments[_i];
  8556. }
  8557. return items.map(function (item) { return _this.push(item); });
  8558. };
  8559. /**
  8560. * Adds a new point to the point collection
  8561. * @param item defines the item (mesh, control or 2d coordiantes) to add
  8562. * @returns the created MultiLinePoint
  8563. */
  8564. MultiLine.prototype.push = function (item) {
  8565. var point = this.getAt(this._points.length);
  8566. if (item == null) {
  8567. return point;
  8568. }
  8569. if (item instanceof babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1__["AbstractMesh"]) {
  8570. point.mesh = item;
  8571. }
  8572. else if (item instanceof _control__WEBPACK_IMPORTED_MODULE_2__["Control"]) {
  8573. point.control = item;
  8574. }
  8575. else if (item.x != null && item.y != null) {
  8576. point.x = item.x;
  8577. point.y = item.y;
  8578. }
  8579. return point;
  8580. };
  8581. /**
  8582. * Remove a specific value or point from the active point collection
  8583. * @param value defines the value or point to remove
  8584. */
  8585. MultiLine.prototype.remove = function (value) {
  8586. var index;
  8587. if (value instanceof _multiLinePoint__WEBPACK_IMPORTED_MODULE_3__["MultiLinePoint"]) {
  8588. index = this._points.indexOf(value);
  8589. if (index === -1) {
  8590. return;
  8591. }
  8592. }
  8593. else {
  8594. index = value;
  8595. }
  8596. var point = this._points[index];
  8597. if (!point) {
  8598. return;
  8599. }
  8600. point.dispose();
  8601. this._points.splice(index, 1);
  8602. };
  8603. /**
  8604. * Resets this object to initial state (no point)
  8605. */
  8606. MultiLine.prototype.reset = function () {
  8607. while (this._points.length > 0) {
  8608. this.remove(this._points.length - 1);
  8609. }
  8610. };
  8611. /**
  8612. * Resets all links
  8613. */
  8614. MultiLine.prototype.resetLinks = function () {
  8615. this._points.forEach(function (point) {
  8616. if (point != null) {
  8617. point.resetLinks();
  8618. }
  8619. });
  8620. };
  8621. Object.defineProperty(MultiLine.prototype, "lineWidth", {
  8622. /** Gets or sets line width */
  8623. get: function () {
  8624. return this._lineWidth;
  8625. },
  8626. set: function (value) {
  8627. if (this._lineWidth === value) {
  8628. return;
  8629. }
  8630. this._lineWidth = value;
  8631. this._markAsDirty();
  8632. },
  8633. enumerable: false,
  8634. configurable: true
  8635. });
  8636. Object.defineProperty(MultiLine.prototype, "horizontalAlignment", {
  8637. set: function (value) {
  8638. return;
  8639. },
  8640. enumerable: false,
  8641. configurable: true
  8642. });
  8643. Object.defineProperty(MultiLine.prototype, "verticalAlignment", {
  8644. set: function (value) {
  8645. return;
  8646. },
  8647. enumerable: false,
  8648. configurable: true
  8649. });
  8650. MultiLine.prototype._getTypeName = function () {
  8651. return "MultiLine";
  8652. };
  8653. MultiLine.prototype._draw = function (context, invalidatedRectangle) {
  8654. context.save();
  8655. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  8656. context.shadowColor = this.shadowColor;
  8657. context.shadowBlur = this.shadowBlur;
  8658. context.shadowOffsetX = this.shadowOffsetX;
  8659. context.shadowOffsetY = this.shadowOffsetY;
  8660. }
  8661. this._applyStates(context);
  8662. context.strokeStyle = this.color;
  8663. context.lineWidth = this._lineWidth;
  8664. context.setLineDash(this._dash);
  8665. context.beginPath();
  8666. var first = true; //first index is not necessarily 0
  8667. this._points.forEach(function (point) {
  8668. if (!point) {
  8669. return;
  8670. }
  8671. if (first) {
  8672. context.moveTo(point._point.x, point._point.y);
  8673. first = false;
  8674. }
  8675. else {
  8676. context.lineTo(point._point.x, point._point.y);
  8677. }
  8678. });
  8679. context.stroke();
  8680. context.restore();
  8681. };
  8682. MultiLine.prototype._additionalProcessing = function (parentMeasure, context) {
  8683. var _this = this;
  8684. this._minX = null;
  8685. this._minY = null;
  8686. this._maxX = null;
  8687. this._maxY = null;
  8688. this._points.forEach(function (point, index) {
  8689. if (!point) {
  8690. return;
  8691. }
  8692. point.translate();
  8693. if (_this._minX == null || point._point.x < _this._minX) {
  8694. _this._minX = point._point.x;
  8695. }
  8696. if (_this._minY == null || point._point.y < _this._minY) {
  8697. _this._minY = point._point.y;
  8698. }
  8699. if (_this._maxX == null || point._point.x > _this._maxX) {
  8700. _this._maxX = point._point.x;
  8701. }
  8702. if (_this._maxY == null || point._point.y > _this._maxY) {
  8703. _this._maxY = point._point.y;
  8704. }
  8705. });
  8706. if (this._minX == null) {
  8707. this._minX = 0;
  8708. }
  8709. if (this._minY == null) {
  8710. this._minY = 0;
  8711. }
  8712. if (this._maxX == null) {
  8713. this._maxX = 0;
  8714. }
  8715. if (this._maxY == null) {
  8716. this._maxY = 0;
  8717. }
  8718. };
  8719. MultiLine.prototype._measure = function () {
  8720. if (this._minX == null || this._maxX == null || this._minY == null || this._maxY == null) {
  8721. return;
  8722. }
  8723. this._currentMeasure.width = Math.abs(this._maxX - this._minX) + this._lineWidth;
  8724. this._currentMeasure.height = Math.abs(this._maxY - this._minY) + this._lineWidth;
  8725. };
  8726. MultiLine.prototype._computeAlignment = function (parentMeasure, context) {
  8727. if (this._minX == null || this._minY == null) {
  8728. return;
  8729. }
  8730. this._currentMeasure.left = this._minX - this._lineWidth / 2;
  8731. this._currentMeasure.top = this._minY - this._lineWidth / 2;
  8732. };
  8733. MultiLine.prototype.dispose = function () {
  8734. this.reset();
  8735. _super.prototype.dispose.call(this);
  8736. };
  8737. return MultiLine;
  8738. }(_control__WEBPACK_IMPORTED_MODULE_2__["Control"]));
  8739. babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredTypes["BABYLON.GUI.MultiLine"] = MultiLine;
  8740. /***/ }),
  8741. /***/ "./2D/controls/radioButton.ts":
  8742. /*!************************************!*\
  8743. !*** ./2D/controls/radioButton.ts ***!
  8744. \************************************/
  8745. /*! exports provided: RadioButton */
  8746. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  8747. "use strict";
  8748. __webpack_require__.r(__webpack_exports__);
  8749. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "RadioButton", function() { return RadioButton; });
  8750. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  8751. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math.vector");
  8752. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
  8753. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  8754. /* harmony import */ var _stackPanel__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./stackPanel */ "./2D/controls/stackPanel.ts");
  8755. /* harmony import */ var _textBlock__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./textBlock */ "./2D/controls/textBlock.ts");
  8756. /**
  8757. * Class used to create radio button controls
  8758. */
  8759. var RadioButton = /** @class */ (function (_super) {
  8760. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(RadioButton, _super);
  8761. /**
  8762. * Creates a new RadioButton
  8763. * @param name defines the control name
  8764. */
  8765. function RadioButton(name) {
  8766. var _this = _super.call(this, name) || this;
  8767. _this.name = name;
  8768. _this._isChecked = false;
  8769. _this._background = "black";
  8770. _this._checkSizeRatio = 0.8;
  8771. _this._thickness = 1;
  8772. /** Gets or sets group name */
  8773. _this.group = "";
  8774. /** Observable raised when isChecked is changed */
  8775. _this.onIsCheckedChangedObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  8776. _this.isPointerBlocker = true;
  8777. return _this;
  8778. }
  8779. Object.defineProperty(RadioButton.prototype, "thickness", {
  8780. /** Gets or sets border thickness */
  8781. get: function () {
  8782. return this._thickness;
  8783. },
  8784. set: function (value) {
  8785. if (this._thickness === value) {
  8786. return;
  8787. }
  8788. this._thickness = value;
  8789. this._markAsDirty();
  8790. },
  8791. enumerable: false,
  8792. configurable: true
  8793. });
  8794. Object.defineProperty(RadioButton.prototype, "checkSizeRatio", {
  8795. /** Gets or sets a value indicating the ratio between overall size and check size */
  8796. get: function () {
  8797. return this._checkSizeRatio;
  8798. },
  8799. set: function (value) {
  8800. value = Math.max(Math.min(1, value), 0);
  8801. if (this._checkSizeRatio === value) {
  8802. return;
  8803. }
  8804. this._checkSizeRatio = value;
  8805. this._markAsDirty();
  8806. },
  8807. enumerable: false,
  8808. configurable: true
  8809. });
  8810. Object.defineProperty(RadioButton.prototype, "background", {
  8811. /** Gets or sets background color */
  8812. get: function () {
  8813. return this._background;
  8814. },
  8815. set: function (value) {
  8816. if (this._background === value) {
  8817. return;
  8818. }
  8819. this._background = value;
  8820. this._markAsDirty();
  8821. },
  8822. enumerable: false,
  8823. configurable: true
  8824. });
  8825. Object.defineProperty(RadioButton.prototype, "isChecked", {
  8826. /** Gets or sets a boolean indicating if the checkbox is checked or not */
  8827. get: function () {
  8828. return this._isChecked;
  8829. },
  8830. set: function (value) {
  8831. var _this = this;
  8832. if (this._isChecked === value) {
  8833. return;
  8834. }
  8835. this._isChecked = value;
  8836. this._markAsDirty();
  8837. this.onIsCheckedChangedObservable.notifyObservers(value);
  8838. if (this._isChecked && this._host) {
  8839. // Update all controls from same group
  8840. this._host.executeOnAllControls(function (control) {
  8841. if (control === _this) {
  8842. return;
  8843. }
  8844. if (control.group === undefined) {
  8845. return;
  8846. }
  8847. var childRadio = control;
  8848. if (childRadio.group === _this.group) {
  8849. childRadio.isChecked = false;
  8850. }
  8851. });
  8852. }
  8853. },
  8854. enumerable: false,
  8855. configurable: true
  8856. });
  8857. RadioButton.prototype._getTypeName = function () {
  8858. return "RadioButton";
  8859. };
  8860. RadioButton.prototype._draw = function (context) {
  8861. context.save();
  8862. this._applyStates(context);
  8863. var actualWidth = this._currentMeasure.width - this._thickness;
  8864. var actualHeight = this._currentMeasure.height - this._thickness;
  8865. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  8866. context.shadowColor = this.shadowColor;
  8867. context.shadowBlur = this.shadowBlur;
  8868. context.shadowOffsetX = this.shadowOffsetX;
  8869. context.shadowOffsetY = this.shadowOffsetY;
  8870. }
  8871. // Outer
  8872. _control__WEBPACK_IMPORTED_MODULE_2__["Control"].drawEllipse(this._currentMeasure.left + this._currentMeasure.width / 2, this._currentMeasure.top + this._currentMeasure.height / 2, this._currentMeasure.width / 2 - this._thickness / 2, this._currentMeasure.height / 2 - this._thickness / 2, context);
  8873. context.fillStyle = this._isEnabled ? this._background : this._disabledColor;
  8874. context.fill();
  8875. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  8876. context.shadowBlur = 0;
  8877. context.shadowOffsetX = 0;
  8878. context.shadowOffsetY = 0;
  8879. }
  8880. context.strokeStyle = this.color;
  8881. context.lineWidth = this._thickness;
  8882. context.stroke();
  8883. // Inner
  8884. if (this._isChecked) {
  8885. context.fillStyle = this._isEnabled ? this.color : this._disabledColor;
  8886. var offsetWidth = actualWidth * this._checkSizeRatio;
  8887. var offseHeight = actualHeight * this._checkSizeRatio;
  8888. _control__WEBPACK_IMPORTED_MODULE_2__["Control"].drawEllipse(this._currentMeasure.left + this._currentMeasure.width / 2, this._currentMeasure.top + this._currentMeasure.height / 2, offsetWidth / 2 - this._thickness / 2, offseHeight / 2 - this._thickness / 2, context);
  8889. context.fill();
  8890. }
  8891. context.restore();
  8892. };
  8893. // Events
  8894. RadioButton.prototype._onPointerDown = function (target, coordinates, pointerId, buttonIndex) {
  8895. if (!_super.prototype._onPointerDown.call(this, target, coordinates, pointerId, buttonIndex)) {
  8896. return false;
  8897. }
  8898. if (!this.isChecked) {
  8899. this.isChecked = true;
  8900. }
  8901. return true;
  8902. };
  8903. /**
  8904. * Utility function to easily create a radio button with a header
  8905. * @param title defines the label to use for the header
  8906. * @param group defines the group to use for the radio button
  8907. * @param isChecked defines the initial state of the radio button
  8908. * @param onValueChanged defines the callback to call when value changes
  8909. * @returns a StackPanel containing the radio button and a textBlock
  8910. */
  8911. RadioButton.AddRadioButtonWithHeader = function (title, group, isChecked, onValueChanged) {
  8912. var panel = new _stackPanel__WEBPACK_IMPORTED_MODULE_3__["StackPanel"]();
  8913. panel.isVertical = false;
  8914. panel.height = "30px";
  8915. var radio = new RadioButton();
  8916. radio.width = "20px";
  8917. radio.height = "20px";
  8918. radio.isChecked = isChecked;
  8919. radio.color = "green";
  8920. radio.group = group;
  8921. radio.onIsCheckedChangedObservable.add(function (value) { return onValueChanged(radio, value); });
  8922. panel.addControl(radio);
  8923. var header = new _textBlock__WEBPACK_IMPORTED_MODULE_4__["TextBlock"]();
  8924. header.text = title;
  8925. header.width = "180px";
  8926. header.paddingLeft = "5px";
  8927. header.textHorizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_2__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  8928. header.color = "white";
  8929. panel.addControl(header);
  8930. return panel;
  8931. };
  8932. return RadioButton;
  8933. }(_control__WEBPACK_IMPORTED_MODULE_2__["Control"]));
  8934. babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredTypes["BABYLON.GUI.RadioButton"] = RadioButton;
  8935. /***/ }),
  8936. /***/ "./2D/controls/rectangle.ts":
  8937. /*!**********************************!*\
  8938. !*** ./2D/controls/rectangle.ts ***!
  8939. \**********************************/
  8940. /*! exports provided: Rectangle */
  8941. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  8942. "use strict";
  8943. __webpack_require__.r(__webpack_exports__);
  8944. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Rectangle", function() { return Rectangle; });
  8945. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  8946. /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./container */ "./2D/controls/container.ts");
  8947. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math.vector");
  8948. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__);
  8949. /** Class used to create rectangle container */
  8950. var Rectangle = /** @class */ (function (_super) {
  8951. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(Rectangle, _super);
  8952. /**
  8953. * Creates a new Rectangle
  8954. * @param name defines the control name
  8955. */
  8956. function Rectangle(name) {
  8957. var _this = _super.call(this, name) || this;
  8958. _this.name = name;
  8959. _this._thickness = 1;
  8960. _this._cornerRadius = 0;
  8961. return _this;
  8962. }
  8963. Object.defineProperty(Rectangle.prototype, "thickness", {
  8964. /** Gets or sets border thickness */
  8965. get: function () {
  8966. return this._thickness;
  8967. },
  8968. set: function (value) {
  8969. if (this._thickness === value) {
  8970. return;
  8971. }
  8972. this._thickness = value;
  8973. this._markAsDirty();
  8974. },
  8975. enumerable: false,
  8976. configurable: true
  8977. });
  8978. Object.defineProperty(Rectangle.prototype, "cornerRadius", {
  8979. /** Gets or sets the corner radius angle */
  8980. get: function () {
  8981. return this._cornerRadius;
  8982. },
  8983. set: function (value) {
  8984. if (value < 0) {
  8985. value = 0;
  8986. }
  8987. if (this._cornerRadius === value) {
  8988. return;
  8989. }
  8990. this._cornerRadius = value;
  8991. this._markAsDirty();
  8992. },
  8993. enumerable: false,
  8994. configurable: true
  8995. });
  8996. Rectangle.prototype._getTypeName = function () {
  8997. return "Rectangle";
  8998. };
  8999. Rectangle.prototype._localDraw = function (context) {
  9000. context.save();
  9001. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  9002. context.shadowColor = this.shadowColor;
  9003. context.shadowBlur = this.shadowBlur;
  9004. context.shadowOffsetX = this.shadowOffsetX;
  9005. context.shadowOffsetY = this.shadowOffsetY;
  9006. }
  9007. if (this._background) {
  9008. context.fillStyle = this._background;
  9009. if (this._cornerRadius) {
  9010. this._drawRoundedRect(context, this._thickness / 2);
  9011. context.fill();
  9012. }
  9013. else {
  9014. context.fillRect(this._currentMeasure.left, this._currentMeasure.top, this._currentMeasure.width, this._currentMeasure.height);
  9015. }
  9016. }
  9017. if (this._thickness) {
  9018. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  9019. context.shadowBlur = 0;
  9020. context.shadowOffsetX = 0;
  9021. context.shadowOffsetY = 0;
  9022. }
  9023. if (this.color) {
  9024. context.strokeStyle = this.color;
  9025. }
  9026. context.lineWidth = this._thickness;
  9027. if (this._cornerRadius) {
  9028. this._drawRoundedRect(context, this._thickness / 2);
  9029. context.stroke();
  9030. }
  9031. else {
  9032. context.strokeRect(this._currentMeasure.left + this._thickness / 2, this._currentMeasure.top + this._thickness / 2, this._currentMeasure.width - this._thickness, this._currentMeasure.height - this._thickness);
  9033. }
  9034. }
  9035. context.restore();
  9036. };
  9037. Rectangle.prototype._additionalProcessing = function (parentMeasure, context) {
  9038. _super.prototype._additionalProcessing.call(this, parentMeasure, context);
  9039. this._measureForChildren.width -= 2 * this._thickness;
  9040. this._measureForChildren.height -= 2 * this._thickness;
  9041. this._measureForChildren.left += this._thickness;
  9042. this._measureForChildren.top += this._thickness;
  9043. };
  9044. Rectangle.prototype._drawRoundedRect = function (context, offset) {
  9045. if (offset === void 0) { offset = 0; }
  9046. var x = this._currentMeasure.left + offset;
  9047. var y = this._currentMeasure.top + offset;
  9048. var width = this._currentMeasure.width - offset * 2;
  9049. var height = this._currentMeasure.height - offset * 2;
  9050. var radius = Math.min(height / 2 - 2, Math.min(width / 2 - 2, this._cornerRadius));
  9051. context.beginPath();
  9052. context.moveTo(x + radius, y);
  9053. context.lineTo(x + width - radius, y);
  9054. context.quadraticCurveTo(x + width, y, x + width, y + radius);
  9055. context.lineTo(x + width, y + height - radius);
  9056. context.quadraticCurveTo(x + width, y + height, x + width - radius, y + height);
  9057. context.lineTo(x + radius, y + height);
  9058. context.quadraticCurveTo(x, y + height, x, y + height - radius);
  9059. context.lineTo(x, y + radius);
  9060. context.quadraticCurveTo(x, y, x + radius, y);
  9061. context.closePath();
  9062. };
  9063. Rectangle.prototype._clipForChildren = function (context) {
  9064. if (this._cornerRadius) {
  9065. this._drawRoundedRect(context, this._thickness);
  9066. context.clip();
  9067. }
  9068. };
  9069. return Rectangle;
  9070. }(_container__WEBPACK_IMPORTED_MODULE_1__["Container"]));
  9071. babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__["_TypeStore"].RegisteredTypes["BABYLON.GUI.Rectangle"] = Rectangle;
  9072. /***/ }),
  9073. /***/ "./2D/controls/scrollViewers/scrollViewer.ts":
  9074. /*!***************************************************!*\
  9075. !*** ./2D/controls/scrollViewers/scrollViewer.ts ***!
  9076. \***************************************************/
  9077. /*! exports provided: ScrollViewer */
  9078. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  9079. "use strict";
  9080. __webpack_require__.r(__webpack_exports__);
  9081. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ScrollViewer", function() { return ScrollViewer; });
  9082. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  9083. /* harmony import */ var _rectangle__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../rectangle */ "./2D/controls/rectangle.ts");
  9084. /* harmony import */ var _grid__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../grid */ "./2D/controls/grid.ts");
  9085. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../control */ "./2D/controls/control.ts");
  9086. /* harmony import */ var _scrollViewerWindow__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./scrollViewerWindow */ "./2D/controls/scrollViewers/scrollViewerWindow.ts");
  9087. /* harmony import */ var _sliders_scrollBar__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../sliders/scrollBar */ "./2D/controls/sliders/scrollBar.ts");
  9088. /* harmony import */ var _sliders_imageScrollBar__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../sliders/imageScrollBar */ "./2D/controls/sliders/imageScrollBar.ts");
  9089. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math.vector");
  9090. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_7__);
  9091. /**
  9092. * Class used to hold a viewer window and sliders in a grid
  9093. */
  9094. var ScrollViewer = /** @class */ (function (_super) {
  9095. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(ScrollViewer, _super);
  9096. /**
  9097. * Creates a new ScrollViewer
  9098. * @param name of ScrollViewer
  9099. */
  9100. function ScrollViewer(name, isImageBased) {
  9101. var _this = _super.call(this, name) || this;
  9102. _this._barSize = 20;
  9103. _this._pointerIsOver = false;
  9104. _this._wheelPrecision = 0.05;
  9105. _this._thumbLength = 0.5;
  9106. _this._thumbHeight = 1;
  9107. _this._barImageHeight = 1;
  9108. _this._horizontalBarImageHeight = 1;
  9109. _this._verticalBarImageHeight = 1;
  9110. _this._oldWindowContentsWidth = 0;
  9111. _this._oldWindowContentsHeight = 0;
  9112. _this._forceHorizontalBar = false;
  9113. _this._forceVerticalBar = false;
  9114. _this._useImageBar = isImageBased ? isImageBased : false;
  9115. _this.onDirtyObservable.add(function () {
  9116. _this._horizontalBarSpace.color = _this.color;
  9117. _this._verticalBarSpace.color = _this.color;
  9118. _this._dragSpace.color = _this.color;
  9119. });
  9120. _this.onPointerEnterObservable.add(function () {
  9121. _this._pointerIsOver = true;
  9122. });
  9123. _this.onPointerOutObservable.add(function () {
  9124. _this._pointerIsOver = false;
  9125. });
  9126. _this._grid = new _grid__WEBPACK_IMPORTED_MODULE_2__["Grid"]();
  9127. if (_this._useImageBar) {
  9128. _this._horizontalBar = new _sliders_imageScrollBar__WEBPACK_IMPORTED_MODULE_6__["ImageScrollBar"]();
  9129. _this._verticalBar = new _sliders_imageScrollBar__WEBPACK_IMPORTED_MODULE_6__["ImageScrollBar"]();
  9130. }
  9131. else {
  9132. _this._horizontalBar = new _sliders_scrollBar__WEBPACK_IMPORTED_MODULE_5__["ScrollBar"]();
  9133. _this._verticalBar = new _sliders_scrollBar__WEBPACK_IMPORTED_MODULE_5__["ScrollBar"]();
  9134. }
  9135. _this._window = new _scrollViewerWindow__WEBPACK_IMPORTED_MODULE_4__["_ScrollViewerWindow"]("scrollViewer_window");
  9136. _this._window.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  9137. _this._window.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].VERTICAL_ALIGNMENT_TOP;
  9138. _this._grid.addColumnDefinition(1);
  9139. _this._grid.addColumnDefinition(0, true);
  9140. _this._grid.addRowDefinition(1);
  9141. _this._grid.addRowDefinition(0, true);
  9142. _super.prototype.addControl.call(_this, _this._grid);
  9143. _this._grid.addControl(_this._window, 0, 0);
  9144. _this._verticalBarSpace = new _rectangle__WEBPACK_IMPORTED_MODULE_1__["Rectangle"]();
  9145. _this._verticalBarSpace.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  9146. _this._verticalBarSpace.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].VERTICAL_ALIGNMENT_TOP;
  9147. _this._verticalBarSpace.thickness = 1;
  9148. _this._grid.addControl(_this._verticalBarSpace, 0, 1);
  9149. _this._addBar(_this._verticalBar, _this._verticalBarSpace, true, Math.PI);
  9150. _this._horizontalBarSpace = new _rectangle__WEBPACK_IMPORTED_MODULE_1__["Rectangle"]();
  9151. _this._horizontalBarSpace.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  9152. _this._horizontalBarSpace.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].VERTICAL_ALIGNMENT_TOP;
  9153. _this._horizontalBarSpace.thickness = 1;
  9154. _this._grid.addControl(_this._horizontalBarSpace, 1, 0);
  9155. _this._addBar(_this._horizontalBar, _this._horizontalBarSpace, false, 0);
  9156. _this._dragSpace = new _rectangle__WEBPACK_IMPORTED_MODULE_1__["Rectangle"]();
  9157. _this._dragSpace.thickness = 1;
  9158. _this._grid.addControl(_this._dragSpace, 1, 1);
  9159. // Colors
  9160. if (!_this._useImageBar) {
  9161. _this.barColor = "grey";
  9162. _this.barBackground = "transparent";
  9163. }
  9164. return _this;
  9165. }
  9166. Object.defineProperty(ScrollViewer.prototype, "horizontalBar", {
  9167. /**
  9168. * Gets the horizontal scrollbar
  9169. */
  9170. get: function () {
  9171. return this._horizontalBar;
  9172. },
  9173. enumerable: false,
  9174. configurable: true
  9175. });
  9176. Object.defineProperty(ScrollViewer.prototype, "verticalBar", {
  9177. /**
  9178. * Gets the vertical scrollbar
  9179. */
  9180. get: function () {
  9181. return this._verticalBar;
  9182. },
  9183. enumerable: false,
  9184. configurable: true
  9185. });
  9186. /**
  9187. * Adds a new control to the current container
  9188. * @param control defines the control to add
  9189. * @returns the current container
  9190. */
  9191. ScrollViewer.prototype.addControl = function (control) {
  9192. if (!control) {
  9193. return this;
  9194. }
  9195. this._window.addControl(control);
  9196. return this;
  9197. };
  9198. /**
  9199. * Removes a control from the current container
  9200. * @param control defines the control to remove
  9201. * @returns the current container
  9202. */
  9203. ScrollViewer.prototype.removeControl = function (control) {
  9204. this._window.removeControl(control);
  9205. return this;
  9206. };
  9207. Object.defineProperty(ScrollViewer.prototype, "children", {
  9208. /** Gets the list of children */
  9209. get: function () {
  9210. return this._window.children;
  9211. },
  9212. enumerable: false,
  9213. configurable: true
  9214. });
  9215. ScrollViewer.prototype._flagDescendantsAsMatrixDirty = function () {
  9216. for (var _i = 0, _a = this._children; _i < _a.length; _i++) {
  9217. var child = _a[_i];
  9218. child._markMatrixAsDirty();
  9219. }
  9220. };
  9221. Object.defineProperty(ScrollViewer.prototype, "freezeControls", {
  9222. /**
  9223. * Freezes or unfreezes the controls in the window.
  9224. * When controls are frozen, the scroll viewer can render a lot more quickly but updates to positions/sizes of controls
  9225. * are not taken into account. If you want to change positions/sizes, unfreeze, perform the changes then freeze again
  9226. */
  9227. get: function () {
  9228. return this._window.freezeControls;
  9229. },
  9230. set: function (value) {
  9231. this._window.freezeControls = value;
  9232. },
  9233. enumerable: false,
  9234. configurable: true
  9235. });
  9236. Object.defineProperty(ScrollViewer.prototype, "bucketWidth", {
  9237. /** Gets the bucket width */
  9238. get: function () {
  9239. return this._window.bucketWidth;
  9240. },
  9241. enumerable: false,
  9242. configurable: true
  9243. });
  9244. Object.defineProperty(ScrollViewer.prototype, "bucketHeight", {
  9245. /** Gets the bucket height */
  9246. get: function () {
  9247. return this._window.bucketHeight;
  9248. },
  9249. enumerable: false,
  9250. configurable: true
  9251. });
  9252. /**
  9253. * Sets the bucket sizes.
  9254. * When freezeControls is true, setting a non-zero bucket size will improve performances by updating only
  9255. * controls that are visible. The bucket sizes is used to subdivide (internally) the window area to smaller areas into which
  9256. * controls are dispatched. So, the size should be roughly equals to the mean size of all the controls of
  9257. * the window. To disable the usage of buckets, sets either width or height (or both) to 0.
  9258. * Please note that using this option will raise the memory usage (the higher the bucket sizes, the less memory
  9259. * used), that's why it is not enabled by default.
  9260. * @param width width of the bucket
  9261. * @param height height of the bucket
  9262. */
  9263. ScrollViewer.prototype.setBucketSizes = function (width, height) {
  9264. this._window.setBucketSizes(width, height);
  9265. };
  9266. Object.defineProperty(ScrollViewer.prototype, "forceHorizontalBar", {
  9267. /**
  9268. * Forces the horizontal scroll bar to be displayed
  9269. */
  9270. get: function () {
  9271. return this._forceHorizontalBar;
  9272. },
  9273. set: function (value) {
  9274. this._grid.setRowDefinition(1, value ? this._barSize : 0, true);
  9275. this._horizontalBar.isVisible = value;
  9276. this._forceHorizontalBar = value;
  9277. },
  9278. enumerable: false,
  9279. configurable: true
  9280. });
  9281. Object.defineProperty(ScrollViewer.prototype, "forceVerticalBar", {
  9282. /**
  9283. * Forces the vertical scroll bar to be displayed
  9284. */
  9285. get: function () {
  9286. return this._forceVerticalBar;
  9287. },
  9288. set: function (value) {
  9289. this._grid.setColumnDefinition(1, value ? this._barSize : 0, true);
  9290. this._verticalBar.isVisible = value;
  9291. this._forceVerticalBar = value;
  9292. },
  9293. enumerable: false,
  9294. configurable: true
  9295. });
  9296. /** Reset the scroll viewer window to initial size */
  9297. ScrollViewer.prototype.resetWindow = function () {
  9298. this._window.width = "100%";
  9299. this._window.height = "100%";
  9300. };
  9301. ScrollViewer.prototype._getTypeName = function () {
  9302. return "ScrollViewer";
  9303. };
  9304. ScrollViewer.prototype._buildClientSizes = function () {
  9305. var ratio = this.host.idealRatio;
  9306. this._window.parentClientWidth = this._currentMeasure.width - (this._verticalBar.isVisible || this.forceVerticalBar ? this._barSize * ratio : 0) - 2 * this.thickness;
  9307. this._window.parentClientHeight = this._currentMeasure.height - (this._horizontalBar.isVisible || this.forceHorizontalBar ? this._barSize * ratio : 0) - 2 * this.thickness;
  9308. this._clientWidth = this._window.parentClientWidth;
  9309. this._clientHeight = this._window.parentClientHeight;
  9310. };
  9311. ScrollViewer.prototype._additionalProcessing = function (parentMeasure, context) {
  9312. _super.prototype._additionalProcessing.call(this, parentMeasure, context);
  9313. this._buildClientSizes();
  9314. };
  9315. ScrollViewer.prototype._postMeasure = function () {
  9316. _super.prototype._postMeasure.call(this);
  9317. this._updateScroller();
  9318. this._setWindowPosition(false);
  9319. };
  9320. Object.defineProperty(ScrollViewer.prototype, "wheelPrecision", {
  9321. /**
  9322. * Gets or sets the mouse wheel precision
  9323. * from 0 to 1 with a default value of 0.05
  9324. * */
  9325. get: function () {
  9326. return this._wheelPrecision;
  9327. },
  9328. set: function (value) {
  9329. if (this._wheelPrecision === value) {
  9330. return;
  9331. }
  9332. if (value < 0) {
  9333. value = 0;
  9334. }
  9335. if (value > 1) {
  9336. value = 1;
  9337. }
  9338. this._wheelPrecision = value;
  9339. },
  9340. enumerable: false,
  9341. configurable: true
  9342. });
  9343. Object.defineProperty(ScrollViewer.prototype, "scrollBackground", {
  9344. /** Gets or sets the scroll bar container background color */
  9345. get: function () {
  9346. return this._horizontalBarSpace.background;
  9347. },
  9348. set: function (color) {
  9349. if (this._horizontalBarSpace.background === color) {
  9350. return;
  9351. }
  9352. this._horizontalBarSpace.background = color;
  9353. this._verticalBarSpace.background = color;
  9354. },
  9355. enumerable: false,
  9356. configurable: true
  9357. });
  9358. Object.defineProperty(ScrollViewer.prototype, "barColor", {
  9359. /** Gets or sets the bar color */
  9360. get: function () {
  9361. return this._barColor;
  9362. },
  9363. set: function (color) {
  9364. if (this._barColor === color) {
  9365. return;
  9366. }
  9367. this._barColor = color;
  9368. this._horizontalBar.color = color;
  9369. this._verticalBar.color = color;
  9370. },
  9371. enumerable: false,
  9372. configurable: true
  9373. });
  9374. Object.defineProperty(ScrollViewer.prototype, "thumbImage", {
  9375. /** Gets or sets the bar image */
  9376. get: function () {
  9377. return this._barImage;
  9378. },
  9379. set: function (value) {
  9380. if (this._barImage === value) {
  9381. return;
  9382. }
  9383. this._barImage = value;
  9384. var hb = this._horizontalBar;
  9385. var vb = this._verticalBar;
  9386. hb.thumbImage = value;
  9387. vb.thumbImage = value;
  9388. },
  9389. enumerable: false,
  9390. configurable: true
  9391. });
  9392. Object.defineProperty(ScrollViewer.prototype, "horizontalThumbImage", {
  9393. /** Gets or sets the horizontal bar image */
  9394. get: function () {
  9395. return this._horizontalBarImage;
  9396. },
  9397. set: function (value) {
  9398. if (this._horizontalBarImage === value) {
  9399. return;
  9400. }
  9401. this._horizontalBarImage = value;
  9402. var hb = this._horizontalBar;
  9403. hb.thumbImage = value;
  9404. },
  9405. enumerable: false,
  9406. configurable: true
  9407. });
  9408. Object.defineProperty(ScrollViewer.prototype, "verticalThumbImage", {
  9409. /** Gets or sets the vertical bar image */
  9410. get: function () {
  9411. return this._verticalBarImage;
  9412. },
  9413. set: function (value) {
  9414. if (this._verticalBarImage === value) {
  9415. return;
  9416. }
  9417. this._verticalBarImage = value;
  9418. var vb = this._verticalBar;
  9419. vb.thumbImage = value;
  9420. },
  9421. enumerable: false,
  9422. configurable: true
  9423. });
  9424. Object.defineProperty(ScrollViewer.prototype, "barSize", {
  9425. /** Gets or sets the size of the bar */
  9426. get: function () {
  9427. return this._barSize;
  9428. },
  9429. set: function (value) {
  9430. if (this._barSize === value) {
  9431. return;
  9432. }
  9433. this._barSize = value;
  9434. this._markAsDirty();
  9435. if (this._horizontalBar.isVisible) {
  9436. this._grid.setRowDefinition(1, this._barSize, true);
  9437. }
  9438. if (this._verticalBar.isVisible) {
  9439. this._grid.setColumnDefinition(1, this._barSize, true);
  9440. }
  9441. },
  9442. enumerable: false,
  9443. configurable: true
  9444. });
  9445. Object.defineProperty(ScrollViewer.prototype, "thumbLength", {
  9446. /** Gets or sets the length of the thumb */
  9447. get: function () {
  9448. return this._thumbLength;
  9449. },
  9450. set: function (value) {
  9451. if (this._thumbLength === value) {
  9452. return;
  9453. }
  9454. if (value <= 0) {
  9455. value = 0.1;
  9456. }
  9457. if (value > 1) {
  9458. value = 1;
  9459. }
  9460. this._thumbLength = value;
  9461. var hb = this._horizontalBar;
  9462. var vb = this._verticalBar;
  9463. hb.thumbLength = value;
  9464. vb.thumbLength = value;
  9465. this._markAsDirty();
  9466. },
  9467. enumerable: false,
  9468. configurable: true
  9469. });
  9470. Object.defineProperty(ScrollViewer.prototype, "thumbHeight", {
  9471. /** Gets or sets the height of the thumb */
  9472. get: function () {
  9473. return this._thumbHeight;
  9474. },
  9475. set: function (value) {
  9476. if (this._thumbHeight === value) {
  9477. return;
  9478. }
  9479. if (value <= 0) {
  9480. value = 0.1;
  9481. }
  9482. if (value > 1) {
  9483. value = 1;
  9484. }
  9485. this._thumbHeight = value;
  9486. var hb = this._horizontalBar;
  9487. var vb = this._verticalBar;
  9488. hb.thumbHeight = value;
  9489. vb.thumbHeight = value;
  9490. this._markAsDirty();
  9491. },
  9492. enumerable: false,
  9493. configurable: true
  9494. });
  9495. Object.defineProperty(ScrollViewer.prototype, "barImageHeight", {
  9496. /** Gets or sets the height of the bar image */
  9497. get: function () {
  9498. return this._barImageHeight;
  9499. },
  9500. set: function (value) {
  9501. if (this._barImageHeight === value) {
  9502. return;
  9503. }
  9504. if (value <= 0) {
  9505. value = 0.1;
  9506. }
  9507. if (value > 1) {
  9508. value = 1;
  9509. }
  9510. this._barImageHeight = value;
  9511. var hb = this._horizontalBar;
  9512. var vb = this._verticalBar;
  9513. hb.barImageHeight = value;
  9514. vb.barImageHeight = value;
  9515. this._markAsDirty();
  9516. },
  9517. enumerable: false,
  9518. configurable: true
  9519. });
  9520. Object.defineProperty(ScrollViewer.prototype, "horizontalBarImageHeight", {
  9521. /** Gets or sets the height of the horizontal bar image */
  9522. get: function () {
  9523. return this._horizontalBarImageHeight;
  9524. },
  9525. set: function (value) {
  9526. if (this._horizontalBarImageHeight === value) {
  9527. return;
  9528. }
  9529. if (value <= 0) {
  9530. value = 0.1;
  9531. }
  9532. if (value > 1) {
  9533. value = 1;
  9534. }
  9535. this._horizontalBarImageHeight = value;
  9536. var hb = this._horizontalBar;
  9537. hb.barImageHeight = value;
  9538. this._markAsDirty();
  9539. },
  9540. enumerable: false,
  9541. configurable: true
  9542. });
  9543. Object.defineProperty(ScrollViewer.prototype, "verticalBarImageHeight", {
  9544. /** Gets or sets the height of the vertical bar image */
  9545. get: function () {
  9546. return this._verticalBarImageHeight;
  9547. },
  9548. set: function (value) {
  9549. if (this._verticalBarImageHeight === value) {
  9550. return;
  9551. }
  9552. if (value <= 0) {
  9553. value = 0.1;
  9554. }
  9555. if (value > 1) {
  9556. value = 1;
  9557. }
  9558. this._verticalBarImageHeight = value;
  9559. var vb = this._verticalBar;
  9560. vb.barImageHeight = value;
  9561. this._markAsDirty();
  9562. },
  9563. enumerable: false,
  9564. configurable: true
  9565. });
  9566. Object.defineProperty(ScrollViewer.prototype, "barBackground", {
  9567. /** Gets or sets the bar background */
  9568. get: function () {
  9569. return this._barBackground;
  9570. },
  9571. set: function (color) {
  9572. if (this._barBackground === color) {
  9573. return;
  9574. }
  9575. this._barBackground = color;
  9576. var hb = this._horizontalBar;
  9577. var vb = this._verticalBar;
  9578. hb.background = color;
  9579. vb.background = color;
  9580. this._dragSpace.background = color;
  9581. },
  9582. enumerable: false,
  9583. configurable: true
  9584. });
  9585. Object.defineProperty(ScrollViewer.prototype, "barImage", {
  9586. /** Gets or sets the bar background image */
  9587. get: function () {
  9588. return this._barBackgroundImage;
  9589. },
  9590. set: function (value) {
  9591. if (this._barBackgroundImage === value) {
  9592. }
  9593. this._barBackgroundImage = value;
  9594. var hb = this._horizontalBar;
  9595. var vb = this._verticalBar;
  9596. hb.backgroundImage = value;
  9597. vb.backgroundImage = value;
  9598. },
  9599. enumerable: false,
  9600. configurable: true
  9601. });
  9602. Object.defineProperty(ScrollViewer.prototype, "horizontalBarImage", {
  9603. /** Gets or sets the horizontal bar background image */
  9604. get: function () {
  9605. return this._horizontalBarBackgroundImage;
  9606. },
  9607. set: function (value) {
  9608. if (this._horizontalBarBackgroundImage === value) {
  9609. }
  9610. this._horizontalBarBackgroundImage = value;
  9611. var hb = this._horizontalBar;
  9612. hb.backgroundImage = value;
  9613. },
  9614. enumerable: false,
  9615. configurable: true
  9616. });
  9617. Object.defineProperty(ScrollViewer.prototype, "verticalBarImage", {
  9618. /** Gets or sets the vertical bar background image */
  9619. get: function () {
  9620. return this._verticalBarBackgroundImage;
  9621. },
  9622. set: function (value) {
  9623. if (this._verticalBarBackgroundImage === value) {
  9624. }
  9625. this._verticalBarBackgroundImage = value;
  9626. var vb = this._verticalBar;
  9627. vb.backgroundImage = value;
  9628. },
  9629. enumerable: false,
  9630. configurable: true
  9631. });
  9632. ScrollViewer.prototype._setWindowPosition = function (force) {
  9633. if (force === void 0) { force = true; }
  9634. var ratio = this.host.idealRatio;
  9635. var windowContentsWidth = this._window._currentMeasure.width;
  9636. var windowContentsHeight = this._window._currentMeasure.height;
  9637. if (!force && this._oldWindowContentsWidth === windowContentsWidth && this._oldWindowContentsHeight === windowContentsHeight) {
  9638. return;
  9639. }
  9640. this._oldWindowContentsWidth = windowContentsWidth;
  9641. this._oldWindowContentsHeight = windowContentsHeight;
  9642. var _endLeft = this._clientWidth - windowContentsWidth;
  9643. var _endTop = this._clientHeight - windowContentsHeight;
  9644. var newLeft = (this._horizontalBar.value / ratio) * _endLeft + "px";
  9645. var newTop = (this._verticalBar.value / ratio) * _endTop + "px";
  9646. if (newLeft !== this._window.left) {
  9647. this._window.left = newLeft;
  9648. if (!this.freezeControls) {
  9649. this._rebuildLayout = true;
  9650. }
  9651. }
  9652. if (newTop !== this._window.top) {
  9653. this._window.top = newTop;
  9654. if (!this.freezeControls) {
  9655. this._rebuildLayout = true;
  9656. }
  9657. }
  9658. };
  9659. /** @hidden */
  9660. ScrollViewer.prototype._updateScroller = function () {
  9661. var windowContentsWidth = this._window._currentMeasure.width;
  9662. var windowContentsHeight = this._window._currentMeasure.height;
  9663. if (this._horizontalBar.isVisible && windowContentsWidth <= this._clientWidth && !this.forceHorizontalBar) {
  9664. this._grid.setRowDefinition(1, 0, true);
  9665. this._horizontalBar.isVisible = false;
  9666. this._horizontalBar.value = 0;
  9667. this._rebuildLayout = true;
  9668. }
  9669. else if (!this._horizontalBar.isVisible && (windowContentsWidth > this._clientWidth || this.forceHorizontalBar)) {
  9670. this._grid.setRowDefinition(1, this._barSize, true);
  9671. this._horizontalBar.isVisible = true;
  9672. this._rebuildLayout = true;
  9673. }
  9674. if (this._verticalBar.isVisible && windowContentsHeight <= this._clientHeight && !this.forceVerticalBar) {
  9675. this._grid.setColumnDefinition(1, 0, true);
  9676. this._verticalBar.isVisible = false;
  9677. this._verticalBar.value = 0;
  9678. this._rebuildLayout = true;
  9679. }
  9680. else if (!this._verticalBar.isVisible && (windowContentsHeight > this._clientHeight || this.forceVerticalBar)) {
  9681. this._grid.setColumnDefinition(1, this._barSize, true);
  9682. this._verticalBar.isVisible = true;
  9683. this._rebuildLayout = true;
  9684. }
  9685. this._buildClientSizes();
  9686. var ratio = this.host.idealRatio;
  9687. this._horizontalBar.thumbWidth = this._thumbLength * 0.9 * (this._clientWidth / ratio) + "px";
  9688. this._verticalBar.thumbWidth = this._thumbLength * 0.9 * (this._clientHeight / ratio) + "px";
  9689. };
  9690. ScrollViewer.prototype._link = function (host) {
  9691. _super.prototype._link.call(this, host);
  9692. this._attachWheel();
  9693. };
  9694. /** @hidden */
  9695. ScrollViewer.prototype._addBar = function (barControl, barContainer, isVertical, rotation) {
  9696. var _this = this;
  9697. barControl.paddingLeft = 0;
  9698. barControl.width = "100%";
  9699. barControl.height = "100%";
  9700. barControl.barOffset = 0;
  9701. barControl.value = 0;
  9702. barControl.maximum = 1;
  9703. barControl.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_CENTER;
  9704. barControl.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].VERTICAL_ALIGNMENT_CENTER;
  9705. barControl.isVertical = isVertical;
  9706. barControl.rotation = rotation;
  9707. barControl.isVisible = false;
  9708. barContainer.addControl(barControl);
  9709. barControl.onValueChangedObservable.add(function (value) {
  9710. _this._setWindowPosition();
  9711. });
  9712. };
  9713. /** @hidden */
  9714. ScrollViewer.prototype._attachWheel = function () {
  9715. var _this = this;
  9716. if (!this._host || this._onWheelObserver) {
  9717. return;
  9718. }
  9719. this._onWheelObserver = this.onWheelObservable.add(function (pi) {
  9720. if (!_this._pointerIsOver) {
  9721. return;
  9722. }
  9723. if (_this._verticalBar.isVisible == true) {
  9724. if (pi.y < 0 && _this._verticalBar.value > 0) {
  9725. _this._verticalBar.value -= _this._wheelPrecision;
  9726. }
  9727. else if (pi.y > 0 && _this._verticalBar.value < _this._verticalBar.maximum) {
  9728. _this._verticalBar.value += _this._wheelPrecision;
  9729. }
  9730. }
  9731. if (_this._horizontalBar.isVisible == true) {
  9732. if (pi.x < 0 && _this._horizontalBar.value < _this._horizontalBar.maximum) {
  9733. _this._horizontalBar.value += _this._wheelPrecision;
  9734. }
  9735. else if (pi.x > 0 && _this._horizontalBar.value > 0) {
  9736. _this._horizontalBar.value -= _this._wheelPrecision;
  9737. }
  9738. }
  9739. });
  9740. };
  9741. ScrollViewer.prototype._renderHighlightSpecific = function (context) {
  9742. if (!this.isHighlighted) {
  9743. return;
  9744. }
  9745. _super.prototype._renderHighlightSpecific.call(this, context);
  9746. this._grid._renderHighlightSpecific(context);
  9747. context.restore();
  9748. };
  9749. /** Releases associated resources */
  9750. ScrollViewer.prototype.dispose = function () {
  9751. this.onWheelObservable.remove(this._onWheelObserver);
  9752. this._onWheelObserver = null;
  9753. _super.prototype.dispose.call(this);
  9754. };
  9755. return ScrollViewer;
  9756. }(_rectangle__WEBPACK_IMPORTED_MODULE_1__["Rectangle"]));
  9757. babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_7__["_TypeStore"].RegisteredTypes["BABYLON.GUI.ScrollViewer"] = ScrollViewer;
  9758. /***/ }),
  9759. /***/ "./2D/controls/scrollViewers/scrollViewerWindow.ts":
  9760. /*!*********************************************************!*\
  9761. !*** ./2D/controls/scrollViewers/scrollViewerWindow.ts ***!
  9762. \*********************************************************/
  9763. /*! exports provided: _ScrollViewerWindow */
  9764. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  9765. "use strict";
  9766. __webpack_require__.r(__webpack_exports__);
  9767. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "_ScrollViewerWindow", function() { return _ScrollViewerWindow; });
  9768. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  9769. /* harmony import */ var _measure__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../measure */ "./2D/measure.ts");
  9770. /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../container */ "./2D/controls/container.ts");
  9771. /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../valueAndUnit */ "./2D/valueAndUnit.ts");
  9772. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../control */ "./2D/controls/control.ts");
  9773. /**
  9774. * Class used to hold a the container for ScrollViewer
  9775. * @hidden
  9776. */
  9777. var _ScrollViewerWindow = /** @class */ (function (_super) {
  9778. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(_ScrollViewerWindow, _super);
  9779. /**
  9780. * Creates a new ScrollViewerWindow
  9781. * @param name of ScrollViewerWindow
  9782. */
  9783. function _ScrollViewerWindow(name) {
  9784. var _this = _super.call(this, name) || this;
  9785. _this._freezeControls = false;
  9786. _this._bucketWidth = 0;
  9787. _this._bucketHeight = 0;
  9788. _this._buckets = {};
  9789. return _this;
  9790. }
  9791. Object.defineProperty(_ScrollViewerWindow.prototype, "freezeControls", {
  9792. get: function () {
  9793. return this._freezeControls;
  9794. },
  9795. set: function (value) {
  9796. if (this._freezeControls === value) {
  9797. return;
  9798. }
  9799. if (!value) {
  9800. this._restoreMeasures();
  9801. }
  9802. // trigger a full normal layout calculation to be sure all children have their measures up to date
  9803. this._freezeControls = false;
  9804. var textureSize = this.host.getSize();
  9805. var renderWidth = textureSize.width;
  9806. var renderHeight = textureSize.height;
  9807. var context = this.host.getContext();
  9808. var measure = new _measure__WEBPACK_IMPORTED_MODULE_1__["Measure"](0, 0, renderWidth, renderHeight);
  9809. this.host._numLayoutCalls = 0;
  9810. this.host._rootContainer._layout(measure, context);
  9811. // in freeze mode, prepare children measures accordingly
  9812. if (value) {
  9813. this._updateMeasures();
  9814. if (this._useBuckets()) {
  9815. this._makeBuckets();
  9816. }
  9817. }
  9818. this._freezeControls = value;
  9819. this.host.markAsDirty(); // redraw with the (new) current settings
  9820. },
  9821. enumerable: false,
  9822. configurable: true
  9823. });
  9824. Object.defineProperty(_ScrollViewerWindow.prototype, "bucketWidth", {
  9825. get: function () {
  9826. return this._bucketWidth;
  9827. },
  9828. enumerable: false,
  9829. configurable: true
  9830. });
  9831. Object.defineProperty(_ScrollViewerWindow.prototype, "bucketHeight", {
  9832. get: function () {
  9833. return this._bucketHeight;
  9834. },
  9835. enumerable: false,
  9836. configurable: true
  9837. });
  9838. _ScrollViewerWindow.prototype.setBucketSizes = function (width, height) {
  9839. this._bucketWidth = width;
  9840. this._bucketHeight = height;
  9841. if (this._useBuckets()) {
  9842. if (this._freezeControls) {
  9843. this._makeBuckets();
  9844. }
  9845. }
  9846. else {
  9847. this._buckets = {};
  9848. }
  9849. };
  9850. _ScrollViewerWindow.prototype._useBuckets = function () {
  9851. return this._bucketWidth > 0 && this._bucketHeight > 0;
  9852. };
  9853. _ScrollViewerWindow.prototype._makeBuckets = function () {
  9854. this._buckets = {};
  9855. this._bucketLen = Math.ceil(this.widthInPixels / this._bucketWidth);
  9856. this._dispatchInBuckets(this._children);
  9857. this._oldLeft = null;
  9858. this._oldTop = null;
  9859. };
  9860. _ScrollViewerWindow.prototype._dispatchInBuckets = function (children) {
  9861. for (var i = 0; i < children.length; ++i) {
  9862. var child = children[i];
  9863. var bStartX = Math.max(0, Math.floor((child._customData._origLeft - this._customData.origLeft) / this._bucketWidth)), bEndX = Math.floor((child._customData._origLeft - this._customData.origLeft + child._currentMeasure.width - 1) / this._bucketWidth), bStartY = Math.max(0, Math.floor((child._customData._origTop - this._customData.origTop) / this._bucketHeight)), bEndY = Math.floor((child._customData._origTop - this._customData.origTop + child._currentMeasure.height - 1) / this._bucketHeight);
  9864. while (bStartY <= bEndY) {
  9865. for (var x = bStartX; x <= bEndX; ++x) {
  9866. var bucket = bStartY * this._bucketLen + x, lstc = this._buckets[bucket];
  9867. if (!lstc) {
  9868. lstc = [];
  9869. this._buckets[bucket] = lstc;
  9870. }
  9871. lstc.push(child);
  9872. }
  9873. bStartY++;
  9874. }
  9875. if (child instanceof _container__WEBPACK_IMPORTED_MODULE_2__["Container"] && child._children.length > 0) {
  9876. this._dispatchInBuckets(child._children);
  9877. }
  9878. }
  9879. };
  9880. // reset left and top measures for the window and all its children
  9881. _ScrollViewerWindow.prototype._updateMeasures = function () {
  9882. var left = this.leftInPixels | 0, top = this.topInPixels | 0;
  9883. this._measureForChildren.left -= left;
  9884. this._measureForChildren.top -= top;
  9885. this._currentMeasure.left -= left;
  9886. this._currentMeasure.top -= top;
  9887. this._customData.origLeftForChildren = this._measureForChildren.left;
  9888. this._customData.origTopForChildren = this._measureForChildren.top;
  9889. this._customData.origLeft = this._currentMeasure.left;
  9890. this._customData.origTop = this._currentMeasure.top;
  9891. this._updateChildrenMeasures(this._children, left, top);
  9892. };
  9893. _ScrollViewerWindow.prototype._updateChildrenMeasures = function (children, left, top) {
  9894. for (var i = 0; i < children.length; ++i) {
  9895. var child = children[i];
  9896. child._currentMeasure.left -= left;
  9897. child._currentMeasure.top -= top;
  9898. child._customData._origLeft = child._currentMeasure.left; // save the original left and top values for each child
  9899. child._customData._origTop = child._currentMeasure.top;
  9900. if (child instanceof _container__WEBPACK_IMPORTED_MODULE_2__["Container"] && child._children.length > 0) {
  9901. this._updateChildrenMeasures(child._children, left, top);
  9902. }
  9903. }
  9904. };
  9905. _ScrollViewerWindow.prototype._restoreMeasures = function () {
  9906. var left = this.leftInPixels | 0, top = this.topInPixels | 0;
  9907. this._measureForChildren.left = this._customData.origLeftForChildren + left;
  9908. this._measureForChildren.top = this._customData.origTopForChildren + top;
  9909. this._currentMeasure.left = this._customData.origLeft + left;
  9910. this._currentMeasure.top = this._customData.origTop + top;
  9911. };
  9912. _ScrollViewerWindow.prototype._getTypeName = function () {
  9913. return "ScrollViewerWindow";
  9914. };
  9915. /** @hidden */
  9916. _ScrollViewerWindow.prototype._additionalProcessing = function (parentMeasure, context) {
  9917. _super.prototype._additionalProcessing.call(this, parentMeasure, context);
  9918. this._parentMeasure = parentMeasure;
  9919. this._measureForChildren.left = this._currentMeasure.left;
  9920. this._measureForChildren.top = this._currentMeasure.top;
  9921. this._measureForChildren.width = parentMeasure.width;
  9922. this._measureForChildren.height = parentMeasure.height;
  9923. };
  9924. /** @hidden */
  9925. _ScrollViewerWindow.prototype._layout = function (parentMeasure, context) {
  9926. if (this._freezeControls) {
  9927. this.invalidateRect(); // will trigger a redraw of the window
  9928. return false;
  9929. }
  9930. return _super.prototype._layout.call(this, parentMeasure, context);
  9931. };
  9932. _ScrollViewerWindow.prototype._scrollChildren = function (children, left, top) {
  9933. for (var i = 0; i < children.length; ++i) {
  9934. var child = children[i];
  9935. child._currentMeasure.left = child._customData._origLeft + left;
  9936. child._currentMeasure.top = child._customData._origTop + top;
  9937. child._isClipped = false; // clipping will be handled by _draw and the call to _intersectsRect()
  9938. if (child instanceof _container__WEBPACK_IMPORTED_MODULE_2__["Container"] && child._children.length > 0) {
  9939. this._scrollChildren(child._children, left, top);
  9940. }
  9941. }
  9942. };
  9943. _ScrollViewerWindow.prototype._scrollChildrenWithBuckets = function (left, top, scrollLeft, scrollTop) {
  9944. var bStartX = Math.max(0, Math.floor(-left / this._bucketWidth)), bEndX = Math.floor((-left + this._parentMeasure.width - 1) / this._bucketWidth), bStartY = Math.max(0, Math.floor(-top / this._bucketHeight)), bEndY = Math.floor((-top + this._parentMeasure.height - 1) / this._bucketHeight);
  9945. while (bStartY <= bEndY) {
  9946. for (var x = bStartX; x <= bEndX; ++x) {
  9947. var bucket = bStartY * this._bucketLen + x, lstc = this._buckets[bucket];
  9948. if (lstc) {
  9949. for (var i = 0; i < lstc.length; ++i) {
  9950. var child = lstc[i];
  9951. child._currentMeasure.left = child._customData._origLeft + scrollLeft;
  9952. child._currentMeasure.top = child._customData._origTop + scrollTop;
  9953. child._isClipped = false; // clipping will be handled by _draw and the call to _intersectsRect()
  9954. }
  9955. }
  9956. }
  9957. bStartY++;
  9958. }
  9959. };
  9960. /** @hidden */
  9961. _ScrollViewerWindow.prototype._draw = function (context, invalidatedRectangle) {
  9962. if (!this._freezeControls) {
  9963. _super.prototype._draw.call(this, context, invalidatedRectangle);
  9964. return;
  9965. }
  9966. this._localDraw(context);
  9967. if (this.clipChildren) {
  9968. this._clipForChildren(context);
  9969. }
  9970. var left = this.leftInPixels | 0, top = this.topInPixels | 0;
  9971. if (this._useBuckets()) {
  9972. if (this._oldLeft !== null && this._oldTop !== null) {
  9973. this._scrollChildrenWithBuckets(this._oldLeft, this._oldTop, left, top);
  9974. this._scrollChildrenWithBuckets(left, top, left, top);
  9975. }
  9976. else {
  9977. this._scrollChildren(this._children, left, top);
  9978. }
  9979. }
  9980. else {
  9981. this._scrollChildren(this._children, left, top);
  9982. }
  9983. this._oldLeft = left;
  9984. this._oldTop = top;
  9985. for (var _i = 0, _a = this._children; _i < _a.length; _i++) {
  9986. var child = _a[_i];
  9987. if (!child._intersectsRect(this._parentMeasure)) {
  9988. continue;
  9989. }
  9990. child._render(context, this._parentMeasure);
  9991. }
  9992. };
  9993. _ScrollViewerWindow.prototype._postMeasure = function () {
  9994. if (this._freezeControls) {
  9995. _super.prototype._postMeasure.call(this);
  9996. return;
  9997. }
  9998. var maxWidth = this.parentClientWidth;
  9999. var maxHeight = this.parentClientHeight;
  10000. for (var _i = 0, _a = this.children; _i < _a.length; _i++) {
  10001. var child = _a[_i];
  10002. if (!child.isVisible || child.notRenderable) {
  10003. continue;
  10004. }
  10005. if (child.horizontalAlignment === _control__WEBPACK_IMPORTED_MODULE_4__["Control"].HORIZONTAL_ALIGNMENT_CENTER) {
  10006. child._offsetLeft(this._currentMeasure.left - child._currentMeasure.left);
  10007. }
  10008. if (child.verticalAlignment === _control__WEBPACK_IMPORTED_MODULE_4__["Control"].VERTICAL_ALIGNMENT_CENTER) {
  10009. child._offsetTop(this._currentMeasure.top - child._currentMeasure.top);
  10010. }
  10011. maxWidth = Math.max(maxWidth, child._currentMeasure.left - this._currentMeasure.left + child._currentMeasure.width);
  10012. maxHeight = Math.max(maxHeight, child._currentMeasure.top - this._currentMeasure.top + child._currentMeasure.height);
  10013. }
  10014. if (this._currentMeasure.width !== maxWidth) {
  10015. this._width.updateInPlace(maxWidth, _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__["ValueAndUnit"].UNITMODE_PIXEL);
  10016. this._currentMeasure.width = maxWidth;
  10017. this._rebuildLayout = true;
  10018. this._isDirty = true;
  10019. }
  10020. if (this._currentMeasure.height !== maxHeight) {
  10021. this._height.updateInPlace(maxHeight, _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__["ValueAndUnit"].UNITMODE_PIXEL);
  10022. this._currentMeasure.height = maxHeight;
  10023. this._rebuildLayout = true;
  10024. this._isDirty = true;
  10025. }
  10026. _super.prototype._postMeasure.call(this);
  10027. };
  10028. return _ScrollViewerWindow;
  10029. }(_container__WEBPACK_IMPORTED_MODULE_2__["Container"]));
  10030. /***/ }),
  10031. /***/ "./2D/controls/selector.ts":
  10032. /*!*********************************!*\
  10033. !*** ./2D/controls/selector.ts ***!
  10034. \*********************************/
  10035. /*! exports provided: SelectorGroup, CheckboxGroup, RadioGroup, SliderGroup, SelectionPanel */
  10036. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  10037. "use strict";
  10038. __webpack_require__.r(__webpack_exports__);
  10039. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SelectorGroup", function() { return SelectorGroup; });
  10040. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "CheckboxGroup", function() { return CheckboxGroup; });
  10041. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "RadioGroup", function() { return RadioGroup; });
  10042. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SliderGroup", function() { return SliderGroup; });
  10043. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SelectionPanel", function() { return SelectionPanel; });
  10044. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  10045. /* harmony import */ var _rectangle__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./rectangle */ "./2D/controls/rectangle.ts");
  10046. /* harmony import */ var _stackPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./stackPanel */ "./2D/controls/stackPanel.ts");
  10047. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  10048. /* harmony import */ var _textBlock__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./textBlock */ "./2D/controls/textBlock.ts");
  10049. /* harmony import */ var _checkbox__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./checkbox */ "./2D/controls/checkbox.ts");
  10050. /* harmony import */ var _radioButton__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./radioButton */ "./2D/controls/radioButton.ts");
  10051. /* harmony import */ var _sliders_slider__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./sliders/slider */ "./2D/controls/sliders/slider.ts");
  10052. /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./container */ "./2D/controls/container.ts");
  10053. /** Class used to create a RadioGroup
  10054. * which contains groups of radio buttons
  10055. */
  10056. var SelectorGroup = /** @class */ (function () {
  10057. /**
  10058. * Creates a new SelectorGroup
  10059. * @param name of group, used as a group heading
  10060. */
  10061. function SelectorGroup(
  10062. /** name of SelectorGroup */
  10063. name) {
  10064. this.name = name;
  10065. this._groupPanel = new _stackPanel__WEBPACK_IMPORTED_MODULE_2__["StackPanel"]();
  10066. this._selectors = new Array();
  10067. this._groupPanel.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].VERTICAL_ALIGNMENT_TOP;
  10068. this._groupPanel.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  10069. this._groupHeader = this._addGroupHeader(name);
  10070. }
  10071. Object.defineProperty(SelectorGroup.prototype, "groupPanel", {
  10072. /** Gets the groupPanel of the SelectorGroup */
  10073. get: function () {
  10074. return this._groupPanel;
  10075. },
  10076. enumerable: false,
  10077. configurable: true
  10078. });
  10079. Object.defineProperty(SelectorGroup.prototype, "selectors", {
  10080. /** Gets the selectors array */
  10081. get: function () {
  10082. return this._selectors;
  10083. },
  10084. enumerable: false,
  10085. configurable: true
  10086. });
  10087. Object.defineProperty(SelectorGroup.prototype, "header", {
  10088. /** Gets and sets the group header */
  10089. get: function () {
  10090. return this._groupHeader.text;
  10091. },
  10092. set: function (label) {
  10093. if (this._groupHeader.text === "label") {
  10094. return;
  10095. }
  10096. this._groupHeader.text = label;
  10097. },
  10098. enumerable: false,
  10099. configurable: true
  10100. });
  10101. /** @hidden */
  10102. SelectorGroup.prototype._addGroupHeader = function (text) {
  10103. var groupHeading = new _textBlock__WEBPACK_IMPORTED_MODULE_4__["TextBlock"]("groupHead", text);
  10104. groupHeading.width = 0.9;
  10105. groupHeading.height = "30px";
  10106. groupHeading.textWrapping = true;
  10107. groupHeading.color = "black";
  10108. groupHeading.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  10109. groupHeading.textHorizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  10110. groupHeading.left = "2px";
  10111. this._groupPanel.addControl(groupHeading);
  10112. return groupHeading;
  10113. };
  10114. /** @hidden*/
  10115. SelectorGroup.prototype._getSelector = function (selectorNb) {
  10116. if (selectorNb < 0 || selectorNb >= this._selectors.length) {
  10117. return;
  10118. }
  10119. return this._selectors[selectorNb];
  10120. };
  10121. /** Removes the selector at the given position
  10122. * @param selectorNb the position of the selector within the group
  10123. */
  10124. SelectorGroup.prototype.removeSelector = function (selectorNb) {
  10125. if (selectorNb < 0 || selectorNb >= this._selectors.length) {
  10126. return;
  10127. }
  10128. this._groupPanel.removeControl(this._selectors[selectorNb]);
  10129. this._selectors.splice(selectorNb, 1);
  10130. };
  10131. return SelectorGroup;
  10132. }());
  10133. /** Class used to create a CheckboxGroup
  10134. * which contains groups of checkbox buttons
  10135. */
  10136. var CheckboxGroup = /** @class */ (function (_super) {
  10137. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(CheckboxGroup, _super);
  10138. function CheckboxGroup() {
  10139. return _super !== null && _super.apply(this, arguments) || this;
  10140. }
  10141. /** Adds a checkbox as a control
  10142. * @param text is the label for the selector
  10143. * @param func is the function called when the Selector is checked
  10144. * @param checked is true when Selector is checked
  10145. */
  10146. CheckboxGroup.prototype.addCheckbox = function (text, func, checked) {
  10147. if (func === void 0) { func = function (s) { }; }
  10148. if (checked === void 0) { checked = false; }
  10149. var checked = checked || false;
  10150. var button = new _checkbox__WEBPACK_IMPORTED_MODULE_5__["Checkbox"]();
  10151. button.width = "20px";
  10152. button.height = "20px";
  10153. button.color = "#364249";
  10154. button.background = "#CCCCCC";
  10155. button.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  10156. button.onIsCheckedChangedObservable.add(function (state) {
  10157. func(state);
  10158. });
  10159. var _selector = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].AddHeader(button, text, "200px", { isHorizontal: true, controlFirst: true });
  10160. _selector.height = "30px";
  10161. _selector.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  10162. _selector.left = "4px";
  10163. this.groupPanel.addControl(_selector);
  10164. this.selectors.push(_selector);
  10165. button.isChecked = checked;
  10166. if (this.groupPanel.parent && this.groupPanel.parent.parent) {
  10167. button.color = this.groupPanel.parent.parent.buttonColor;
  10168. button.background = this.groupPanel.parent.parent.buttonBackground;
  10169. }
  10170. };
  10171. /** @hidden */
  10172. CheckboxGroup.prototype._setSelectorLabel = function (selectorNb, label) {
  10173. this.selectors[selectorNb].children[1].text = label;
  10174. };
  10175. /** @hidden */
  10176. CheckboxGroup.prototype._setSelectorLabelColor = function (selectorNb, color) {
  10177. this.selectors[selectorNb].children[1].color = color;
  10178. };
  10179. /** @hidden */
  10180. CheckboxGroup.prototype._setSelectorButtonColor = function (selectorNb, color) {
  10181. this.selectors[selectorNb].children[0].color = color;
  10182. };
  10183. /** @hidden */
  10184. CheckboxGroup.prototype._setSelectorButtonBackground = function (selectorNb, color) {
  10185. this.selectors[selectorNb].children[0].background = color;
  10186. };
  10187. return CheckboxGroup;
  10188. }(SelectorGroup));
  10189. /** Class used to create a RadioGroup
  10190. * which contains groups of radio buttons
  10191. */
  10192. var RadioGroup = /** @class */ (function (_super) {
  10193. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(RadioGroup, _super);
  10194. function RadioGroup() {
  10195. var _this = _super !== null && _super.apply(this, arguments) || this;
  10196. _this._selectNb = 0;
  10197. return _this;
  10198. }
  10199. /** Adds a radio button as a control
  10200. * @param label is the label for the selector
  10201. * @param func is the function called when the Selector is checked
  10202. * @param checked is true when Selector is checked
  10203. */
  10204. RadioGroup.prototype.addRadio = function (label, func, checked) {
  10205. if (func === void 0) { func = function (n) { }; }
  10206. if (checked === void 0) { checked = false; }
  10207. var nb = this._selectNb++;
  10208. var button = new _radioButton__WEBPACK_IMPORTED_MODULE_6__["RadioButton"]();
  10209. button.name = label;
  10210. button.width = "20px";
  10211. button.height = "20px";
  10212. button.color = "#364249";
  10213. button.background = "#CCCCCC";
  10214. button.group = this.name;
  10215. button.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  10216. button.onIsCheckedChangedObservable.add(function (state) {
  10217. if (state) {
  10218. func(nb);
  10219. }
  10220. });
  10221. var _selector = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].AddHeader(button, label, "200px", { isHorizontal: true, controlFirst: true });
  10222. _selector.height = "30px";
  10223. _selector.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  10224. _selector.left = "4px";
  10225. this.groupPanel.addControl(_selector);
  10226. this.selectors.push(_selector);
  10227. button.isChecked = checked;
  10228. if (this.groupPanel.parent && this.groupPanel.parent.parent) {
  10229. button.color = this.groupPanel.parent.parent.buttonColor;
  10230. button.background = this.groupPanel.parent.parent.buttonBackground;
  10231. }
  10232. };
  10233. /** @hidden */
  10234. RadioGroup.prototype._setSelectorLabel = function (selectorNb, label) {
  10235. this.selectors[selectorNb].children[1].text = label;
  10236. };
  10237. /** @hidden */
  10238. RadioGroup.prototype._setSelectorLabelColor = function (selectorNb, color) {
  10239. this.selectors[selectorNb].children[1].color = color;
  10240. };
  10241. /** @hidden */
  10242. RadioGroup.prototype._setSelectorButtonColor = function (selectorNb, color) {
  10243. this.selectors[selectorNb].children[0].color = color;
  10244. };
  10245. /** @hidden */
  10246. RadioGroup.prototype._setSelectorButtonBackground = function (selectorNb, color) {
  10247. this.selectors[selectorNb].children[0].background = color;
  10248. };
  10249. return RadioGroup;
  10250. }(SelectorGroup));
  10251. /** Class used to create a SliderGroup
  10252. * which contains groups of slider buttons
  10253. */
  10254. var SliderGroup = /** @class */ (function (_super) {
  10255. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(SliderGroup, _super);
  10256. function SliderGroup() {
  10257. return _super !== null && _super.apply(this, arguments) || this;
  10258. }
  10259. /**
  10260. * Adds a slider to the SelectorGroup
  10261. * @param label is the label for the SliderBar
  10262. * @param func is the function called when the Slider moves
  10263. * @param unit is a string describing the units used, eg degrees or metres
  10264. * @param min is the minimum value for the Slider
  10265. * @param max is the maximum value for the Slider
  10266. * @param value is the start value for the Slider between min and max
  10267. * @param onValueChange is the function used to format the value displayed, eg radians to degrees
  10268. */
  10269. SliderGroup.prototype.addSlider = function (label, func, unit, min, max, value, onValueChange) {
  10270. if (func === void 0) { func = function (v) { }; }
  10271. if (unit === void 0) { unit = "Units"; }
  10272. if (min === void 0) { min = 0; }
  10273. if (max === void 0) { max = 0; }
  10274. if (value === void 0) { value = 0; }
  10275. if (onValueChange === void 0) { onValueChange = function (v) { return v | 0; }; }
  10276. var button = new _sliders_slider__WEBPACK_IMPORTED_MODULE_7__["Slider"]();
  10277. button.name = unit;
  10278. button.value = value;
  10279. button.minimum = min;
  10280. button.maximum = max;
  10281. button.width = 0.9;
  10282. button.height = "20px";
  10283. button.color = "#364249";
  10284. button.background = "#CCCCCC";
  10285. button.borderColor = "black";
  10286. button.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  10287. button.left = "4px";
  10288. button.paddingBottom = "4px";
  10289. button.onValueChangedObservable.add(function (value) {
  10290. button.parent.children[0].text = button.parent.children[0].name + ": " + onValueChange(value) + " " + button.name;
  10291. func(value);
  10292. });
  10293. var _selector = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].AddHeader(button, label + ": " + onValueChange(value) + " " + unit, "30px", { isHorizontal: false, controlFirst: false });
  10294. _selector.height = "60px";
  10295. _selector.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  10296. _selector.left = "4px";
  10297. _selector.children[0].name = label;
  10298. this.groupPanel.addControl(_selector);
  10299. this.selectors.push(_selector);
  10300. if (this.groupPanel.parent && this.groupPanel.parent.parent) {
  10301. button.color = this.groupPanel.parent.parent.buttonColor;
  10302. button.background = this.groupPanel.parent.parent.buttonBackground;
  10303. }
  10304. };
  10305. /** @hidden */
  10306. SliderGroup.prototype._setSelectorLabel = function (selectorNb, label) {
  10307. this.selectors[selectorNb].children[0].name = label;
  10308. this.selectors[selectorNb].children[0].text = label + ": " + this.selectors[selectorNb].children[1].value + " " + this.selectors[selectorNb].children[1].name;
  10309. };
  10310. /** @hidden */
  10311. SliderGroup.prototype._setSelectorLabelColor = function (selectorNb, color) {
  10312. this.selectors[selectorNb].children[0].color = color;
  10313. };
  10314. /** @hidden */
  10315. SliderGroup.prototype._setSelectorButtonColor = function (selectorNb, color) {
  10316. this.selectors[selectorNb].children[1].color = color;
  10317. };
  10318. /** @hidden */
  10319. SliderGroup.prototype._setSelectorButtonBackground = function (selectorNb, color) {
  10320. this.selectors[selectorNb].children[1].background = color;
  10321. };
  10322. return SliderGroup;
  10323. }(SelectorGroup));
  10324. /** Class used to hold the controls for the checkboxes, radio buttons and sliders
  10325. * @see https://doc.babylonjs.com/how_to/selector
  10326. */
  10327. var SelectionPanel = /** @class */ (function (_super) {
  10328. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(SelectionPanel, _super);
  10329. /**
  10330. * Creates a new SelectionPanel
  10331. * @param name of SelectionPanel
  10332. * @param groups is an array of SelectionGroups
  10333. */
  10334. function SelectionPanel(
  10335. /** name of SelectionPanel */
  10336. name,
  10337. /** an array of SelectionGroups */
  10338. groups) {
  10339. if (groups === void 0) { groups = []; }
  10340. var _this = _super.call(this, name) || this;
  10341. _this.name = name;
  10342. _this.groups = groups;
  10343. _this._buttonColor = "#364249";
  10344. _this._buttonBackground = "#CCCCCC";
  10345. _this._headerColor = "black";
  10346. _this._barColor = "white";
  10347. _this._barHeight = "2px";
  10348. _this._spacerHeight = "20px";
  10349. _this._bars = new Array();
  10350. _this._groups = groups;
  10351. _this.thickness = 2;
  10352. _this._panel = new _stackPanel__WEBPACK_IMPORTED_MODULE_2__["StackPanel"]();
  10353. _this._panel.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].VERTICAL_ALIGNMENT_TOP;
  10354. _this._panel.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  10355. _this._panel.top = 5;
  10356. _this._panel.left = 5;
  10357. _this._panel.width = 0.95;
  10358. if (groups.length > 0) {
  10359. for (var i = 0; i < groups.length - 1; i++) {
  10360. _this._panel.addControl(groups[i].groupPanel);
  10361. _this._addSpacer();
  10362. }
  10363. _this._panel.addControl(groups[groups.length - 1].groupPanel);
  10364. }
  10365. _this.addControl(_this._panel);
  10366. return _this;
  10367. }
  10368. SelectionPanel.prototype._getTypeName = function () {
  10369. return "SelectionPanel";
  10370. };
  10371. Object.defineProperty(SelectionPanel.prototype, "headerColor", {
  10372. /** Gets or sets the headerColor */
  10373. get: function () {
  10374. return this._headerColor;
  10375. },
  10376. set: function (color) {
  10377. if (this._headerColor === color) {
  10378. return;
  10379. }
  10380. this._headerColor = color;
  10381. this._setHeaderColor();
  10382. },
  10383. enumerable: false,
  10384. configurable: true
  10385. });
  10386. SelectionPanel.prototype._setHeaderColor = function () {
  10387. for (var i = 0; i < this._groups.length; i++) {
  10388. this._groups[i].groupPanel.children[0].color = this._headerColor;
  10389. }
  10390. };
  10391. Object.defineProperty(SelectionPanel.prototype, "buttonColor", {
  10392. /** Gets or sets the button color */
  10393. get: function () {
  10394. return this._buttonColor;
  10395. },
  10396. set: function (color) {
  10397. if (this._buttonColor === color) {
  10398. return;
  10399. }
  10400. this._buttonColor = color;
  10401. this._setbuttonColor();
  10402. },
  10403. enumerable: false,
  10404. configurable: true
  10405. });
  10406. SelectionPanel.prototype._setbuttonColor = function () {
  10407. for (var i = 0; i < this._groups.length; i++) {
  10408. for (var j = 0; j < this._groups[i].selectors.length; j++) {
  10409. this._groups[i]._setSelectorButtonColor(j, this._buttonColor);
  10410. }
  10411. }
  10412. };
  10413. Object.defineProperty(SelectionPanel.prototype, "labelColor", {
  10414. /** Gets or sets the label color */
  10415. get: function () {
  10416. return this._labelColor;
  10417. },
  10418. set: function (color) {
  10419. if (this._labelColor === color) {
  10420. return;
  10421. }
  10422. this._labelColor = color;
  10423. this._setLabelColor();
  10424. },
  10425. enumerable: false,
  10426. configurable: true
  10427. });
  10428. SelectionPanel.prototype._setLabelColor = function () {
  10429. for (var i = 0; i < this._groups.length; i++) {
  10430. for (var j = 0; j < this._groups[i].selectors.length; j++) {
  10431. this._groups[i]._setSelectorLabelColor(j, this._labelColor);
  10432. }
  10433. }
  10434. };
  10435. Object.defineProperty(SelectionPanel.prototype, "buttonBackground", {
  10436. /** Gets or sets the button background */
  10437. get: function () {
  10438. return this._buttonBackground;
  10439. },
  10440. set: function (color) {
  10441. if (this._buttonBackground === color) {
  10442. return;
  10443. }
  10444. this._buttonBackground = color;
  10445. this._setButtonBackground();
  10446. },
  10447. enumerable: false,
  10448. configurable: true
  10449. });
  10450. SelectionPanel.prototype._setButtonBackground = function () {
  10451. for (var i = 0; i < this._groups.length; i++) {
  10452. for (var j = 0; j < this._groups[i].selectors.length; j++) {
  10453. this._groups[i]._setSelectorButtonBackground(j, this._buttonBackground);
  10454. }
  10455. }
  10456. };
  10457. Object.defineProperty(SelectionPanel.prototype, "barColor", {
  10458. /** Gets or sets the color of separator bar */
  10459. get: function () {
  10460. return this._barColor;
  10461. },
  10462. set: function (color) {
  10463. if (this._barColor === color) {
  10464. return;
  10465. }
  10466. this._barColor = color;
  10467. this._setBarColor();
  10468. },
  10469. enumerable: false,
  10470. configurable: true
  10471. });
  10472. SelectionPanel.prototype._setBarColor = function () {
  10473. for (var i = 0; i < this._bars.length; i++) {
  10474. this._bars[i].children[0].background = this._barColor;
  10475. }
  10476. };
  10477. Object.defineProperty(SelectionPanel.prototype, "barHeight", {
  10478. /** Gets or sets the height of separator bar */
  10479. get: function () {
  10480. return this._barHeight;
  10481. },
  10482. set: function (value) {
  10483. if (this._barHeight === value) {
  10484. return;
  10485. }
  10486. this._barHeight = value;
  10487. this._setBarHeight();
  10488. },
  10489. enumerable: false,
  10490. configurable: true
  10491. });
  10492. SelectionPanel.prototype._setBarHeight = function () {
  10493. for (var i = 0; i < this._bars.length; i++) {
  10494. this._bars[i].children[0].height = this._barHeight;
  10495. }
  10496. };
  10497. Object.defineProperty(SelectionPanel.prototype, "spacerHeight", {
  10498. /** Gets or sets the height of spacers*/
  10499. get: function () {
  10500. return this._spacerHeight;
  10501. },
  10502. set: function (value) {
  10503. if (this._spacerHeight === value) {
  10504. return;
  10505. }
  10506. this._spacerHeight = value;
  10507. this._setSpacerHeight();
  10508. },
  10509. enumerable: false,
  10510. configurable: true
  10511. });
  10512. SelectionPanel.prototype._setSpacerHeight = function () {
  10513. for (var i = 0; i < this._bars.length; i++) {
  10514. this._bars[i].height = this._spacerHeight;
  10515. }
  10516. };
  10517. /** Adds a bar between groups */
  10518. SelectionPanel.prototype._addSpacer = function () {
  10519. var separator = new _container__WEBPACK_IMPORTED_MODULE_8__["Container"]();
  10520. separator.width = 1;
  10521. separator.height = this._spacerHeight;
  10522. separator.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  10523. var bar = new _rectangle__WEBPACK_IMPORTED_MODULE_1__["Rectangle"]();
  10524. bar.width = 1;
  10525. bar.height = this._barHeight;
  10526. bar.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  10527. bar.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].VERTICAL_ALIGNMENT_CENTER;
  10528. bar.background = this._barColor;
  10529. bar.color = "transparent";
  10530. separator.addControl(bar);
  10531. this._panel.addControl(separator);
  10532. this._bars.push(separator);
  10533. };
  10534. /** Add a group to the selection panel
  10535. * @param group is the selector group to add
  10536. */
  10537. SelectionPanel.prototype.addGroup = function (group) {
  10538. if (this._groups.length > 0) {
  10539. this._addSpacer();
  10540. }
  10541. this._panel.addControl(group.groupPanel);
  10542. this._groups.push(group);
  10543. group.groupPanel.children[0].color = this._headerColor;
  10544. for (var j = 0; j < group.selectors.length; j++) {
  10545. group._setSelectorButtonColor(j, this._buttonColor);
  10546. group._setSelectorButtonBackground(j, this._buttonBackground);
  10547. }
  10548. };
  10549. /** Remove the group from the given position
  10550. * @param groupNb is the position of the group in the list
  10551. */
  10552. SelectionPanel.prototype.removeGroup = function (groupNb) {
  10553. if (groupNb < 0 || groupNb >= this._groups.length) {
  10554. return;
  10555. }
  10556. var group = this._groups[groupNb];
  10557. this._panel.removeControl(group.groupPanel);
  10558. this._groups.splice(groupNb, 1);
  10559. if (groupNb < this._bars.length) {
  10560. this._panel.removeControl(this._bars[groupNb]);
  10561. this._bars.splice(groupNb, 1);
  10562. }
  10563. };
  10564. /** Change a group header label
  10565. * @param label is the new group header label
  10566. * @param groupNb is the number of the group to relabel
  10567. * */
  10568. SelectionPanel.prototype.setHeaderName = function (label, groupNb) {
  10569. if (groupNb < 0 || groupNb >= this._groups.length) {
  10570. return;
  10571. }
  10572. var group = this._groups[groupNb];
  10573. group.groupPanel.children[0].text = label;
  10574. };
  10575. /** Change selector label to the one given
  10576. * @param label is the new selector label
  10577. * @param groupNb is the number of the groupcontaining the selector
  10578. * @param selectorNb is the number of the selector within a group to relabel
  10579. * */
  10580. SelectionPanel.prototype.relabel = function (label, groupNb, selectorNb) {
  10581. if (groupNb < 0 || groupNb >= this._groups.length) {
  10582. return;
  10583. }
  10584. var group = this._groups[groupNb];
  10585. if (selectorNb < 0 || selectorNb >= group.selectors.length) {
  10586. return;
  10587. }
  10588. group._setSelectorLabel(selectorNb, label);
  10589. };
  10590. /** For a given group position remove the selector at the given position
  10591. * @param groupNb is the number of the group to remove the selector from
  10592. * @param selectorNb is the number of the selector within the group
  10593. */
  10594. SelectionPanel.prototype.removeFromGroupSelector = function (groupNb, selectorNb) {
  10595. if (groupNb < 0 || groupNb >= this._groups.length) {
  10596. return;
  10597. }
  10598. var group = this._groups[groupNb];
  10599. if (selectorNb < 0 || selectorNb >= group.selectors.length) {
  10600. return;
  10601. }
  10602. group.removeSelector(selectorNb);
  10603. };
  10604. /** For a given group position of correct type add a checkbox button
  10605. * @param groupNb is the number of the group to remove the selector from
  10606. * @param label is the label for the selector
  10607. * @param func is the function called when the Selector is checked
  10608. * @param checked is true when Selector is checked
  10609. */
  10610. SelectionPanel.prototype.addToGroupCheckbox = function (groupNb, label, func, checked) {
  10611. if (func === void 0) { func = function () { }; }
  10612. if (checked === void 0) { checked = false; }
  10613. if (groupNb < 0 || groupNb >= this._groups.length) {
  10614. return;
  10615. }
  10616. var group = this._groups[groupNb];
  10617. group.addCheckbox(label, func, checked);
  10618. };
  10619. /** For a given group position of correct type add a radio button
  10620. * @param groupNb is the number of the group to remove the selector from
  10621. * @param label is the label for the selector
  10622. * @param func is the function called when the Selector is checked
  10623. * @param checked is true when Selector is checked
  10624. */
  10625. SelectionPanel.prototype.addToGroupRadio = function (groupNb, label, func, checked) {
  10626. if (func === void 0) { func = function () { }; }
  10627. if (checked === void 0) { checked = false; }
  10628. if (groupNb < 0 || groupNb >= this._groups.length) {
  10629. return;
  10630. }
  10631. var group = this._groups[groupNb];
  10632. group.addRadio(label, func, checked);
  10633. };
  10634. /**
  10635. * For a given slider group add a slider
  10636. * @param groupNb is the number of the group to add the slider to
  10637. * @param label is the label for the Slider
  10638. * @param func is the function called when the Slider moves
  10639. * @param unit is a string describing the units used, eg degrees or metres
  10640. * @param min is the minimum value for the Slider
  10641. * @param max is the maximum value for the Slider
  10642. * @param value is the start value for the Slider between min and max
  10643. * @param onVal is the function used to format the value displayed, eg radians to degrees
  10644. */
  10645. SelectionPanel.prototype.addToGroupSlider = function (groupNb, label, func, unit, min, max, value, onVal) {
  10646. if (func === void 0) { func = function () { }; }
  10647. if (unit === void 0) { unit = "Units"; }
  10648. if (min === void 0) { min = 0; }
  10649. if (max === void 0) { max = 0; }
  10650. if (value === void 0) { value = 0; }
  10651. if (onVal === void 0) { onVal = function (v) { return v | 0; }; }
  10652. if (groupNb < 0 || groupNb >= this._groups.length) {
  10653. return;
  10654. }
  10655. var group = this._groups[groupNb];
  10656. group.addSlider(label, func, unit, min, max, value, onVal);
  10657. };
  10658. return SelectionPanel;
  10659. }(_rectangle__WEBPACK_IMPORTED_MODULE_1__["Rectangle"]));
  10660. /***/ }),
  10661. /***/ "./2D/controls/sliders/baseSlider.ts":
  10662. /*!*******************************************!*\
  10663. !*** ./2D/controls/sliders/baseSlider.ts ***!
  10664. \*******************************************/
  10665. /*! exports provided: BaseSlider */
  10666. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  10667. "use strict";
  10668. __webpack_require__.r(__webpack_exports__);
  10669. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "BaseSlider", function() { return BaseSlider; });
  10670. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  10671. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math.vector");
  10672. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
  10673. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../control */ "./2D/controls/control.ts");
  10674. /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../valueAndUnit */ "./2D/valueAndUnit.ts");
  10675. /**
  10676. * Class used to create slider controls
  10677. */
  10678. var BaseSlider = /** @class */ (function (_super) {
  10679. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(BaseSlider, _super);
  10680. /**
  10681. * Creates a new BaseSlider
  10682. * @param name defines the control name
  10683. */
  10684. function BaseSlider(name) {
  10685. var _this = _super.call(this, name) || this;
  10686. _this.name = name;
  10687. _this._thumbWidth = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__["ValueAndUnit"](20, _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__["ValueAndUnit"].UNITMODE_PIXEL, false);
  10688. _this._minimum = 0;
  10689. _this._maximum = 100;
  10690. _this._value = 50;
  10691. _this._isVertical = false;
  10692. _this._barOffset = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__["ValueAndUnit"](5, _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__["ValueAndUnit"].UNITMODE_PIXEL, false);
  10693. _this._isThumbClamped = false;
  10694. _this._displayThumb = true;
  10695. _this._step = 0;
  10696. _this._lastPointerDownID = -1;
  10697. // Shared rendering info
  10698. _this._effectiveBarOffset = 0;
  10699. /** Observable raised when the sldier value changes */
  10700. _this.onValueChangedObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  10701. // Events
  10702. _this._pointerIsDown = false;
  10703. _this.isPointerBlocker = true;
  10704. return _this;
  10705. }
  10706. Object.defineProperty(BaseSlider.prototype, "displayThumb", {
  10707. /** Gets or sets a boolean indicating if the thumb must be rendered */
  10708. get: function () {
  10709. return this._displayThumb;
  10710. },
  10711. set: function (value) {
  10712. if (this._displayThumb === value) {
  10713. return;
  10714. }
  10715. this._displayThumb = value;
  10716. this._markAsDirty();
  10717. },
  10718. enumerable: false,
  10719. configurable: true
  10720. });
  10721. Object.defineProperty(BaseSlider.prototype, "step", {
  10722. /** Gets or sets a step to apply to values (0 by default) */
  10723. get: function () {
  10724. return this._step;
  10725. },
  10726. set: function (value) {
  10727. if (this._step === value) {
  10728. return;
  10729. }
  10730. this._step = value;
  10731. this._markAsDirty();
  10732. },
  10733. enumerable: false,
  10734. configurable: true
  10735. });
  10736. Object.defineProperty(BaseSlider.prototype, "barOffset", {
  10737. /** Gets or sets main bar offset (ie. the margin applied to the value bar) */
  10738. get: function () {
  10739. return this._barOffset.toString(this._host);
  10740. },
  10741. set: function (value) {
  10742. if (this._barOffset.toString(this._host) === value) {
  10743. return;
  10744. }
  10745. if (this._barOffset.fromString(value)) {
  10746. this._markAsDirty();
  10747. }
  10748. },
  10749. enumerable: false,
  10750. configurable: true
  10751. });
  10752. Object.defineProperty(BaseSlider.prototype, "barOffsetInPixels", {
  10753. /** Gets main bar offset in pixels*/
  10754. get: function () {
  10755. return this._barOffset.getValueInPixel(this._host, this._cachedParentMeasure.width);
  10756. },
  10757. enumerable: false,
  10758. configurable: true
  10759. });
  10760. Object.defineProperty(BaseSlider.prototype, "thumbWidth", {
  10761. /** Gets or sets thumb width */
  10762. get: function () {
  10763. return this._thumbWidth.toString(this._host);
  10764. },
  10765. set: function (value) {
  10766. if (this._thumbWidth.toString(this._host) === value) {
  10767. return;
  10768. }
  10769. if (this._thumbWidth.fromString(value)) {
  10770. this._markAsDirty();
  10771. }
  10772. },
  10773. enumerable: false,
  10774. configurable: true
  10775. });
  10776. Object.defineProperty(BaseSlider.prototype, "thumbWidthInPixels", {
  10777. /** Gets thumb width in pixels */
  10778. get: function () {
  10779. return this._thumbWidth.getValueInPixel(this._host, this._cachedParentMeasure.width);
  10780. },
  10781. enumerable: false,
  10782. configurable: true
  10783. });
  10784. Object.defineProperty(BaseSlider.prototype, "minimum", {
  10785. /** Gets or sets minimum value */
  10786. get: function () {
  10787. return this._minimum;
  10788. },
  10789. set: function (value) {
  10790. if (this._minimum === value) {
  10791. return;
  10792. }
  10793. this._minimum = value;
  10794. this._markAsDirty();
  10795. this.value = Math.max(Math.min(this.value, this._maximum), this._minimum);
  10796. },
  10797. enumerable: false,
  10798. configurable: true
  10799. });
  10800. Object.defineProperty(BaseSlider.prototype, "maximum", {
  10801. /** Gets or sets maximum value */
  10802. get: function () {
  10803. return this._maximum;
  10804. },
  10805. set: function (value) {
  10806. if (this._maximum === value) {
  10807. return;
  10808. }
  10809. this._maximum = value;
  10810. this._markAsDirty();
  10811. this.value = Math.max(Math.min(this.value, this._maximum), this._minimum);
  10812. },
  10813. enumerable: false,
  10814. configurable: true
  10815. });
  10816. Object.defineProperty(BaseSlider.prototype, "value", {
  10817. /** Gets or sets current value */
  10818. get: function () {
  10819. return this._value;
  10820. },
  10821. set: function (value) {
  10822. value = Math.max(Math.min(value, this._maximum), this._minimum);
  10823. if (this._value === value) {
  10824. return;
  10825. }
  10826. this._value = value;
  10827. this._markAsDirty();
  10828. this.onValueChangedObservable.notifyObservers(this._value);
  10829. },
  10830. enumerable: false,
  10831. configurable: true
  10832. });
  10833. Object.defineProperty(BaseSlider.prototype, "isVertical", {
  10834. /**Gets or sets a boolean indicating if the slider should be vertical or horizontal */
  10835. get: function () {
  10836. return this._isVertical;
  10837. },
  10838. set: function (value) {
  10839. if (this._isVertical === value) {
  10840. return;
  10841. }
  10842. this._isVertical = value;
  10843. this._markAsDirty();
  10844. },
  10845. enumerable: false,
  10846. configurable: true
  10847. });
  10848. Object.defineProperty(BaseSlider.prototype, "isThumbClamped", {
  10849. /** Gets or sets a value indicating if the thumb can go over main bar extends */
  10850. get: function () {
  10851. return this._isThumbClamped;
  10852. },
  10853. set: function (value) {
  10854. if (this._isThumbClamped === value) {
  10855. return;
  10856. }
  10857. this._isThumbClamped = value;
  10858. this._markAsDirty();
  10859. },
  10860. enumerable: false,
  10861. configurable: true
  10862. });
  10863. BaseSlider.prototype._getTypeName = function () {
  10864. return "BaseSlider";
  10865. };
  10866. BaseSlider.prototype._getThumbPosition = function () {
  10867. if (this.isVertical) {
  10868. return ((this.maximum - this.value) / (this.maximum - this.minimum)) * this._backgroundBoxLength;
  10869. }
  10870. return ((this.value - this.minimum) / (this.maximum - this.minimum)) * this._backgroundBoxLength;
  10871. };
  10872. BaseSlider.prototype._getThumbThickness = function (type) {
  10873. var thumbThickness = 0;
  10874. switch (type) {
  10875. case "circle":
  10876. if (this._thumbWidth.isPixel) {
  10877. thumbThickness = Math.max(this._thumbWidth.getValue(this._host), this._backgroundBoxThickness);
  10878. }
  10879. else {
  10880. thumbThickness = this._backgroundBoxThickness * this._thumbWidth.getValue(this._host);
  10881. }
  10882. break;
  10883. case "rectangle":
  10884. if (this._thumbWidth.isPixel) {
  10885. thumbThickness = Math.min(this._thumbWidth.getValue(this._host), this._backgroundBoxThickness);
  10886. }
  10887. else {
  10888. thumbThickness = this._backgroundBoxThickness * this._thumbWidth.getValue(this._host);
  10889. }
  10890. }
  10891. return thumbThickness;
  10892. };
  10893. BaseSlider.prototype._prepareRenderingData = function (type) {
  10894. // Main bar
  10895. this._effectiveBarOffset = 0;
  10896. this._renderLeft = this._currentMeasure.left;
  10897. this._renderTop = this._currentMeasure.top;
  10898. this._renderWidth = this._currentMeasure.width;
  10899. this._renderHeight = this._currentMeasure.height;
  10900. this._backgroundBoxLength = Math.max(this._currentMeasure.width, this._currentMeasure.height);
  10901. this._backgroundBoxThickness = Math.min(this._currentMeasure.width, this._currentMeasure.height);
  10902. this._effectiveThumbThickness = this._getThumbThickness(type);
  10903. if (this.displayThumb) {
  10904. this._backgroundBoxLength -= this._effectiveThumbThickness;
  10905. }
  10906. //throw error when height is less than width for vertical slider
  10907. if ((this.isVertical && this._currentMeasure.height < this._currentMeasure.width)) {
  10908. console.error("Height should be greater than width");
  10909. return;
  10910. }
  10911. if (this._barOffset.isPixel) {
  10912. this._effectiveBarOffset = Math.min(this._barOffset.getValue(this._host), this._backgroundBoxThickness);
  10913. }
  10914. else {
  10915. this._effectiveBarOffset = this._backgroundBoxThickness * this._barOffset.getValue(this._host);
  10916. }
  10917. this._backgroundBoxThickness -= (this._effectiveBarOffset * 2);
  10918. if (this.isVertical) {
  10919. this._renderLeft += this._effectiveBarOffset;
  10920. if (!this.isThumbClamped && this.displayThumb) {
  10921. this._renderTop += (this._effectiveThumbThickness / 2);
  10922. }
  10923. this._renderHeight = this._backgroundBoxLength;
  10924. this._renderWidth = this._backgroundBoxThickness;
  10925. }
  10926. else {
  10927. this._renderTop += this._effectiveBarOffset;
  10928. if (!this.isThumbClamped && this.displayThumb) {
  10929. this._renderLeft += (this._effectiveThumbThickness / 2);
  10930. }
  10931. this._renderHeight = this._backgroundBoxThickness;
  10932. this._renderWidth = this._backgroundBoxLength;
  10933. }
  10934. };
  10935. /** @hidden */
  10936. BaseSlider.prototype._updateValueFromPointer = function (x, y) {
  10937. if (this.rotation != 0) {
  10938. this._invertTransformMatrix.transformCoordinates(x, y, this._transformedPosition);
  10939. x = this._transformedPosition.x;
  10940. y = this._transformedPosition.y;
  10941. }
  10942. var value;
  10943. if (this._isVertical) {
  10944. value = this._minimum + (1 - ((y - this._currentMeasure.top) / this._currentMeasure.height)) * (this._maximum - this._minimum);
  10945. }
  10946. else {
  10947. value = this._minimum + ((x - this._currentMeasure.left) / this._currentMeasure.width) * (this._maximum - this._minimum);
  10948. }
  10949. var mult = (1 / this._step) | 0;
  10950. this.value = this._step ? ((value * mult) | 0) / mult : value;
  10951. };
  10952. BaseSlider.prototype._onPointerDown = function (target, coordinates, pointerId, buttonIndex) {
  10953. if (!_super.prototype._onPointerDown.call(this, target, coordinates, pointerId, buttonIndex)) {
  10954. return false;
  10955. }
  10956. this._pointerIsDown = true;
  10957. this._updateValueFromPointer(coordinates.x, coordinates.y);
  10958. this._host._capturingControl[pointerId] = this;
  10959. this._lastPointerDownID = pointerId;
  10960. return true;
  10961. };
  10962. BaseSlider.prototype._onPointerMove = function (target, coordinates, pointerId) {
  10963. // Only listen to pointer move events coming from the last pointer to click on the element (To support dual vr controller interaction)
  10964. if (pointerId != this._lastPointerDownID) {
  10965. return;
  10966. }
  10967. if (this._pointerIsDown) {
  10968. this._updateValueFromPointer(coordinates.x, coordinates.y);
  10969. }
  10970. _super.prototype._onPointerMove.call(this, target, coordinates, pointerId);
  10971. };
  10972. BaseSlider.prototype._onPointerUp = function (target, coordinates, pointerId, buttonIndex, notifyClick) {
  10973. this._pointerIsDown = false;
  10974. delete this._host._capturingControl[pointerId];
  10975. _super.prototype._onPointerUp.call(this, target, coordinates, pointerId, buttonIndex, notifyClick);
  10976. };
  10977. BaseSlider.prototype._onCanvasBlur = function () {
  10978. this._forcePointerUp();
  10979. _super.prototype._onCanvasBlur.call(this);
  10980. };
  10981. return BaseSlider;
  10982. }(_control__WEBPACK_IMPORTED_MODULE_2__["Control"]));
  10983. /***/ }),
  10984. /***/ "./2D/controls/sliders/imageBasedSlider.ts":
  10985. /*!*************************************************!*\
  10986. !*** ./2D/controls/sliders/imageBasedSlider.ts ***!
  10987. \*************************************************/
  10988. /*! exports provided: ImageBasedSlider */
  10989. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  10990. "use strict";
  10991. __webpack_require__.r(__webpack_exports__);
  10992. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ImageBasedSlider", function() { return ImageBasedSlider; });
  10993. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  10994. /* harmony import */ var _baseSlider__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./baseSlider */ "./2D/controls/sliders/baseSlider.ts");
  10995. /* harmony import */ var _measure__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../measure */ "./2D/measure.ts");
  10996. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math.vector");
  10997. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3__);
  10998. /**
  10999. * Class used to create slider controls based on images
  11000. */
  11001. var ImageBasedSlider = /** @class */ (function (_super) {
  11002. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(ImageBasedSlider, _super);
  11003. /**
  11004. * Creates a new ImageBasedSlider
  11005. * @param name defines the control name
  11006. */
  11007. function ImageBasedSlider(name) {
  11008. var _this = _super.call(this, name) || this;
  11009. _this.name = name;
  11010. _this._tempMeasure = new _measure__WEBPACK_IMPORTED_MODULE_2__["Measure"](0, 0, 0, 0);
  11011. return _this;
  11012. }
  11013. Object.defineProperty(ImageBasedSlider.prototype, "displayThumb", {
  11014. get: function () {
  11015. return this._displayThumb && this.thumbImage != null;
  11016. },
  11017. set: function (value) {
  11018. if (this._displayThumb === value) {
  11019. return;
  11020. }
  11021. this._displayThumb = value;
  11022. this._markAsDirty();
  11023. },
  11024. enumerable: false,
  11025. configurable: true
  11026. });
  11027. Object.defineProperty(ImageBasedSlider.prototype, "backgroundImage", {
  11028. /**
  11029. * Gets or sets the image used to render the background
  11030. */
  11031. get: function () {
  11032. return this._backgroundImage;
  11033. },
  11034. set: function (value) {
  11035. var _this = this;
  11036. if (this._backgroundImage === value) {
  11037. return;
  11038. }
  11039. this._backgroundImage = value;
  11040. if (value && !value.isLoaded) {
  11041. value.onImageLoadedObservable.addOnce(function () { return _this._markAsDirty(); });
  11042. }
  11043. this._markAsDirty();
  11044. },
  11045. enumerable: false,
  11046. configurable: true
  11047. });
  11048. Object.defineProperty(ImageBasedSlider.prototype, "valueBarImage", {
  11049. /**
  11050. * Gets or sets the image used to render the value bar
  11051. */
  11052. get: function () {
  11053. return this._valueBarImage;
  11054. },
  11055. set: function (value) {
  11056. var _this = this;
  11057. if (this._valueBarImage === value) {
  11058. return;
  11059. }
  11060. this._valueBarImage = value;
  11061. if (value && !value.isLoaded) {
  11062. value.onImageLoadedObservable.addOnce(function () { return _this._markAsDirty(); });
  11063. }
  11064. this._markAsDirty();
  11065. },
  11066. enumerable: false,
  11067. configurable: true
  11068. });
  11069. Object.defineProperty(ImageBasedSlider.prototype, "thumbImage", {
  11070. /**
  11071. * Gets or sets the image used to render the thumb
  11072. */
  11073. get: function () {
  11074. return this._thumbImage;
  11075. },
  11076. set: function (value) {
  11077. var _this = this;
  11078. if (this._thumbImage === value) {
  11079. return;
  11080. }
  11081. this._thumbImage = value;
  11082. if (value && !value.isLoaded) {
  11083. value.onImageLoadedObservable.addOnce(function () { return _this._markAsDirty(); });
  11084. }
  11085. this._markAsDirty();
  11086. },
  11087. enumerable: false,
  11088. configurable: true
  11089. });
  11090. ImageBasedSlider.prototype._getTypeName = function () {
  11091. return "ImageBasedSlider";
  11092. };
  11093. ImageBasedSlider.prototype._draw = function (context, invalidatedRectangle) {
  11094. context.save();
  11095. this._applyStates(context);
  11096. this._prepareRenderingData("rectangle");
  11097. var thumbPosition = this._getThumbPosition();
  11098. var left = this._renderLeft;
  11099. var top = this._renderTop;
  11100. var width = this._renderWidth;
  11101. var height = this._renderHeight;
  11102. // Background
  11103. if (this._backgroundImage) {
  11104. this._tempMeasure.copyFromFloats(left, top, width, height);
  11105. if (this.isThumbClamped && this.displayThumb) {
  11106. if (this.isVertical) {
  11107. this._tempMeasure.height += this._effectiveThumbThickness;
  11108. }
  11109. else {
  11110. this._tempMeasure.width += this._effectiveThumbThickness;
  11111. }
  11112. }
  11113. this._backgroundImage._currentMeasure.copyFrom(this._tempMeasure);
  11114. this._backgroundImage._draw(context);
  11115. }
  11116. // Bar
  11117. if (this._valueBarImage) {
  11118. if (this.isVertical) {
  11119. if (this.isThumbClamped && this.displayThumb) {
  11120. this._tempMeasure.copyFromFloats(left, top + thumbPosition, width, height - thumbPosition + this._effectiveThumbThickness);
  11121. }
  11122. else {
  11123. this._tempMeasure.copyFromFloats(left, top + thumbPosition, width, height - thumbPosition);
  11124. }
  11125. }
  11126. else {
  11127. if (this.isThumbClamped && this.displayThumb) {
  11128. this._tempMeasure.copyFromFloats(left, top, thumbPosition + this._effectiveThumbThickness / 2, height);
  11129. }
  11130. else {
  11131. this._tempMeasure.copyFromFloats(left, top, thumbPosition, height);
  11132. }
  11133. }
  11134. this._valueBarImage._currentMeasure.copyFrom(this._tempMeasure);
  11135. this._valueBarImage._draw(context);
  11136. }
  11137. // Thumb
  11138. if (this.displayThumb) {
  11139. if (this.isVertical) {
  11140. this._tempMeasure.copyFromFloats(left - this._effectiveBarOffset, this._currentMeasure.top + thumbPosition, this._currentMeasure.width, this._effectiveThumbThickness);
  11141. }
  11142. else {
  11143. this._tempMeasure.copyFromFloats(this._currentMeasure.left + thumbPosition, this._currentMeasure.top, this._effectiveThumbThickness, this._currentMeasure.height);
  11144. }
  11145. this._thumbImage._currentMeasure.copyFrom(this._tempMeasure);
  11146. this._thumbImage._draw(context);
  11147. }
  11148. context.restore();
  11149. };
  11150. return ImageBasedSlider;
  11151. }(_baseSlider__WEBPACK_IMPORTED_MODULE_1__["BaseSlider"]));
  11152. babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3__["_TypeStore"].RegisteredTypes["BABYLON.GUI.ImageBasedSlider"] = ImageBasedSlider;
  11153. /***/ }),
  11154. /***/ "./2D/controls/sliders/imageScrollBar.ts":
  11155. /*!***********************************************!*\
  11156. !*** ./2D/controls/sliders/imageScrollBar.ts ***!
  11157. \***********************************************/
  11158. /*! exports provided: ImageScrollBar */
  11159. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  11160. "use strict";
  11161. __webpack_require__.r(__webpack_exports__);
  11162. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ImageScrollBar", function() { return ImageScrollBar; });
  11163. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  11164. /* harmony import */ var _baseSlider__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./baseSlider */ "./2D/controls/sliders/baseSlider.ts");
  11165. /* harmony import */ var _measure__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../measure */ "./2D/measure.ts");
  11166. /**
  11167. * Class used to create slider controls
  11168. */
  11169. var ImageScrollBar = /** @class */ (function (_super) {
  11170. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(ImageScrollBar, _super);
  11171. /**
  11172. * Creates a new ImageScrollBar
  11173. * @param name defines the control name
  11174. */
  11175. function ImageScrollBar(name) {
  11176. var _this = _super.call(this, name) || this;
  11177. _this.name = name;
  11178. _this._thumbLength = 0.5;
  11179. _this._thumbHeight = 1;
  11180. _this._barImageHeight = 1;
  11181. _this._tempMeasure = new _measure__WEBPACK_IMPORTED_MODULE_2__["Measure"](0, 0, 0, 0);
  11182. /** Number of 90° rotation to apply on the images when in vertical mode */
  11183. _this.num90RotationInVerticalMode = 1;
  11184. return _this;
  11185. }
  11186. Object.defineProperty(ImageScrollBar.prototype, "backgroundImage", {
  11187. /**
  11188. * Gets or sets the image used to render the background for horizontal bar
  11189. */
  11190. get: function () {
  11191. return this._backgroundBaseImage;
  11192. },
  11193. set: function (value) {
  11194. var _this = this;
  11195. if (this._backgroundBaseImage === value) {
  11196. return;
  11197. }
  11198. this._backgroundBaseImage = value;
  11199. if (this.isVertical && this.num90RotationInVerticalMode !== 0) {
  11200. if (!value.isLoaded) {
  11201. value.onImageLoadedObservable.addOnce(function () {
  11202. var rotatedValue = value._rotate90(_this.num90RotationInVerticalMode, true);
  11203. _this._backgroundImage = rotatedValue;
  11204. if (!rotatedValue.isLoaded) {
  11205. rotatedValue.onImageLoadedObservable.addOnce(function () {
  11206. _this._markAsDirty();
  11207. });
  11208. }
  11209. _this._markAsDirty();
  11210. });
  11211. }
  11212. else {
  11213. this._backgroundImage = value._rotate90(this.num90RotationInVerticalMode, true);
  11214. this._markAsDirty();
  11215. }
  11216. }
  11217. else {
  11218. this._backgroundImage = value;
  11219. if (value && !value.isLoaded) {
  11220. value.onImageLoadedObservable.addOnce(function () {
  11221. _this._markAsDirty();
  11222. });
  11223. }
  11224. this._markAsDirty();
  11225. }
  11226. },
  11227. enumerable: false,
  11228. configurable: true
  11229. });
  11230. Object.defineProperty(ImageScrollBar.prototype, "thumbImage", {
  11231. /**
  11232. * Gets or sets the image used to render the thumb
  11233. */
  11234. get: function () {
  11235. return this._thumbBaseImage;
  11236. },
  11237. set: function (value) {
  11238. var _this = this;
  11239. if (this._thumbBaseImage === value) {
  11240. return;
  11241. }
  11242. this._thumbBaseImage = value;
  11243. if (this.isVertical && this.num90RotationInVerticalMode !== 0) {
  11244. if (!value.isLoaded) {
  11245. value.onImageLoadedObservable.addOnce(function () {
  11246. var rotatedValue = value._rotate90(-_this.num90RotationInVerticalMode, true);
  11247. _this._thumbImage = rotatedValue;
  11248. if (!rotatedValue.isLoaded) {
  11249. rotatedValue.onImageLoadedObservable.addOnce(function () {
  11250. _this._markAsDirty();
  11251. });
  11252. }
  11253. _this._markAsDirty();
  11254. });
  11255. }
  11256. else {
  11257. this._thumbImage = value._rotate90(-this.num90RotationInVerticalMode, true);
  11258. this._markAsDirty();
  11259. }
  11260. }
  11261. else {
  11262. this._thumbImage = value;
  11263. if (value && !value.isLoaded) {
  11264. value.onImageLoadedObservable.addOnce(function () {
  11265. _this._markAsDirty();
  11266. });
  11267. }
  11268. this._markAsDirty();
  11269. }
  11270. },
  11271. enumerable: false,
  11272. configurable: true
  11273. });
  11274. Object.defineProperty(ImageScrollBar.prototype, "thumbLength", {
  11275. /**
  11276. * Gets or sets the length of the thumb
  11277. */
  11278. get: function () {
  11279. return this._thumbLength;
  11280. },
  11281. set: function (value) {
  11282. if (this._thumbLength === value) {
  11283. return;
  11284. }
  11285. this._thumbLength = value;
  11286. this._markAsDirty();
  11287. },
  11288. enumerable: false,
  11289. configurable: true
  11290. });
  11291. Object.defineProperty(ImageScrollBar.prototype, "thumbHeight", {
  11292. /**
  11293. * Gets or sets the height of the thumb
  11294. */
  11295. get: function () {
  11296. return this._thumbHeight;
  11297. },
  11298. set: function (value) {
  11299. if (this._thumbLength === value) {
  11300. return;
  11301. }
  11302. this._thumbHeight = value;
  11303. this._markAsDirty();
  11304. },
  11305. enumerable: false,
  11306. configurable: true
  11307. });
  11308. Object.defineProperty(ImageScrollBar.prototype, "barImageHeight", {
  11309. /**
  11310. * Gets or sets the height of the bar image
  11311. */
  11312. get: function () {
  11313. return this._barImageHeight;
  11314. },
  11315. set: function (value) {
  11316. if (this._barImageHeight === value) {
  11317. return;
  11318. }
  11319. this._barImageHeight = value;
  11320. this._markAsDirty();
  11321. },
  11322. enumerable: false,
  11323. configurable: true
  11324. });
  11325. ImageScrollBar.prototype._getTypeName = function () {
  11326. return "ImageScrollBar";
  11327. };
  11328. ImageScrollBar.prototype._getThumbThickness = function () {
  11329. var thumbThickness = 0;
  11330. if (this._thumbWidth.isPixel) {
  11331. thumbThickness = this._thumbWidth.getValue(this._host);
  11332. }
  11333. else {
  11334. thumbThickness = this._backgroundBoxThickness * this._thumbWidth.getValue(this._host);
  11335. }
  11336. return thumbThickness;
  11337. };
  11338. ImageScrollBar.prototype._draw = function (context) {
  11339. context.save();
  11340. this._applyStates(context);
  11341. this._prepareRenderingData("rectangle");
  11342. var thumbPosition = this._getThumbPosition();
  11343. var left = this._renderLeft;
  11344. var top = this._renderTop;
  11345. var width = this._renderWidth;
  11346. var height = this._renderHeight;
  11347. // Background
  11348. if (this._backgroundImage) {
  11349. this._tempMeasure.copyFromFloats(left, top, width, height);
  11350. if (this.isVertical) {
  11351. this._tempMeasure.copyFromFloats(left + width * (1 - this._barImageHeight) * 0.5, this._currentMeasure.top, width * this._barImageHeight, height);
  11352. this._tempMeasure.height += this._effectiveThumbThickness;
  11353. this._backgroundImage._currentMeasure.copyFrom(this._tempMeasure);
  11354. }
  11355. else {
  11356. this._tempMeasure.copyFromFloats(this._currentMeasure.left, top + height * (1 - this._barImageHeight) * 0.5, width, height * this._barImageHeight);
  11357. this._tempMeasure.width += this._effectiveThumbThickness;
  11358. this._backgroundImage._currentMeasure.copyFrom(this._tempMeasure);
  11359. }
  11360. this._backgroundImage._draw(context);
  11361. }
  11362. // Thumb
  11363. if (this.isVertical) {
  11364. this._tempMeasure.copyFromFloats(left - this._effectiveBarOffset + this._currentMeasure.width * (1 - this._thumbHeight) * 0.5, this._currentMeasure.top + thumbPosition, this._currentMeasure.width * this._thumbHeight, this._effectiveThumbThickness);
  11365. }
  11366. else {
  11367. this._tempMeasure.copyFromFloats(this._currentMeasure.left + thumbPosition, this._currentMeasure.top + this._currentMeasure.height * (1 - this._thumbHeight) * 0.5, this._effectiveThumbThickness, this._currentMeasure.height * this._thumbHeight);
  11368. }
  11369. if (this._thumbImage) {
  11370. this._thumbImage._currentMeasure.copyFrom(this._tempMeasure);
  11371. this._thumbImage._draw(context);
  11372. }
  11373. context.restore();
  11374. };
  11375. /** @hidden */
  11376. ImageScrollBar.prototype._updateValueFromPointer = function (x, y) {
  11377. if (this.rotation != 0) {
  11378. this._invertTransformMatrix.transformCoordinates(x, y, this._transformedPosition);
  11379. x = this._transformedPosition.x;
  11380. y = this._transformedPosition.y;
  11381. }
  11382. if (this._first) {
  11383. this._first = false;
  11384. this._originX = x;
  11385. this._originY = y;
  11386. // Check if move is required
  11387. if (x < this._tempMeasure.left || x > this._tempMeasure.left + this._tempMeasure.width || y < this._tempMeasure.top || y > this._tempMeasure.top + this._tempMeasure.height) {
  11388. if (this.isVertical) {
  11389. this.value = this.minimum + (1 - ((y - this._currentMeasure.top) / this._currentMeasure.height)) * (this.maximum - this.minimum);
  11390. }
  11391. else {
  11392. this.value = this.minimum + ((x - this._currentMeasure.left) / this._currentMeasure.width) * (this.maximum - this.minimum);
  11393. }
  11394. }
  11395. }
  11396. // Delta mode
  11397. var delta = 0;
  11398. if (this.isVertical) {
  11399. delta = -((y - this._originY) / (this._currentMeasure.height - this._effectiveThumbThickness));
  11400. }
  11401. else {
  11402. delta = (x - this._originX) / (this._currentMeasure.width - this._effectiveThumbThickness);
  11403. }
  11404. this.value += delta * (this.maximum - this.minimum);
  11405. this._originX = x;
  11406. this._originY = y;
  11407. };
  11408. ImageScrollBar.prototype._onPointerDown = function (target, coordinates, pointerId, buttonIndex) {
  11409. this._first = true;
  11410. return _super.prototype._onPointerDown.call(this, target, coordinates, pointerId, buttonIndex);
  11411. };
  11412. return ImageScrollBar;
  11413. }(_baseSlider__WEBPACK_IMPORTED_MODULE_1__["BaseSlider"]));
  11414. /***/ }),
  11415. /***/ "./2D/controls/sliders/scrollBar.ts":
  11416. /*!******************************************!*\
  11417. !*** ./2D/controls/sliders/scrollBar.ts ***!
  11418. \******************************************/
  11419. /*! exports provided: ScrollBar */
  11420. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  11421. "use strict";
  11422. __webpack_require__.r(__webpack_exports__);
  11423. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ScrollBar", function() { return ScrollBar; });
  11424. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  11425. /* harmony import */ var _baseSlider__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./baseSlider */ "./2D/controls/sliders/baseSlider.ts");
  11426. /* harmony import */ var _measure__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../measure */ "./2D/measure.ts");
  11427. /**
  11428. * Class used to create slider controls
  11429. */
  11430. var ScrollBar = /** @class */ (function (_super) {
  11431. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(ScrollBar, _super);
  11432. /**
  11433. * Creates a new Slider
  11434. * @param name defines the control name
  11435. */
  11436. function ScrollBar(name) {
  11437. var _this = _super.call(this, name) || this;
  11438. _this.name = name;
  11439. _this._background = "black";
  11440. _this._borderColor = "white";
  11441. _this._tempMeasure = new _measure__WEBPACK_IMPORTED_MODULE_2__["Measure"](0, 0, 0, 0);
  11442. return _this;
  11443. }
  11444. Object.defineProperty(ScrollBar.prototype, "borderColor", {
  11445. /** Gets or sets border color */
  11446. get: function () {
  11447. return this._borderColor;
  11448. },
  11449. set: function (value) {
  11450. if (this._borderColor === value) {
  11451. return;
  11452. }
  11453. this._borderColor = value;
  11454. this._markAsDirty();
  11455. },
  11456. enumerable: false,
  11457. configurable: true
  11458. });
  11459. Object.defineProperty(ScrollBar.prototype, "background", {
  11460. /** Gets or sets background color */
  11461. get: function () {
  11462. return this._background;
  11463. },
  11464. set: function (value) {
  11465. if (this._background === value) {
  11466. return;
  11467. }
  11468. this._background = value;
  11469. this._markAsDirty();
  11470. },
  11471. enumerable: false,
  11472. configurable: true
  11473. });
  11474. ScrollBar.prototype._getTypeName = function () {
  11475. return "Scrollbar";
  11476. };
  11477. ScrollBar.prototype._getThumbThickness = function () {
  11478. var thumbThickness = 0;
  11479. if (this._thumbWidth.isPixel) {
  11480. thumbThickness = this._thumbWidth.getValue(this._host);
  11481. }
  11482. else {
  11483. thumbThickness = this._backgroundBoxThickness * this._thumbWidth.getValue(this._host);
  11484. }
  11485. return thumbThickness;
  11486. };
  11487. ScrollBar.prototype._draw = function (context) {
  11488. context.save();
  11489. this._applyStates(context);
  11490. this._prepareRenderingData("rectangle");
  11491. var left = this._renderLeft;
  11492. var thumbPosition = this._getThumbPosition();
  11493. context.fillStyle = this._background;
  11494. context.fillRect(this._currentMeasure.left, this._currentMeasure.top, this._currentMeasure.width, this._currentMeasure.height);
  11495. // Value bar
  11496. context.fillStyle = this.color;
  11497. // Thumb
  11498. if (this.isVertical) {
  11499. this._tempMeasure.left = left - this._effectiveBarOffset;
  11500. this._tempMeasure.top = this._currentMeasure.top + thumbPosition;
  11501. this._tempMeasure.width = this._currentMeasure.width;
  11502. this._tempMeasure.height = this._effectiveThumbThickness;
  11503. }
  11504. else {
  11505. this._tempMeasure.left = this._currentMeasure.left + thumbPosition;
  11506. this._tempMeasure.top = this._currentMeasure.top;
  11507. this._tempMeasure.width = this._effectiveThumbThickness;
  11508. this._tempMeasure.height = this._currentMeasure.height;
  11509. }
  11510. context.fillRect(this._tempMeasure.left, this._tempMeasure.top, this._tempMeasure.width, this._tempMeasure.height);
  11511. context.restore();
  11512. };
  11513. /** @hidden */
  11514. ScrollBar.prototype._updateValueFromPointer = function (x, y) {
  11515. if (this.rotation != 0) {
  11516. this._invertTransformMatrix.transformCoordinates(x, y, this._transformedPosition);
  11517. x = this._transformedPosition.x;
  11518. y = this._transformedPosition.y;
  11519. }
  11520. if (this._first) {
  11521. this._first = false;
  11522. this._originX = x;
  11523. this._originY = y;
  11524. // Check if move is required
  11525. if (x < this._tempMeasure.left || x > this._tempMeasure.left + this._tempMeasure.width || y < this._tempMeasure.top || y > this._tempMeasure.top + this._tempMeasure.height) {
  11526. if (this.isVertical) {
  11527. this.value = this.minimum + (1 - ((y - this._currentMeasure.top) / this._currentMeasure.height)) * (this.maximum - this.minimum);
  11528. }
  11529. else {
  11530. this.value = this.minimum + ((x - this._currentMeasure.left) / this._currentMeasure.width) * (this.maximum - this.minimum);
  11531. }
  11532. }
  11533. }
  11534. // Delta mode
  11535. var delta = 0;
  11536. if (this.isVertical) {
  11537. delta = -((y - this._originY) / (this._currentMeasure.height - this._effectiveThumbThickness));
  11538. }
  11539. else {
  11540. delta = (x - this._originX) / (this._currentMeasure.width - this._effectiveThumbThickness);
  11541. }
  11542. this.value += delta * (this.maximum - this.minimum);
  11543. this._originX = x;
  11544. this._originY = y;
  11545. };
  11546. ScrollBar.prototype._onPointerDown = function (target, coordinates, pointerId, buttonIndex) {
  11547. this._first = true;
  11548. return _super.prototype._onPointerDown.call(this, target, coordinates, pointerId, buttonIndex);
  11549. };
  11550. return ScrollBar;
  11551. }(_baseSlider__WEBPACK_IMPORTED_MODULE_1__["BaseSlider"]));
  11552. /***/ }),
  11553. /***/ "./2D/controls/sliders/slider.ts":
  11554. /*!***************************************!*\
  11555. !*** ./2D/controls/sliders/slider.ts ***!
  11556. \***************************************/
  11557. /*! exports provided: Slider */
  11558. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  11559. "use strict";
  11560. __webpack_require__.r(__webpack_exports__);
  11561. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Slider", function() { return Slider; });
  11562. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  11563. /* harmony import */ var _baseSlider__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./baseSlider */ "./2D/controls/sliders/baseSlider.ts");
  11564. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math.vector");
  11565. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__);
  11566. /**
  11567. * Class used to create slider controls
  11568. */
  11569. var Slider = /** @class */ (function (_super) {
  11570. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(Slider, _super);
  11571. /**
  11572. * Creates a new Slider
  11573. * @param name defines the control name
  11574. */
  11575. function Slider(name) {
  11576. var _this = _super.call(this, name) || this;
  11577. _this.name = name;
  11578. _this._background = "black";
  11579. _this._borderColor = "white";
  11580. _this._thumbColor = "";
  11581. _this._isThumbCircle = false;
  11582. _this._displayValueBar = true;
  11583. return _this;
  11584. }
  11585. Object.defineProperty(Slider.prototype, "displayValueBar", {
  11586. /** Gets or sets a boolean indicating if the value bar must be rendered */
  11587. get: function () {
  11588. return this._displayValueBar;
  11589. },
  11590. set: function (value) {
  11591. if (this._displayValueBar === value) {
  11592. return;
  11593. }
  11594. this._displayValueBar = value;
  11595. this._markAsDirty();
  11596. },
  11597. enumerable: false,
  11598. configurable: true
  11599. });
  11600. Object.defineProperty(Slider.prototype, "borderColor", {
  11601. /** Gets or sets border color */
  11602. get: function () {
  11603. return this._borderColor;
  11604. },
  11605. set: function (value) {
  11606. if (this._borderColor === value) {
  11607. return;
  11608. }
  11609. this._borderColor = value;
  11610. this._markAsDirty();
  11611. },
  11612. enumerable: false,
  11613. configurable: true
  11614. });
  11615. Object.defineProperty(Slider.prototype, "background", {
  11616. /** Gets or sets background color */
  11617. get: function () {
  11618. return this._background;
  11619. },
  11620. set: function (value) {
  11621. if (this._background === value) {
  11622. return;
  11623. }
  11624. this._background = value;
  11625. this._markAsDirty();
  11626. },
  11627. enumerable: false,
  11628. configurable: true
  11629. });
  11630. Object.defineProperty(Slider.prototype, "thumbColor", {
  11631. /** Gets or sets thumb's color */
  11632. get: function () {
  11633. return this._thumbColor;
  11634. },
  11635. set: function (value) {
  11636. if (this._thumbColor === value) {
  11637. return;
  11638. }
  11639. this._thumbColor = value;
  11640. this._markAsDirty();
  11641. },
  11642. enumerable: false,
  11643. configurable: true
  11644. });
  11645. Object.defineProperty(Slider.prototype, "isThumbCircle", {
  11646. /** Gets or sets a boolean indicating if the thumb should be round or square */
  11647. get: function () {
  11648. return this._isThumbCircle;
  11649. },
  11650. set: function (value) {
  11651. if (this._isThumbCircle === value) {
  11652. return;
  11653. }
  11654. this._isThumbCircle = value;
  11655. this._markAsDirty();
  11656. },
  11657. enumerable: false,
  11658. configurable: true
  11659. });
  11660. Slider.prototype._getTypeName = function () {
  11661. return "Slider";
  11662. };
  11663. Slider.prototype._draw = function (context, invalidatedRectangle) {
  11664. context.save();
  11665. this._applyStates(context);
  11666. this._prepareRenderingData(this.isThumbCircle ? "circle" : "rectangle");
  11667. var left = this._renderLeft;
  11668. var top = this._renderTop;
  11669. var width = this._renderWidth;
  11670. var height = this._renderHeight;
  11671. var radius = 0;
  11672. if (this.isThumbClamped && this.isThumbCircle) {
  11673. if (this.isVertical) {
  11674. top += (this._effectiveThumbThickness / 2);
  11675. }
  11676. else {
  11677. left += (this._effectiveThumbThickness / 2);
  11678. }
  11679. radius = this._backgroundBoxThickness / 2;
  11680. }
  11681. else {
  11682. radius = (this._effectiveThumbThickness - this._effectiveBarOffset) / 2;
  11683. }
  11684. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  11685. context.shadowColor = this.shadowColor;
  11686. context.shadowBlur = this.shadowBlur;
  11687. context.shadowOffsetX = this.shadowOffsetX;
  11688. context.shadowOffsetY = this.shadowOffsetY;
  11689. }
  11690. var thumbPosition = this._getThumbPosition();
  11691. context.fillStyle = this._background;
  11692. if (this.isVertical) {
  11693. if (this.isThumbClamped) {
  11694. if (this.isThumbCircle) {
  11695. context.beginPath();
  11696. context.arc(left + this._backgroundBoxThickness / 2, top, radius, Math.PI, 2 * Math.PI);
  11697. context.fill();
  11698. context.fillRect(left, top, width, height);
  11699. }
  11700. else {
  11701. context.fillRect(left, top, width, height + this._effectiveThumbThickness);
  11702. }
  11703. }
  11704. else {
  11705. context.fillRect(left, top, width, height);
  11706. }
  11707. }
  11708. else {
  11709. if (this.isThumbClamped) {
  11710. if (this.isThumbCircle) {
  11711. context.beginPath();
  11712. context.arc(left + this._backgroundBoxLength, top + (this._backgroundBoxThickness / 2), radius, 0, 2 * Math.PI);
  11713. context.fill();
  11714. context.fillRect(left, top, width, height);
  11715. }
  11716. else {
  11717. context.fillRect(left, top, width + this._effectiveThumbThickness, height);
  11718. }
  11719. }
  11720. else {
  11721. context.fillRect(left, top, width, height);
  11722. }
  11723. }
  11724. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  11725. context.shadowBlur = 0;
  11726. context.shadowOffsetX = 0;
  11727. context.shadowOffsetY = 0;
  11728. }
  11729. // Value bar
  11730. context.fillStyle = this.color;
  11731. if (this._displayValueBar) {
  11732. if (this.isVertical) {
  11733. if (this.isThumbClamped) {
  11734. if (this.isThumbCircle) {
  11735. context.beginPath();
  11736. context.arc(left + this._backgroundBoxThickness / 2, top + this._backgroundBoxLength, radius, 0, 2 * Math.PI);
  11737. context.fill();
  11738. context.fillRect(left, top + thumbPosition, width, height - thumbPosition);
  11739. }
  11740. else {
  11741. context.fillRect(left, top + thumbPosition, width, height - thumbPosition + this._effectiveThumbThickness);
  11742. }
  11743. }
  11744. else {
  11745. context.fillRect(left, top + thumbPosition, width, height - thumbPosition);
  11746. }
  11747. }
  11748. else {
  11749. if (this.isThumbClamped) {
  11750. if (this.isThumbCircle) {
  11751. context.beginPath();
  11752. context.arc(left, top + this._backgroundBoxThickness / 2, radius, 0, 2 * Math.PI);
  11753. context.fill();
  11754. context.fillRect(left, top, thumbPosition, height);
  11755. }
  11756. else {
  11757. context.fillRect(left, top, thumbPosition, height);
  11758. }
  11759. }
  11760. else {
  11761. context.fillRect(left, top, thumbPosition, height);
  11762. }
  11763. }
  11764. }
  11765. // Thumb
  11766. context.fillStyle = this._thumbColor || this.color;
  11767. if (this.displayThumb) {
  11768. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  11769. context.shadowColor = this.shadowColor;
  11770. context.shadowBlur = this.shadowBlur;
  11771. context.shadowOffsetX = this.shadowOffsetX;
  11772. context.shadowOffsetY = this.shadowOffsetY;
  11773. }
  11774. if (this._isThumbCircle) {
  11775. context.beginPath();
  11776. if (this.isVertical) {
  11777. context.arc(left + this._backgroundBoxThickness / 2, top + thumbPosition, radius, 0, 2 * Math.PI);
  11778. }
  11779. else {
  11780. context.arc(left + thumbPosition, top + (this._backgroundBoxThickness / 2), radius, 0, 2 * Math.PI);
  11781. }
  11782. context.fill();
  11783. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  11784. context.shadowBlur = 0;
  11785. context.shadowOffsetX = 0;
  11786. context.shadowOffsetY = 0;
  11787. }
  11788. context.strokeStyle = this._borderColor;
  11789. context.stroke();
  11790. }
  11791. else {
  11792. if (this.isVertical) {
  11793. context.fillRect(left - this._effectiveBarOffset, this._currentMeasure.top + thumbPosition, this._currentMeasure.width, this._effectiveThumbThickness);
  11794. }
  11795. else {
  11796. context.fillRect(this._currentMeasure.left + thumbPosition, this._currentMeasure.top, this._effectiveThumbThickness, this._currentMeasure.height);
  11797. }
  11798. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  11799. context.shadowBlur = 0;
  11800. context.shadowOffsetX = 0;
  11801. context.shadowOffsetY = 0;
  11802. }
  11803. context.strokeStyle = this._borderColor;
  11804. if (this.isVertical) {
  11805. context.strokeRect(left - this._effectiveBarOffset, this._currentMeasure.top + thumbPosition, this._currentMeasure.width, this._effectiveThumbThickness);
  11806. }
  11807. else {
  11808. context.strokeRect(this._currentMeasure.left + thumbPosition, this._currentMeasure.top, this._effectiveThumbThickness, this._currentMeasure.height);
  11809. }
  11810. }
  11811. }
  11812. context.restore();
  11813. };
  11814. return Slider;
  11815. }(_baseSlider__WEBPACK_IMPORTED_MODULE_1__["BaseSlider"]));
  11816. babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__["_TypeStore"].RegisteredTypes["BABYLON.GUI.Slider"] = Slider;
  11817. /***/ }),
  11818. /***/ "./2D/controls/stackPanel.ts":
  11819. /*!***********************************!*\
  11820. !*** ./2D/controls/stackPanel.ts ***!
  11821. \***********************************/
  11822. /*! exports provided: StackPanel */
  11823. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  11824. "use strict";
  11825. __webpack_require__.r(__webpack_exports__);
  11826. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "StackPanel", function() { return StackPanel; });
  11827. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  11828. /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Maths/math.vector");
  11829. /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
  11830. /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container */ "./2D/controls/container.ts");
  11831. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  11832. /**
  11833. * Class used to create a 2D stack panel container
  11834. */
  11835. var StackPanel = /** @class */ (function (_super) {
  11836. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(StackPanel, _super);
  11837. /**
  11838. * Creates a new StackPanel
  11839. * @param name defines control name
  11840. */
  11841. function StackPanel(name) {
  11842. var _this = _super.call(this, name) || this;
  11843. _this.name = name;
  11844. _this._isVertical = true;
  11845. _this._manualWidth = false;
  11846. _this._manualHeight = false;
  11847. _this._doNotTrackManualChanges = false;
  11848. /**
  11849. * Gets or sets a boolean indicating that layou warnings should be ignored
  11850. */
  11851. _this.ignoreLayoutWarnings = false;
  11852. return _this;
  11853. }
  11854. Object.defineProperty(StackPanel.prototype, "isVertical", {
  11855. /** Gets or sets a boolean indicating if the stack panel is vertical or horizontal*/
  11856. get: function () {
  11857. return this._isVertical;
  11858. },
  11859. set: function (value) {
  11860. if (this._isVertical === value) {
  11861. return;
  11862. }
  11863. this._isVertical = value;
  11864. this._markAsDirty();
  11865. },
  11866. enumerable: false,
  11867. configurable: true
  11868. });
  11869. Object.defineProperty(StackPanel.prototype, "width", {
  11870. get: function () {
  11871. return this._width.toString(this._host);
  11872. },
  11873. /**
  11874. * Gets or sets panel width.
  11875. * This value should not be set when in horizontal mode as it will be computed automatically
  11876. */
  11877. set: function (value) {
  11878. if (!this._doNotTrackManualChanges) {
  11879. this._manualWidth = true;
  11880. }
  11881. if (this._width.toString(this._host) === value) {
  11882. return;
  11883. }
  11884. if (this._width.fromString(value)) {
  11885. this._markAsDirty();
  11886. }
  11887. },
  11888. enumerable: false,
  11889. configurable: true
  11890. });
  11891. Object.defineProperty(StackPanel.prototype, "height", {
  11892. get: function () {
  11893. return this._height.toString(this._host);
  11894. },
  11895. /**
  11896. * Gets or sets panel height.
  11897. * This value should not be set when in vertical mode as it will be computed automatically
  11898. */
  11899. set: function (value) {
  11900. if (!this._doNotTrackManualChanges) {
  11901. this._manualHeight = true;
  11902. }
  11903. if (this._height.toString(this._host) === value) {
  11904. return;
  11905. }
  11906. if (this._height.fromString(value)) {
  11907. this._markAsDirty();
  11908. }
  11909. },
  11910. enumerable: false,
  11911. configurable: true
  11912. });
  11913. StackPanel.prototype._getTypeName = function () {
  11914. return "StackPanel";
  11915. };
  11916. /** @hidden */
  11917. StackPanel.prototype._preMeasure = function (parentMeasure, context) {
  11918. for (var _i = 0, _a = this._children; _i < _a.length; _i++) {
  11919. var child = _a[_i];
  11920. if (this._isVertical) {
  11921. child.verticalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].VERTICAL_ALIGNMENT_TOP;
  11922. }
  11923. else {
  11924. child.horizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  11925. }
  11926. }
  11927. _super.prototype._preMeasure.call(this, parentMeasure, context);
  11928. };
  11929. StackPanel.prototype._additionalProcessing = function (parentMeasure, context) {
  11930. _super.prototype._additionalProcessing.call(this, parentMeasure, context);
  11931. this._measureForChildren.copyFrom(parentMeasure);
  11932. this._measureForChildren.left = this._currentMeasure.left;
  11933. this._measureForChildren.top = this._currentMeasure.top;
  11934. if (!this.isVertical || this._manualWidth) {
  11935. this._measureForChildren.width = this._currentMeasure.width;
  11936. }
  11937. if (this.isVertical || this._manualHeight) {
  11938. this._measureForChildren.height = this._currentMeasure.height;
  11939. }
  11940. };
  11941. StackPanel.prototype._postMeasure = function () {
  11942. var stackWidth = 0;
  11943. var stackHeight = 0;
  11944. for (var _i = 0, _a = this._children; _i < _a.length; _i++) {
  11945. var child = _a[_i];
  11946. if (!child.isVisible || child.notRenderable) {
  11947. continue;
  11948. }
  11949. if (this._isVertical) {
  11950. if (child.top !== stackHeight + "px") {
  11951. child.top = stackHeight + "px";
  11952. this._rebuildLayout = true;
  11953. child._top.ignoreAdaptiveScaling = true;
  11954. }
  11955. if (child._height.isPercentage && !child._automaticSize) {
  11956. if (!this.ignoreLayoutWarnings) {
  11957. babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Tools"].Warn("Control (Name:" + child.name + ", UniqueId:" + child.uniqueId + ") is using height in percentage mode inside a vertical StackPanel");
  11958. }
  11959. }
  11960. else {
  11961. stackHeight += child._currentMeasure.height + child.paddingTopInPixels + child.paddingBottomInPixels;
  11962. }
  11963. }
  11964. else {
  11965. if (child.left !== stackWidth + "px") {
  11966. child.left = stackWidth + "px";
  11967. this._rebuildLayout = true;
  11968. child._left.ignoreAdaptiveScaling = true;
  11969. }
  11970. if (child._width.isPercentage && !child._automaticSize) {
  11971. if (!this.ignoreLayoutWarnings) {
  11972. babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Tools"].Warn("Control (Name:" + child.name + ", UniqueId:" + child.uniqueId + ") is using width in percentage mode inside a horizontal StackPanel");
  11973. }
  11974. }
  11975. else {
  11976. stackWidth += child._currentMeasure.width + child.paddingLeftInPixels + child.paddingRightInPixels;
  11977. }
  11978. }
  11979. }
  11980. this._doNotTrackManualChanges = true;
  11981. // Let stack panel width or height default to stackHeight and stackWidth if dimensions are not specified.
  11982. // User can now define their own height and width for stack panel.
  11983. var panelWidthChanged = false;
  11984. var panelHeightChanged = false;
  11985. if (!this._manualHeight && this._isVertical) { // do not specify height if strictly defined by user
  11986. var previousHeight = this.height;
  11987. this.height = stackHeight + "px";
  11988. panelHeightChanged = previousHeight !== this.height || !this._height.ignoreAdaptiveScaling;
  11989. }
  11990. if (!this._manualWidth && !this._isVertical) { // do not specify width if strictly defined by user
  11991. var previousWidth = this.width;
  11992. this.width = stackWidth + "px";
  11993. panelWidthChanged = previousWidth !== this.width || !this._width.ignoreAdaptiveScaling;
  11994. }
  11995. if (panelHeightChanged) {
  11996. this._height.ignoreAdaptiveScaling = true;
  11997. }
  11998. if (panelWidthChanged) {
  11999. this._width.ignoreAdaptiveScaling = true;
  12000. }
  12001. this._doNotTrackManualChanges = false;
  12002. if (panelWidthChanged || panelHeightChanged) {
  12003. this._rebuildLayout = true;
  12004. }
  12005. _super.prototype._postMeasure.call(this);
  12006. };
  12007. return StackPanel;
  12008. }(_container__WEBPACK_IMPORTED_MODULE_2__["Container"]));
  12009. babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredTypes["BABYLON.GUI.StackPanel"] = StackPanel;
  12010. /***/ }),
  12011. /***/ "./2D/controls/statics.ts":
  12012. /*!********************************!*\
  12013. !*** ./2D/controls/statics.ts ***!
  12014. \********************************/
  12015. /*! exports provided: name */
  12016. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  12017. "use strict";
  12018. __webpack_require__.r(__webpack_exports__);
  12019. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "name", function() { return name; });
  12020. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  12021. /* harmony import */ var _stackPanel__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./stackPanel */ "./2D/controls/stackPanel.ts");
  12022. /* harmony import */ var _textBlock__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./textBlock */ "./2D/controls/textBlock.ts");
  12023. /**
  12024. * Forcing an export so that this code will execute
  12025. * @hidden
  12026. */
  12027. var name = "Statics";
  12028. /**
  12029. * Creates a stack panel that can be used to render headers
  12030. * @param control defines the control to associate with the header
  12031. * @param text defines the text of the header
  12032. * @param size defines the size of the header
  12033. * @param options defines options used to configure the header
  12034. * @returns a new StackPanel
  12035. */
  12036. _control__WEBPACK_IMPORTED_MODULE_0__["Control"].AddHeader = function (control, text, size, options) {
  12037. var panel = new _stackPanel__WEBPACK_IMPORTED_MODULE_1__["StackPanel"]("panel");
  12038. var isHorizontal = options ? options.isHorizontal : true;
  12039. var controlFirst = options ? options.controlFirst : true;
  12040. panel.isVertical = !isHorizontal;
  12041. var header = new _textBlock__WEBPACK_IMPORTED_MODULE_2__["TextBlock"]("header");
  12042. header.text = text;
  12043. header.textHorizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_0__["Control"].HORIZONTAL_ALIGNMENT_LEFT;
  12044. if (isHorizontal) {
  12045. header.width = size;
  12046. }
  12047. else {
  12048. header.height = size;
  12049. }
  12050. if (controlFirst) {
  12051. panel.addControl(control);
  12052. panel.addControl(header);
  12053. header.paddingLeft = "5px";
  12054. }
  12055. else {
  12056. panel.addControl(header);
  12057. panel.addControl(control);
  12058. header.paddingRight = "5px";
  12059. }
  12060. header.shadowBlur = control.shadowBlur;
  12061. header.shadowColor = control.shadowColor;
  12062. header.shadowOffsetX = control.shadowOffsetX;
  12063. header.shadowOffsetY = control.shadowOffsetY;
  12064. return panel;
  12065. };
  12066. /***/ }),
  12067. /***/ "./2D/controls/textBlock.ts":
  12068. /*!**********************************!*\
  12069. !*** ./2D/controls/textBlock.ts ***!
  12070. \**********************************/
  12071. /*! exports provided: TextWrapping, TextBlock */
  12072. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  12073. "use strict";
  12074. __webpack_require__.r(__webpack_exports__);
  12075. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TextWrapping", function() { return TextWrapping; });
  12076. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TextBlock", function() { return TextBlock; });
  12077. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  12078. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math.vector");
  12079. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
  12080. /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
  12081. /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
  12082. /**
  12083. * Enum that determines the text-wrapping mode to use.
  12084. */
  12085. var TextWrapping;
  12086. (function (TextWrapping) {
  12087. /**
  12088. * Clip the text when it's larger than Control.width; this is the default mode.
  12089. */
  12090. TextWrapping[TextWrapping["Clip"] = 0] = "Clip";
  12091. /**
  12092. * Wrap the text word-wise, i.e. try to add line-breaks at word boundary to fit within Control.width.
  12093. */
  12094. TextWrapping[TextWrapping["WordWrap"] = 1] = "WordWrap";
  12095. /**
  12096. * Ellipsize the text, i.e. shrink with trailing … when text is larger than Control.width.
  12097. */
  12098. TextWrapping[TextWrapping["Ellipsis"] = 2] = "Ellipsis";
  12099. })(TextWrapping || (TextWrapping = {}));
  12100. /**
  12101. * Class used to create text block control
  12102. */
  12103. var TextBlock = /** @class */ (function (_super) {
  12104. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(TextBlock, _super);
  12105. /**
  12106. * Creates a new TextBlock object
  12107. * @param name defines the name of the control
  12108. * @param text defines the text to display (emptry string by default)
  12109. */
  12110. function TextBlock(
  12111. /**
  12112. * Defines the name of the control
  12113. */
  12114. name, text) {
  12115. if (text === void 0) { text = ""; }
  12116. var _this = _super.call(this, name) || this;
  12117. _this.name = name;
  12118. _this._text = "";
  12119. _this._textWrapping = TextWrapping.Clip;
  12120. _this._textHorizontalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_CENTER;
  12121. _this._textVerticalAlignment = _control__WEBPACK_IMPORTED_MODULE_3__["Control"].VERTICAL_ALIGNMENT_CENTER;
  12122. _this._resizeToFit = false;
  12123. _this._lineSpacing = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__["ValueAndUnit"](0);
  12124. _this._outlineWidth = 0;
  12125. _this._outlineColor = "white";
  12126. _this._underline = false;
  12127. _this._lineThrough = false;
  12128. /**
  12129. * An event triggered after the text is changed
  12130. */
  12131. _this.onTextChangedObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  12132. /**
  12133. * An event triggered after the text was broken up into lines
  12134. */
  12135. _this.onLinesReadyObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  12136. _this.text = text;
  12137. return _this;
  12138. }
  12139. Object.defineProperty(TextBlock.prototype, "lines", {
  12140. /**
  12141. * Return the line list (you may need to use the onLinesReadyObservable to make sure the list is ready)
  12142. */
  12143. get: function () {
  12144. return this._lines;
  12145. },
  12146. enumerable: false,
  12147. configurable: true
  12148. });
  12149. Object.defineProperty(TextBlock.prototype, "resizeToFit", {
  12150. /**
  12151. * Gets or sets an boolean indicating that the TextBlock will be resized to fit container
  12152. */
  12153. get: function () {
  12154. return this._resizeToFit;
  12155. },
  12156. /**
  12157. * Gets or sets an boolean indicating that the TextBlock will be resized to fit container
  12158. */
  12159. set: function (value) {
  12160. if (this._resizeToFit === value) {
  12161. return;
  12162. }
  12163. this._resizeToFit = value;
  12164. if (this._resizeToFit) {
  12165. this._width.ignoreAdaptiveScaling = true;
  12166. this._height.ignoreAdaptiveScaling = true;
  12167. }
  12168. this._markAsDirty();
  12169. },
  12170. enumerable: false,
  12171. configurable: true
  12172. });
  12173. Object.defineProperty(TextBlock.prototype, "textWrapping", {
  12174. /**
  12175. * Gets or sets a boolean indicating if text must be wrapped
  12176. */
  12177. get: function () {
  12178. return this._textWrapping;
  12179. },
  12180. /**
  12181. * Gets or sets a boolean indicating if text must be wrapped
  12182. */
  12183. set: function (value) {
  12184. if (this._textWrapping === value) {
  12185. return;
  12186. }
  12187. this._textWrapping = +value;
  12188. this._markAsDirty();
  12189. },
  12190. enumerable: false,
  12191. configurable: true
  12192. });
  12193. Object.defineProperty(TextBlock.prototype, "text", {
  12194. /**
  12195. * Gets or sets text to display
  12196. */
  12197. get: function () {
  12198. return this._text;
  12199. },
  12200. /**
  12201. * Gets or sets text to display
  12202. */
  12203. set: function (value) {
  12204. if (this._text === value) {
  12205. return;
  12206. }
  12207. this._text = value;
  12208. this._markAsDirty();
  12209. this.onTextChangedObservable.notifyObservers(this);
  12210. },
  12211. enumerable: false,
  12212. configurable: true
  12213. });
  12214. Object.defineProperty(TextBlock.prototype, "textHorizontalAlignment", {
  12215. /**
  12216. * Gets or sets text horizontal alignment (BABYLON.GUI.Control.HORIZONTAL_ALIGNMENT_CENTER by default)
  12217. */
  12218. get: function () {
  12219. return this._textHorizontalAlignment;
  12220. },
  12221. /**
  12222. * Gets or sets text horizontal alignment (BABYLON.GUI.Control.HORIZONTAL_ALIGNMENT_CENTER by default)
  12223. */
  12224. set: function (value) {
  12225. if (this._textHorizontalAlignment === value) {
  12226. return;
  12227. }
  12228. this._textHorizontalAlignment = value;
  12229. this._markAsDirty();
  12230. },
  12231. enumerable: false,
  12232. configurable: true
  12233. });
  12234. Object.defineProperty(TextBlock.prototype, "textVerticalAlignment", {
  12235. /**
  12236. * Gets or sets text vertical alignment (BABYLON.GUI.Control.VERTICAL_ALIGNMENT_CENTER by default)
  12237. */
  12238. get: function () {
  12239. return this._textVerticalAlignment;
  12240. },
  12241. /**
  12242. * Gets or sets text vertical alignment (BABYLON.GUI.Control.VERTICAL_ALIGNMENT_CENTER by default)
  12243. */
  12244. set: function (value) {
  12245. if (this._textVerticalAlignment === value) {
  12246. return;
  12247. }
  12248. this._textVerticalAlignment = value;
  12249. this._markAsDirty();
  12250. },
  12251. enumerable: false,
  12252. configurable: true
  12253. });
  12254. Object.defineProperty(TextBlock.prototype, "lineSpacing", {
  12255. /**
  12256. * Gets or sets line spacing value
  12257. */
  12258. get: function () {
  12259. return this._lineSpacing.toString(this._host);
  12260. },
  12261. /**
  12262. * Gets or sets line spacing value
  12263. */
  12264. set: function (value) {
  12265. if (this._lineSpacing.fromString(value)) {
  12266. this._markAsDirty();
  12267. }
  12268. },
  12269. enumerable: false,
  12270. configurable: true
  12271. });
  12272. Object.defineProperty(TextBlock.prototype, "outlineWidth", {
  12273. /**
  12274. * Gets or sets outlineWidth of the text to display
  12275. */
  12276. get: function () {
  12277. return this._outlineWidth;
  12278. },
  12279. /**
  12280. * Gets or sets outlineWidth of the text to display
  12281. */
  12282. set: function (value) {
  12283. if (this._outlineWidth === value) {
  12284. return;
  12285. }
  12286. this._outlineWidth = value;
  12287. this._markAsDirty();
  12288. },
  12289. enumerable: false,
  12290. configurable: true
  12291. });
  12292. Object.defineProperty(TextBlock.prototype, "underline", {
  12293. /**
  12294. * Gets or sets a boolean indicating that text must have underline
  12295. */
  12296. get: function () {
  12297. return this._underline;
  12298. },
  12299. /**
  12300. * Gets or sets a boolean indicating that text must have underline
  12301. */
  12302. set: function (value) {
  12303. if (this._underline === value) {
  12304. return;
  12305. }
  12306. this._underline = value;
  12307. this._markAsDirty();
  12308. },
  12309. enumerable: false,
  12310. configurable: true
  12311. });
  12312. Object.defineProperty(TextBlock.prototype, "lineThrough", {
  12313. /**
  12314. * Gets or sets an boolean indicating that text must be crossed out
  12315. */
  12316. get: function () {
  12317. return this._lineThrough;
  12318. },
  12319. /**
  12320. * Gets or sets an boolean indicating that text must be crossed out
  12321. */
  12322. set: function (value) {
  12323. if (this._lineThrough === value) {
  12324. return;
  12325. }
  12326. this._lineThrough = value;
  12327. this._markAsDirty();
  12328. },
  12329. enumerable: false,
  12330. configurable: true
  12331. });
  12332. Object.defineProperty(TextBlock.prototype, "outlineColor", {
  12333. /**
  12334. * Gets or sets outlineColor of the text to display
  12335. */
  12336. get: function () {
  12337. return this._outlineColor;
  12338. },
  12339. /**
  12340. * Gets or sets outlineColor of the text to display
  12341. */
  12342. set: function (value) {
  12343. if (this._outlineColor === value) {
  12344. return;
  12345. }
  12346. this._outlineColor = value;
  12347. this._markAsDirty();
  12348. },
  12349. enumerable: false,
  12350. configurable: true
  12351. });
  12352. TextBlock.prototype._getTypeName = function () {
  12353. return "TextBlock";
  12354. };
  12355. TextBlock.prototype._processMeasures = function (parentMeasure, context) {
  12356. if (!this._fontOffset) {
  12357. this._fontOffset = _control__WEBPACK_IMPORTED_MODULE_3__["Control"]._GetFontOffset(context.font);
  12358. }
  12359. _super.prototype._processMeasures.call(this, parentMeasure, context);
  12360. // Prepare lines
  12361. this._lines = this._breakLines(this._currentMeasure.width, context);
  12362. this.onLinesReadyObservable.notifyObservers(this);
  12363. var maxLineWidth = 0;
  12364. for (var i = 0; i < this._lines.length; i++) {
  12365. var line = this._lines[i];
  12366. if (line.width > maxLineWidth) {
  12367. maxLineWidth = line.width;
  12368. }
  12369. }
  12370. if (this._resizeToFit) {
  12371. if (this._textWrapping === TextWrapping.Clip) {
  12372. var newWidth = (this.paddingLeftInPixels + this.paddingRightInPixels + maxLineWidth) | 0;
  12373. if (newWidth !== this._width.internalValue) {
  12374. this._width.updateInPlace(newWidth, _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__["ValueAndUnit"].UNITMODE_PIXEL);
  12375. this._rebuildLayout = true;
  12376. }
  12377. }
  12378. var newHeight = (this.paddingTopInPixels + this.paddingBottomInPixels + this._fontOffset.height * this._lines.length) | 0;
  12379. if (this._lines.length > 0 && this._lineSpacing.internalValue !== 0) {
  12380. var lineSpacing = 0;
  12381. if (this._lineSpacing.isPixel) {
  12382. lineSpacing = this._lineSpacing.getValue(this._host);
  12383. }
  12384. else {
  12385. lineSpacing = this._lineSpacing.getValue(this._host) * this._height.getValueInPixel(this._host, this._cachedParentMeasure.height);
  12386. }
  12387. newHeight += (this._lines.length - 1) * lineSpacing;
  12388. }
  12389. if (newHeight !== this._height.internalValue) {
  12390. this._height.updateInPlace(newHeight, _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__["ValueAndUnit"].UNITMODE_PIXEL);
  12391. this._rebuildLayout = true;
  12392. }
  12393. }
  12394. };
  12395. TextBlock.prototype._drawText = function (text, textWidth, y, context) {
  12396. var width = this._currentMeasure.width;
  12397. var x = 0;
  12398. switch (this._textHorizontalAlignment) {
  12399. case _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT:
  12400. x = 0;
  12401. break;
  12402. case _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_RIGHT:
  12403. x = width - textWidth;
  12404. break;
  12405. case _control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_CENTER:
  12406. x = (width - textWidth) / 2;
  12407. break;
  12408. }
  12409. if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
  12410. context.shadowColor = this.shadowColor;
  12411. context.shadowBlur = this.shadowBlur;
  12412. context.shadowOffsetX = this.shadowOffsetX;
  12413. context.shadowOffsetY = this.shadowOffsetY;
  12414. }
  12415. if (this.outlineWidth) {
  12416. context.strokeText(text, this._currentMeasure.left + x, y);
  12417. }
  12418. context.fillText(text, this._currentMeasure.left + x, y);
  12419. if (this._underline) {
  12420. context.beginPath();
  12421. context.lineWidth = Math.round(this.fontSizeInPixels * 0.05);
  12422. context.moveTo(this._currentMeasure.left + x, y + 3);
  12423. context.lineTo(this._currentMeasure.left + x + textWidth, y + 3);
  12424. context.stroke();
  12425. context.closePath();
  12426. }
  12427. if (this._lineThrough) {
  12428. context.beginPath();
  12429. context.lineWidth = Math.round(this.fontSizeInPixels * 0.05);
  12430. context.moveTo(this._currentMeasure.left + x, y - this.fontSizeInPixels / 3);
  12431. context.lineTo(this._currentMeasure.left + x + textWidth, y - this.fontSizeInPixels / 3);
  12432. context.stroke();
  12433. context.closePath();
  12434. }
  12435. };
  12436. /** @hidden */
  12437. TextBlock.prototype._draw = function (context, invalidatedRectangle) {
  12438. context.save();
  12439. this._applyStates(context);
  12440. // Render lines
  12441. this._renderLines(context);
  12442. context.restore();
  12443. };
  12444. TextBlock.prototype._applyStates = function (context) {
  12445. _super.prototype._applyStates.call(this, context);
  12446. if (this.outlineWidth) {
  12447. context.lineWidth = this.outlineWidth;
  12448. context.strokeStyle = this.outlineColor;
  12449. }
  12450. };
  12451. TextBlock.prototype._breakLines = function (refWidth, context) {
  12452. var lines = [];
  12453. var _lines = this.text.split("\n");
  12454. if (this._textWrapping === TextWrapping.Ellipsis) {
  12455. for (var _i = 0, _lines_1 = _lines; _i < _lines_1.length; _i++) {
  12456. var _line = _lines_1[_i];
  12457. lines.push(this._parseLineEllipsis(_line, refWidth, context));
  12458. }
  12459. }
  12460. else if (this._textWrapping === TextWrapping.WordWrap) {
  12461. for (var _a = 0, _lines_2 = _lines; _a < _lines_2.length; _a++) {
  12462. var _line = _lines_2[_a];
  12463. lines.push.apply(lines, this._parseLineWordWrap(_line, refWidth, context));
  12464. }
  12465. }
  12466. else {
  12467. for (var _b = 0, _lines_3 = _lines; _b < _lines_3.length; _b++) {
  12468. var _line = _lines_3[_b];
  12469. lines.push(this._parseLine(_line, context));
  12470. }
  12471. }
  12472. return lines;
  12473. };
  12474. TextBlock.prototype._parseLine = function (line, context) {
  12475. if (line === void 0) { line = ""; }
  12476. return { text: line, width: context.measureText(line).width };
  12477. };
  12478. TextBlock.prototype._parseLineEllipsis = function (line, width, context) {
  12479. if (line === void 0) { line = ""; }
  12480. var lineWidth = context.measureText(line).width;
  12481. if (lineWidth > width) {
  12482. line += "…";
  12483. }
  12484. // unicode support. split('') does not work with unicode!
  12485. // make sure Array.from is available
  12486. var characters = Array.from && Array.from(line);
  12487. if (!characters) {
  12488. // no array.from, use the old method
  12489. while (line.length > 2 && lineWidth > width) {
  12490. line = line.slice(0, -2) + "…";
  12491. lineWidth = context.measureText(line).width;
  12492. }
  12493. }
  12494. else {
  12495. while (characters.length && lineWidth > width) {
  12496. characters.pop();
  12497. line = characters.join("") + "...";
  12498. lineWidth = context.measureText(line).width;
  12499. }
  12500. }
  12501. return { text: line, width: lineWidth };
  12502. };
  12503. TextBlock.prototype._parseLineWordWrap = function (line, width, context) {
  12504. if (line === void 0) { line = ""; }
  12505. var lines = [];
  12506. var words = this.wordSplittingFunction ? this.wordSplittingFunction(line) : line.split(" ");
  12507. var lineWidth = 0;
  12508. for (var n = 0; n < words.length; n++) {
  12509. var testLine = n > 0 ? line + " " + words[n] : words[0];
  12510. var metrics = context.measureText(testLine);
  12511. var testWidth = metrics.width;
  12512. if (testWidth > width && n > 0) {
  12513. lines.push({ text: line, width: lineWidth });
  12514. line = words[n];
  12515. lineWidth = context.measureText(line).width;
  12516. }
  12517. else {
  12518. lineWidth = testWidth;
  12519. line = testLine;
  12520. }
  12521. }
  12522. lines.push({ text: line, width: lineWidth });
  12523. return lines;
  12524. };
  12525. TextBlock.prototype._renderLines = function (context) {
  12526. var height = this._currentMeasure.height;
  12527. var rootY = 0;
  12528. switch (this._textVerticalAlignment) {
  12529. case _control__WEBPACK_IMPORTED_MODULE_3__["Control"].VERTICAL_ALIGNMENT_TOP:
  12530. rootY = this._fontOffset.ascent;
  12531. break;
  12532. case _control__WEBPACK_IMPORTED_MODULE_3__["Control"].VERTICAL_ALIGNMENT_BOTTOM:
  12533. rootY = height - this._fontOffset.height * (this._lines.length - 1) - this._fontOffset.descent;
  12534. break;
  12535. case _control__WEBPACK_IMPORTED_MODULE_3__["Control"].VERTICAL_ALIGNMENT_CENTER:
  12536. rootY = this._fontOffset.ascent + (height - this._fontOffset.height * this._lines.length) / 2;
  12537. break;
  12538. }
  12539. rootY += this._currentMeasure.top;
  12540. for (var i = 0; i < this._lines.length; i++) {
  12541. var line = this._lines[i];
  12542. if (i !== 0 && this._lineSpacing.internalValue !== 0) {
  12543. if (this._lineSpacing.isPixel) {
  12544. rootY += this._lineSpacing.getValue(this._host);
  12545. }
  12546. else {
  12547. rootY = rootY + this._lineSpacing.getValue(this._host) * this._height.getValueInPixel(this._host, this._cachedParentMeasure.height);
  12548. }
  12549. }
  12550. this._drawText(line.text, line.width, rootY, context);
  12551. rootY += this._fontOffset.height;
  12552. }
  12553. };
  12554. /**
  12555. * Given a width constraint applied on the text block, find the expected height
  12556. * @returns expected height
  12557. */
  12558. TextBlock.prototype.computeExpectedHeight = function () {
  12559. if (this.text && this.widthInPixels) {
  12560. var context_1 = document.createElement("canvas").getContext("2d");
  12561. if (context_1) {
  12562. this._applyStates(context_1);
  12563. if (!this._fontOffset) {
  12564. this._fontOffset = _control__WEBPACK_IMPORTED_MODULE_3__["Control"]._GetFontOffset(context_1.font);
  12565. }
  12566. var lines = this._lines ? this._lines : this._breakLines(this.widthInPixels - this.paddingLeftInPixels - this.paddingRightInPixels, context_1);
  12567. var newHeight = this.paddingTopInPixels + this.paddingBottomInPixels + this._fontOffset.height * lines.length;
  12568. if (lines.length > 0 && this._lineSpacing.internalValue !== 0) {
  12569. var lineSpacing = 0;
  12570. if (this._lineSpacing.isPixel) {
  12571. lineSpacing = this._lineSpacing.getValue(this._host);
  12572. }
  12573. else {
  12574. lineSpacing = this._lineSpacing.getValue(this._host) * this._height.getValueInPixel(this._host, this._cachedParentMeasure.height);
  12575. }
  12576. newHeight += (lines.length - 1) * lineSpacing;
  12577. }
  12578. return newHeight;
  12579. }
  12580. }
  12581. return 0;
  12582. };
  12583. TextBlock.prototype.dispose = function () {
  12584. _super.prototype.dispose.call(this);
  12585. this.onTextChangedObservable.clear();
  12586. };
  12587. return TextBlock;
  12588. }(_control__WEBPACK_IMPORTED_MODULE_3__["Control"]));
  12589. babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredTypes["BABYLON.GUI.TextBlock"] = TextBlock;
  12590. /***/ }),
  12591. /***/ "./2D/controls/virtualKeyboard.ts":
  12592. /*!****************************************!*\
  12593. !*** ./2D/controls/virtualKeyboard.ts ***!
  12594. \****************************************/
  12595. /*! exports provided: KeyPropertySet, VirtualKeyboard */
  12596. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  12597. "use strict";
  12598. __webpack_require__.r(__webpack_exports__);
  12599. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "KeyPropertySet", function() { return KeyPropertySet; });
  12600. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "VirtualKeyboard", function() { return VirtualKeyboard; });
  12601. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  12602. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math.vector");
  12603. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
  12604. /* harmony import */ var _stackPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./stackPanel */ "./2D/controls/stackPanel.ts");
  12605. /* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./button */ "./2D/controls/button.ts");
  12606. /**
  12607. * Class used to store key control properties
  12608. */
  12609. var KeyPropertySet = /** @class */ (function () {
  12610. function KeyPropertySet() {
  12611. }
  12612. return KeyPropertySet;
  12613. }());
  12614. /**
  12615. * Class used to create virtual keyboard
  12616. */
  12617. var VirtualKeyboard = /** @class */ (function (_super) {
  12618. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(VirtualKeyboard, _super);
  12619. function VirtualKeyboard() {
  12620. var _this = _super !== null && _super.apply(this, arguments) || this;
  12621. /** Observable raised when a key is pressed */
  12622. _this.onKeyPressObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
  12623. /** Gets or sets default key button width */
  12624. _this.defaultButtonWidth = "40px";
  12625. /** Gets or sets default key button height */
  12626. _this.defaultButtonHeight = "40px";
  12627. /** Gets or sets default key button left padding */
  12628. _this.defaultButtonPaddingLeft = "2px";
  12629. /** Gets or sets default key button right padding */
  12630. _this.defaultButtonPaddingRight = "2px";
  12631. /** Gets or sets default key button top padding */
  12632. _this.defaultButtonPaddingTop = "2px";
  12633. /** Gets or sets default key button bottom padding */
  12634. _this.defaultButtonPaddingBottom = "2px";
  12635. /** Gets or sets default key button foreground color */
  12636. _this.defaultButtonColor = "#DDD";
  12637. /** Gets or sets default key button background color */
  12638. _this.defaultButtonBackground = "#070707";
  12639. /** Gets or sets shift button foreground color */
  12640. _this.shiftButtonColor = "#7799FF";
  12641. /** Gets or sets shift button thickness*/
  12642. _this.selectedShiftThickness = 1;
  12643. /** Gets shift key state */
  12644. _this.shiftState = 0;
  12645. _this._currentlyConnectedInputText = null;
  12646. _this._connectedInputTexts = [];
  12647. _this._onKeyPressObserver = null;
  12648. return _this;
  12649. }
  12650. VirtualKeyboard.prototype._getTypeName = function () {
  12651. return "VirtualKeyboard";
  12652. };
  12653. VirtualKeyboard.prototype._createKey = function (key, propertySet) {
  12654. var _this = this;
  12655. var button = _button__WEBPACK_IMPORTED_MODULE_3__["Button"].CreateSimpleButton(key, key);
  12656. button.width = propertySet && propertySet.width ? propertySet.width : this.defaultButtonWidth;
  12657. button.height = propertySet && propertySet.height ? propertySet.height : this.defaultButtonHeight;
  12658. button.color = propertySet && propertySet.color ? propertySet.color : this.defaultButtonColor;
  12659. button.background = propertySet && propertySet.background ? propertySet.background : this.defaultButtonBackground;
  12660. button.paddingLeft = propertySet && propertySet.paddingLeft ? propertySet.paddingLeft : this.defaultButtonPaddingLeft;
  12661. button.paddingRight = propertySet && propertySet.paddingRight ? propertySet.paddingRight : this.defaultButtonPaddingRight;
  12662. button.paddingTop = propertySet && propertySet.paddingTop ? propertySet.paddingTop : this.defaultButtonPaddingTop;
  12663. button.paddingBottom = propertySet && propertySet.paddingBottom ? propertySet.paddingBottom : this.defaultButtonPaddingBottom;
  12664. button.thickness = 0;
  12665. button.isFocusInvisible = true;
  12666. button.shadowColor = this.shadowColor;
  12667. button.shadowBlur = this.shadowBlur;
  12668. button.shadowOffsetX = this.shadowOffsetX;
  12669. button.shadowOffsetY = this.shadowOffsetY;
  12670. button.onPointerUpObservable.add(function () {
  12671. _this.onKeyPressObservable.notifyObservers(key);
  12672. });
  12673. return button;
  12674. };
  12675. /**
  12676. * Adds a new row of keys
  12677. * @param keys defines the list of keys to add
  12678. * @param propertySets defines the associated property sets
  12679. */
  12680. VirtualKeyboard.prototype.addKeysRow = function (keys, propertySets) {
  12681. var panel = new _stackPanel__WEBPACK_IMPORTED_MODULE_2__["StackPanel"]();
  12682. panel.isVertical = false;
  12683. panel.isFocusInvisible = true;
  12684. var maxKey = null;
  12685. for (var i = 0; i < keys.length; i++) {
  12686. var properties = null;
  12687. if (propertySets && propertySets.length === keys.length) {
  12688. properties = propertySets[i];
  12689. }
  12690. var key = this._createKey(keys[i], properties);
  12691. if (!maxKey || key.heightInPixels > maxKey.heightInPixels) {
  12692. maxKey = key;
  12693. }
  12694. panel.addControl(key);
  12695. }
  12696. panel.height = maxKey ? maxKey.height : this.defaultButtonHeight;
  12697. this.addControl(panel);
  12698. };
  12699. /**
  12700. * Set the shift key to a specific state
  12701. * @param shiftState defines the new shift state
  12702. */
  12703. VirtualKeyboard.prototype.applyShiftState = function (shiftState) {
  12704. if (!this.children) {
  12705. return;
  12706. }
  12707. for (var i = 0; i < this.children.length; i++) {
  12708. var row = this.children[i];
  12709. if (!row || !row.children) {
  12710. continue;
  12711. }
  12712. var rowContainer = row;
  12713. for (var j = 0; j < rowContainer.children.length; j++) {
  12714. var button = rowContainer.children[j];
  12715. if (!button || !button.children[0]) {
  12716. continue;
  12717. }
  12718. var button_tblock = button.children[0];
  12719. if (button_tblock.text === "\u21E7") {
  12720. button.color = (shiftState ? this.shiftButtonColor : this.defaultButtonColor);
  12721. button.thickness = (shiftState > 1 ? this.selectedShiftThickness : 0);
  12722. }
  12723. button_tblock.text = (shiftState > 0 ? button_tblock.text.toUpperCase() : button_tblock.text.toLowerCase());
  12724. }
  12725. }
  12726. };
  12727. Object.defineProperty(VirtualKeyboard.prototype, "connectedInputText", {
  12728. /** Gets the input text control currently attached to the keyboard */
  12729. get: function () {
  12730. return this._currentlyConnectedInputText;
  12731. },
  12732. enumerable: false,
  12733. configurable: true
  12734. });
  12735. /**
  12736. * Connects the keyboard with an input text control
  12737. *
  12738. * @param input defines the target control
  12739. */
  12740. VirtualKeyboard.prototype.connect = function (input) {
  12741. var _this = this;
  12742. var inputTextAlreadyConnected = this._connectedInputTexts.some(function (a) { return a.input === input; });
  12743. if (inputTextAlreadyConnected) {
  12744. return;
  12745. }
  12746. if (this._onKeyPressObserver === null) {
  12747. this._onKeyPressObserver = this.onKeyPressObservable.add(function (key) {
  12748. if (!_this._currentlyConnectedInputText) {
  12749. return;
  12750. }
  12751. _this._currentlyConnectedInputText._host.focusedControl = _this._currentlyConnectedInputText;
  12752. switch (key) {
  12753. case "\u21E7":
  12754. _this.shiftState++;
  12755. if (_this.shiftState > 2) {
  12756. _this.shiftState = 0;
  12757. }
  12758. _this.applyShiftState(_this.shiftState);
  12759. return;
  12760. case "\u2190":
  12761. _this._currentlyConnectedInputText.processKey(8);
  12762. return;
  12763. case "\u21B5":
  12764. _this._currentlyConnectedInputText.processKey(13);
  12765. return;
  12766. }
  12767. _this._currentlyConnectedInputText.processKey(-1, (_this.shiftState ? key.toUpperCase() : key));
  12768. if (_this.shiftState === 1) {
  12769. _this.shiftState = 0;
  12770. _this.applyShiftState(_this.shiftState);
  12771. }
  12772. });
  12773. }
  12774. this.isVisible = false;
  12775. this._currentlyConnectedInputText = input;
  12776. input._connectedVirtualKeyboard = this;
  12777. // Events hooking
  12778. var onFocusObserver = input.onFocusObservable.add(function () {
  12779. _this._currentlyConnectedInputText = input;
  12780. input._connectedVirtualKeyboard = _this;
  12781. _this.isVisible = true;
  12782. });
  12783. var onBlurObserver = input.onBlurObservable.add(function () {
  12784. input._connectedVirtualKeyboard = null;
  12785. _this._currentlyConnectedInputText = null;
  12786. _this.isVisible = false;
  12787. });
  12788. this._connectedInputTexts.push({
  12789. input: input,
  12790. onBlurObserver: onBlurObserver,
  12791. onFocusObserver: onFocusObserver
  12792. });
  12793. };
  12794. /**
  12795. * Disconnects the keyboard from connected InputText controls
  12796. *
  12797. * @param input optionally defines a target control, otherwise all are disconnected
  12798. */
  12799. VirtualKeyboard.prototype.disconnect = function (input) {
  12800. var _this = this;
  12801. if (input) {
  12802. // .find not available on IE
  12803. var filtered = this._connectedInputTexts.filter(function (a) { return a.input === input; });
  12804. if (filtered.length === 1) {
  12805. this._removeConnectedInputObservables(filtered[0]);
  12806. this._connectedInputTexts = this._connectedInputTexts.filter(function (a) { return a.input !== input; });
  12807. if (this._currentlyConnectedInputText === input) {
  12808. this._currentlyConnectedInputText = null;
  12809. }
  12810. }
  12811. }
  12812. else {
  12813. this._connectedInputTexts.forEach(function (connectedInputText) {
  12814. _this._removeConnectedInputObservables(connectedInputText);
  12815. });
  12816. this._connectedInputTexts = [];
  12817. }
  12818. if (this._connectedInputTexts.length === 0) {
  12819. this._currentlyConnectedInputText = null;
  12820. this.onKeyPressObservable.remove(this._onKeyPressObserver);
  12821. this._onKeyPressObserver = null;
  12822. }
  12823. };
  12824. VirtualKeyboard.prototype._removeConnectedInputObservables = function (connectedInputText) {
  12825. connectedInputText.input._connectedVirtualKeyboard = null;
  12826. connectedInputText.input.onFocusObservable.remove(connectedInputText.onFocusObserver);
  12827. connectedInputText.input.onBlurObservable.remove(connectedInputText.onBlurObserver);
  12828. };
  12829. /**
  12830. * Release all resources
  12831. */
  12832. VirtualKeyboard.prototype.dispose = function () {
  12833. _super.prototype.dispose.call(this);
  12834. this.disconnect();
  12835. };
  12836. // Statics
  12837. /**
  12838. * Creates a new keyboard using a default layout
  12839. *
  12840. * @param name defines control name
  12841. * @returns a new VirtualKeyboard
  12842. */
  12843. VirtualKeyboard.CreateDefaultLayout = function (name) {
  12844. var returnValue = new VirtualKeyboard(name);
  12845. returnValue.addKeysRow(["1", "2", "3", "4", "5", "6", "7", "8", "9", "0", "\u2190"]);
  12846. returnValue.addKeysRow(["q", "w", "e", "r", "t", "y", "u", "i", "o", "p"]);
  12847. returnValue.addKeysRow(["a", "s", "d", "f", "g", "h", "j", "k", "l", ";", "'", "\u21B5"]);
  12848. returnValue.addKeysRow(["\u21E7", "z", "x", "c", "v", "b", "n", "m", ",", ".", "/"]);
  12849. returnValue.addKeysRow([" "], [{ width: "200px" }]);
  12850. return returnValue;
  12851. };
  12852. return VirtualKeyboard;
  12853. }(_stackPanel__WEBPACK_IMPORTED_MODULE_2__["StackPanel"]));
  12854. babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredTypes["BABYLON.GUI.VirtualKeyboard"] = VirtualKeyboard;
  12855. /***/ }),
  12856. /***/ "./2D/index.ts":
  12857. /*!*********************!*\
  12858. !*** ./2D/index.ts ***!
  12859. \*********************/
  12860. /*! exports provided: Button, Checkbox, ColorPicker, Container, Control, Ellipse, Grid, Image, InputText, InputPassword, Line, MultiLine, RadioButton, StackPanel, SelectorGroup, CheckboxGroup, RadioGroup, SliderGroup, SelectionPanel, ScrollViewer, TextWrapping, TextBlock, KeyPropertySet, VirtualKeyboard, Rectangle, DisplayGrid, BaseSlider, Slider, ImageBasedSlider, ScrollBar, ImageScrollBar, name, AdvancedDynamicTexture, AdvancedDynamicTextureInstrumentation, Vector2WithInfo, Matrix2D, Measure, MultiLinePoint, Style, ValueAndUnit, XmlLoader */
  12861. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  12862. "use strict";
  12863. __webpack_require__.r(__webpack_exports__);
  12864. /* harmony import */ var _controls__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./controls */ "./2D/controls/index.ts");
  12865. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Button", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["Button"]; });
  12866. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Checkbox", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["Checkbox"]; });
  12867. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ColorPicker", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["ColorPicker"]; });
  12868. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Container", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["Container"]; });
  12869. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Control", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["Control"]; });
  12870. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Ellipse", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["Ellipse"]; });
  12871. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Grid", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["Grid"]; });
  12872. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Image", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["Image"]; });
  12873. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "InputText", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["InputText"]; });
  12874. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "InputPassword", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["InputPassword"]; });
  12875. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Line", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["Line"]; });
  12876. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MultiLine", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["MultiLine"]; });
  12877. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "RadioButton", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["RadioButton"]; });
  12878. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "StackPanel", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["StackPanel"]; });
  12879. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SelectorGroup", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["SelectorGroup"]; });
  12880. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "CheckboxGroup", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["CheckboxGroup"]; });
  12881. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "RadioGroup", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["RadioGroup"]; });
  12882. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SliderGroup", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["SliderGroup"]; });
  12883. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SelectionPanel", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["SelectionPanel"]; });
  12884. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ScrollViewer", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["ScrollViewer"]; });
  12885. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "TextWrapping", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["TextWrapping"]; });
  12886. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "TextBlock", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["TextBlock"]; });
  12887. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "KeyPropertySet", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["KeyPropertySet"]; });
  12888. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "VirtualKeyboard", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["VirtualKeyboard"]; });
  12889. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Rectangle", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["Rectangle"]; });
  12890. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DisplayGrid", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["DisplayGrid"]; });
  12891. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "BaseSlider", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["BaseSlider"]; });
  12892. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Slider", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["Slider"]; });
  12893. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ImageBasedSlider", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["ImageBasedSlider"]; });
  12894. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ScrollBar", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["ScrollBar"]; });
  12895. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ImageScrollBar", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["ImageScrollBar"]; });
  12896. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "name", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["name"]; });
  12897. /* harmony import */ var _advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./advancedDynamicTexture */ "./2D/advancedDynamicTexture.ts");
  12898. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AdvancedDynamicTexture", function() { return _advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_1__["AdvancedDynamicTexture"]; });
  12899. /* harmony import */ var _adtInstrumentation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./adtInstrumentation */ "./2D/adtInstrumentation.ts");
  12900. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AdvancedDynamicTextureInstrumentation", function() { return _adtInstrumentation__WEBPACK_IMPORTED_MODULE_2__["AdvancedDynamicTextureInstrumentation"]; });
  12901. /* harmony import */ var _math2D__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./math2D */ "./2D/math2D.ts");
  12902. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Vector2WithInfo", function() { return _math2D__WEBPACK_IMPORTED_MODULE_3__["Vector2WithInfo"]; });
  12903. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Matrix2D", function() { return _math2D__WEBPACK_IMPORTED_MODULE_3__["Matrix2D"]; });
  12904. /* harmony import */ var _measure__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./measure */ "./2D/measure.ts");
  12905. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Measure", function() { return _measure__WEBPACK_IMPORTED_MODULE_4__["Measure"]; });
  12906. /* harmony import */ var _multiLinePoint__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./multiLinePoint */ "./2D/multiLinePoint.ts");
  12907. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MultiLinePoint", function() { return _multiLinePoint__WEBPACK_IMPORTED_MODULE_5__["MultiLinePoint"]; });
  12908. /* harmony import */ var _style__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./style */ "./2D/style.ts");
  12909. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Style", function() { return _style__WEBPACK_IMPORTED_MODULE_6__["Style"]; });
  12910. /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./valueAndUnit */ "./2D/valueAndUnit.ts");
  12911. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ValueAndUnit", function() { return _valueAndUnit__WEBPACK_IMPORTED_MODULE_7__["ValueAndUnit"]; });
  12912. /* harmony import */ var _xmlLoader__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./xmlLoader */ "./2D/xmlLoader.ts");
  12913. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "XmlLoader", function() { return _xmlLoader__WEBPACK_IMPORTED_MODULE_8__["XmlLoader"]; });
  12914. /***/ }),
  12915. /***/ "./2D/math2D.ts":
  12916. /*!**********************!*\
  12917. !*** ./2D/math2D.ts ***!
  12918. \**********************/
  12919. /*! exports provided: Vector2WithInfo, Matrix2D */
  12920. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  12921. "use strict";
  12922. __webpack_require__.r(__webpack_exports__);
  12923. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Vector2WithInfo", function() { return Vector2WithInfo; });
  12924. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Matrix2D", function() { return Matrix2D; });
  12925. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  12926. /* harmony import */ var babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math.vector */ "babylonjs/Maths/math.vector");
  12927. /* harmony import */ var babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__);
  12928. /**
  12929. * Class used to transport Vector2 information for pointer events
  12930. */
  12931. var Vector2WithInfo = /** @class */ (function (_super) {
  12932. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(Vector2WithInfo, _super);
  12933. /**
  12934. * Creates a new Vector2WithInfo
  12935. * @param source defines the vector2 data to transport
  12936. * @param buttonIndex defines the current mouse button index
  12937. */
  12938. function Vector2WithInfo(source,
  12939. /** defines the current mouse button index */
  12940. buttonIndex) {
  12941. if (buttonIndex === void 0) { buttonIndex = 0; }
  12942. var _this = _super.call(this, source.x, source.y) || this;
  12943. _this.buttonIndex = buttonIndex;
  12944. return _this;
  12945. }
  12946. return Vector2WithInfo;
  12947. }(babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["Vector2"]));
  12948. /** Class used to provide 2D matrix features */
  12949. var Matrix2D = /** @class */ (function () {
  12950. /**
  12951. * Creates a new matrix
  12952. * @param m00 defines value for (0, 0)
  12953. * @param m01 defines value for (0, 1)
  12954. * @param m10 defines value for (1, 0)
  12955. * @param m11 defines value for (1, 1)
  12956. * @param m20 defines value for (2, 0)
  12957. * @param m21 defines value for (2, 1)
  12958. */
  12959. function Matrix2D(m00, m01, m10, m11, m20, m21) {
  12960. /** Gets the internal array of 6 floats used to store matrix data */
  12961. this.m = new Float32Array(6);
  12962. this.fromValues(m00, m01, m10, m11, m20, m21);
  12963. }
  12964. /**
  12965. * Fills the matrix from direct values
  12966. * @param m00 defines value for (0, 0)
  12967. * @param m01 defines value for (0, 1)
  12968. * @param m10 defines value for (1, 0)
  12969. * @param m11 defines value for (1, 1)
  12970. * @param m20 defines value for (2, 0)
  12971. * @param m21 defines value for (2, 1)
  12972. * @returns the current modified matrix
  12973. */
  12974. Matrix2D.prototype.fromValues = function (m00, m01, m10, m11, m20, m21) {
  12975. this.m[0] = m00;
  12976. this.m[1] = m01;
  12977. this.m[2] = m10;
  12978. this.m[3] = m11;
  12979. this.m[4] = m20;
  12980. this.m[5] = m21;
  12981. return this;
  12982. };
  12983. /**
  12984. * Gets matrix determinant
  12985. * @returns the determinant
  12986. */
  12987. Matrix2D.prototype.determinant = function () {
  12988. return this.m[0] * this.m[3] - this.m[1] * this.m[2];
  12989. };
  12990. /**
  12991. * Inverses the matrix and stores it in a target matrix
  12992. * @param result defines the target matrix
  12993. * @returns the current matrix
  12994. */
  12995. Matrix2D.prototype.invertToRef = function (result) {
  12996. var l0 = this.m[0];
  12997. var l1 = this.m[1];
  12998. var l2 = this.m[2];
  12999. var l3 = this.m[3];
  13000. var l4 = this.m[4];
  13001. var l5 = this.m[5];
  13002. var det = this.determinant();
  13003. if (det < (babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["Epsilon"] * babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["Epsilon"])) {
  13004. result.m[0] = 0;
  13005. result.m[1] = 0;
  13006. result.m[2] = 0;
  13007. result.m[3] = 0;
  13008. result.m[4] = 0;
  13009. result.m[5] = 0;
  13010. return this;
  13011. }
  13012. var detDiv = 1 / det;
  13013. var det4 = l2 * l5 - l3 * l4;
  13014. var det5 = l1 * l4 - l0 * l5;
  13015. result.m[0] = l3 * detDiv;
  13016. result.m[1] = -l1 * detDiv;
  13017. result.m[2] = -l2 * detDiv;
  13018. result.m[3] = l0 * detDiv;
  13019. result.m[4] = det4 * detDiv;
  13020. result.m[5] = det5 * detDiv;
  13021. return this;
  13022. };
  13023. /**
  13024. * Multiplies the current matrix with another one
  13025. * @param other defines the second operand
  13026. * @param result defines the target matrix
  13027. * @returns the current matrix
  13028. */
  13029. Matrix2D.prototype.multiplyToRef = function (other, result) {
  13030. var l0 = this.m[0];
  13031. var l1 = this.m[1];
  13032. var l2 = this.m[2];
  13033. var l3 = this.m[3];
  13034. var l4 = this.m[4];
  13035. var l5 = this.m[5];
  13036. var r0 = other.m[0];
  13037. var r1 = other.m[1];
  13038. var r2 = other.m[2];
  13039. var r3 = other.m[3];
  13040. var r4 = other.m[4];
  13041. var r5 = other.m[5];
  13042. result.m[0] = l0 * r0 + l1 * r2;
  13043. result.m[1] = l0 * r1 + l1 * r3;
  13044. result.m[2] = l2 * r0 + l3 * r2;
  13045. result.m[3] = l2 * r1 + l3 * r3;
  13046. result.m[4] = l4 * r0 + l5 * r2 + r4;
  13047. result.m[5] = l4 * r1 + l5 * r3 + r5;
  13048. return this;
  13049. };
  13050. /**
  13051. * Applies the current matrix to a set of 2 floats and stores the result in a vector2
  13052. * @param x defines the x coordinate to transform
  13053. * @param y defines the x coordinate to transform
  13054. * @param result defines the target vector2
  13055. * @returns the current matrix
  13056. */
  13057. Matrix2D.prototype.transformCoordinates = function (x, y, result) {
  13058. result.x = x * this.m[0] + y * this.m[2] + this.m[4];
  13059. result.y = x * this.m[1] + y * this.m[3] + this.m[5];
  13060. return this;
  13061. };
  13062. // Statics
  13063. /**
  13064. * Creates an identity matrix
  13065. * @returns a new matrix
  13066. */
  13067. Matrix2D.Identity = function () {
  13068. return new Matrix2D(1, 0, 0, 1, 0, 0);
  13069. };
  13070. /**
  13071. * Creates a translation matrix and stores it in a target matrix
  13072. * @param x defines the x coordinate of the translation
  13073. * @param y defines the y coordinate of the translation
  13074. * @param result defines the target matrix
  13075. */
  13076. Matrix2D.TranslationToRef = function (x, y, result) {
  13077. result.fromValues(1, 0, 0, 1, x, y);
  13078. };
  13079. /**
  13080. * Creates a scaling matrix and stores it in a target matrix
  13081. * @param x defines the x coordinate of the scaling
  13082. * @param y defines the y coordinate of the scaling
  13083. * @param result defines the target matrix
  13084. */
  13085. Matrix2D.ScalingToRef = function (x, y, result) {
  13086. result.fromValues(x, 0, 0, y, 0, 0);
  13087. };
  13088. /**
  13089. * Creates a rotation matrix and stores it in a target matrix
  13090. * @param angle defines the rotation angle
  13091. * @param result defines the target matrix
  13092. */
  13093. Matrix2D.RotationToRef = function (angle, result) {
  13094. var s = Math.sin(angle);
  13095. var c = Math.cos(angle);
  13096. result.fromValues(c, s, -s, c, 0, 0);
  13097. };
  13098. /**
  13099. * Composes a matrix from translation, rotation, scaling and parent matrix and stores it in a target matrix
  13100. * @param tx defines the x coordinate of the translation
  13101. * @param ty defines the y coordinate of the translation
  13102. * @param angle defines the rotation angle
  13103. * @param scaleX defines the x coordinate of the scaling
  13104. * @param scaleY defines the y coordinate of the scaling
  13105. * @param parentMatrix defines the parent matrix to multiply by (can be null)
  13106. * @param result defines the target matrix
  13107. */
  13108. Matrix2D.ComposeToRef = function (tx, ty, angle, scaleX, scaleY, parentMatrix, result) {
  13109. Matrix2D.TranslationToRef(tx, ty, Matrix2D._TempPreTranslationMatrix);
  13110. Matrix2D.ScalingToRef(scaleX, scaleY, Matrix2D._TempScalingMatrix);
  13111. Matrix2D.RotationToRef(angle, Matrix2D._TempRotationMatrix);
  13112. Matrix2D.TranslationToRef(-tx, -ty, Matrix2D._TempPostTranslationMatrix);
  13113. Matrix2D._TempPreTranslationMatrix.multiplyToRef(Matrix2D._TempScalingMatrix, Matrix2D._TempCompose0);
  13114. Matrix2D._TempCompose0.multiplyToRef(Matrix2D._TempRotationMatrix, Matrix2D._TempCompose1);
  13115. if (parentMatrix) {
  13116. Matrix2D._TempCompose1.multiplyToRef(Matrix2D._TempPostTranslationMatrix, Matrix2D._TempCompose2);
  13117. Matrix2D._TempCompose2.multiplyToRef(parentMatrix, result);
  13118. }
  13119. else {
  13120. Matrix2D._TempCompose1.multiplyToRef(Matrix2D._TempPostTranslationMatrix, result);
  13121. }
  13122. };
  13123. Matrix2D._TempPreTranslationMatrix = Matrix2D.Identity();
  13124. Matrix2D._TempPostTranslationMatrix = Matrix2D.Identity();
  13125. Matrix2D._TempRotationMatrix = Matrix2D.Identity();
  13126. Matrix2D._TempScalingMatrix = Matrix2D.Identity();
  13127. Matrix2D._TempCompose0 = Matrix2D.Identity();
  13128. Matrix2D._TempCompose1 = Matrix2D.Identity();
  13129. Matrix2D._TempCompose2 = Matrix2D.Identity();
  13130. return Matrix2D;
  13131. }());
  13132. /***/ }),
  13133. /***/ "./2D/measure.ts":
  13134. /*!***********************!*\
  13135. !*** ./2D/measure.ts ***!
  13136. \***********************/
  13137. /*! exports provided: Measure */
  13138. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  13139. "use strict";
  13140. __webpack_require__.r(__webpack_exports__);
  13141. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Measure", function() { return Measure; });
  13142. /* harmony import */ var babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Maths/math.vector */ "babylonjs/Maths/math.vector");
  13143. /* harmony import */ var babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__);
  13144. var tmpRect = [
  13145. new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__["Vector2"](0, 0),
  13146. new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__["Vector2"](0, 0),
  13147. new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__["Vector2"](0, 0),
  13148. new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__["Vector2"](0, 0),
  13149. ];
  13150. var tmpRect2 = [
  13151. new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__["Vector2"](0, 0),
  13152. new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__["Vector2"](0, 0),
  13153. new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__["Vector2"](0, 0),
  13154. new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__["Vector2"](0, 0),
  13155. ];
  13156. var tmpV1 = new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__["Vector2"](0, 0);
  13157. var tmpV2 = new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__["Vector2"](0, 0);
  13158. /**
  13159. * Class used to store 2D control sizes
  13160. */
  13161. var Measure = /** @class */ (function () {
  13162. /**
  13163. * Creates a new measure
  13164. * @param left defines left coordinate
  13165. * @param top defines top coordinate
  13166. * @param width defines width dimension
  13167. * @param height defines height dimension
  13168. */
  13169. function Measure(
  13170. /** defines left coordinate */
  13171. left,
  13172. /** defines top coordinate */
  13173. top,
  13174. /** defines width dimension */
  13175. width,
  13176. /** defines height dimension */
  13177. height) {
  13178. this.left = left;
  13179. this.top = top;
  13180. this.width = width;
  13181. this.height = height;
  13182. }
  13183. /**
  13184. * Copy from another measure
  13185. * @param other defines the other measure to copy from
  13186. */
  13187. Measure.prototype.copyFrom = function (other) {
  13188. this.left = other.left;
  13189. this.top = other.top;
  13190. this.width = other.width;
  13191. this.height = other.height;
  13192. };
  13193. /**
  13194. * Copy from a group of 4 floats
  13195. * @param left defines left coordinate
  13196. * @param top defines top coordinate
  13197. * @param width defines width dimension
  13198. * @param height defines height dimension
  13199. */
  13200. Measure.prototype.copyFromFloats = function (left, top, width, height) {
  13201. this.left = left;
  13202. this.top = top;
  13203. this.width = width;
  13204. this.height = height;
  13205. };
  13206. /**
  13207. * Computes the axis aligned bounding box measure for two given measures
  13208. * @param a Input measure
  13209. * @param b Input measure
  13210. * @param result the resulting bounding measure
  13211. */
  13212. Measure.CombineToRef = function (a, b, result) {
  13213. var left = Math.min(a.left, b.left);
  13214. var top = Math.min(a.top, b.top);
  13215. var right = Math.max(a.left + a.width, b.left + b.width);
  13216. var bottom = Math.max(a.top + a.height, b.top + b.height);
  13217. result.left = left;
  13218. result.top = top;
  13219. result.width = right - left;
  13220. result.height = bottom - top;
  13221. };
  13222. /**
  13223. * Computes the axis aligned bounding box of the measure after it is modified by a given transform
  13224. * @param transform the matrix to transform the measure before computing the AABB
  13225. * @param addX number to add to left
  13226. * @param addY number to add to top
  13227. * @param addWidth number to add to width
  13228. * @param addHeight number to add to height
  13229. * @param result the resulting AABB
  13230. */
  13231. Measure.prototype.addAndTransformToRef = function (transform, addX, addY, addWidth, addHeight, result) {
  13232. var left = this.left + addX;
  13233. var top = this.top + addY;
  13234. var width = this.width + addWidth;
  13235. var height = this.height + addHeight;
  13236. tmpRect[0].copyFromFloats(left, top);
  13237. tmpRect[1].copyFromFloats(left + width, top);
  13238. tmpRect[2].copyFromFloats(left + width, top + height);
  13239. tmpRect[3].copyFromFloats(left, top + height);
  13240. tmpV1.copyFromFloats(Number.MAX_VALUE, Number.MAX_VALUE);
  13241. tmpV2.copyFromFloats(0, 0);
  13242. for (var i = 0; i < 4; i++) {
  13243. transform.transformCoordinates(tmpRect[i].x, tmpRect[i].y, tmpRect2[i]);
  13244. tmpV1.x = Math.floor(Math.min(tmpV1.x, tmpRect2[i].x));
  13245. tmpV1.y = Math.floor(Math.min(tmpV1.y, tmpRect2[i].y));
  13246. tmpV2.x = Math.ceil(Math.max(tmpV2.x, tmpRect2[i].x));
  13247. tmpV2.y = Math.ceil(Math.max(tmpV2.y, tmpRect2[i].y));
  13248. }
  13249. result.left = tmpV1.x;
  13250. result.top = tmpV1.y;
  13251. result.width = tmpV2.x - tmpV1.x;
  13252. result.height = tmpV2.y - tmpV1.y;
  13253. };
  13254. /**
  13255. * Computes the axis aligned bounding box of the measure after it is modified by a given transform
  13256. * @param transform the matrix to transform the measure before computing the AABB
  13257. * @param result the resulting AABB
  13258. */
  13259. Measure.prototype.transformToRef = function (transform, result) {
  13260. this.addAndTransformToRef(transform, 0, 0, 0, 0, result);
  13261. };
  13262. /**
  13263. * Check equality between this measure and another one
  13264. * @param other defines the other measures
  13265. * @returns true if both measures are equals
  13266. */
  13267. Measure.prototype.isEqualsTo = function (other) {
  13268. if (this.left !== other.left) {
  13269. return false;
  13270. }
  13271. if (this.top !== other.top) {
  13272. return false;
  13273. }
  13274. if (this.width !== other.width) {
  13275. return false;
  13276. }
  13277. if (this.height !== other.height) {
  13278. return false;
  13279. }
  13280. return true;
  13281. };
  13282. /**
  13283. * Creates an empty measure
  13284. * @returns a new measure
  13285. */
  13286. Measure.Empty = function () {
  13287. return new Measure(0, 0, 0, 0);
  13288. };
  13289. return Measure;
  13290. }());
  13291. /***/ }),
  13292. /***/ "./2D/multiLinePoint.ts":
  13293. /*!******************************!*\
  13294. !*** ./2D/multiLinePoint.ts ***!
  13295. \******************************/
  13296. /*! exports provided: MultiLinePoint */
  13297. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  13298. "use strict";
  13299. __webpack_require__.r(__webpack_exports__);
  13300. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MultiLinePoint", function() { return MultiLinePoint; });
  13301. /* harmony import */ var babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Maths/math.vector */ "babylonjs/Maths/math.vector");
  13302. /* harmony import */ var babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__);
  13303. /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./valueAndUnit */ "./2D/valueAndUnit.ts");
  13304. /**
  13305. * Class used to store a point for a MultiLine object.
  13306. * The point can be pure 2D coordinates, a mesh or a control
  13307. */
  13308. var MultiLinePoint = /** @class */ (function () {
  13309. /**
  13310. * Creates a new MultiLinePoint
  13311. * @param multiLine defines the source MultiLine object
  13312. */
  13313. function MultiLinePoint(multiLine) {
  13314. this._multiLine = multiLine;
  13315. this._x = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"](0);
  13316. this._y = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"](0);
  13317. this._point = new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__["Vector2"](0, 0);
  13318. }
  13319. Object.defineProperty(MultiLinePoint.prototype, "x", {
  13320. /** Gets or sets x coordinate */
  13321. get: function () {
  13322. return this._x.toString(this._multiLine._host);
  13323. },
  13324. set: function (value) {
  13325. if (this._x.toString(this._multiLine._host) === value) {
  13326. return;
  13327. }
  13328. if (this._x.fromString(value)) {
  13329. this._multiLine._markAsDirty();
  13330. }
  13331. },
  13332. enumerable: false,
  13333. configurable: true
  13334. });
  13335. Object.defineProperty(MultiLinePoint.prototype, "y", {
  13336. /** Gets or sets y coordinate */
  13337. get: function () {
  13338. return this._y.toString(this._multiLine._host);
  13339. },
  13340. set: function (value) {
  13341. if (this._y.toString(this._multiLine._host) === value) {
  13342. return;
  13343. }
  13344. if (this._y.fromString(value)) {
  13345. this._multiLine._markAsDirty();
  13346. }
  13347. },
  13348. enumerable: false,
  13349. configurable: true
  13350. });
  13351. Object.defineProperty(MultiLinePoint.prototype, "control", {
  13352. /** Gets or sets the control associated with this point */
  13353. get: function () {
  13354. return this._control;
  13355. },
  13356. set: function (value) {
  13357. if (this._control === value) {
  13358. return;
  13359. }
  13360. if (this._control && this._controlObserver) {
  13361. this._control.onDirtyObservable.remove(this._controlObserver);
  13362. this._controlObserver = null;
  13363. }
  13364. this._control = value;
  13365. if (this._control) {
  13366. this._controlObserver = this._control.onDirtyObservable.add(this._multiLine.onPointUpdate);
  13367. }
  13368. this._multiLine._markAsDirty();
  13369. },
  13370. enumerable: false,
  13371. configurable: true
  13372. });
  13373. Object.defineProperty(MultiLinePoint.prototype, "mesh", {
  13374. /** Gets or sets the mesh associated with this point */
  13375. get: function () {
  13376. return this._mesh;
  13377. },
  13378. set: function (value) {
  13379. if (this._mesh === value) {
  13380. return;
  13381. }
  13382. if (this._mesh && this._meshObserver) {
  13383. this._mesh.getScene().onAfterCameraRenderObservable.remove(this._meshObserver);
  13384. }
  13385. this._mesh = value;
  13386. if (this._mesh) {
  13387. this._meshObserver = this._mesh.getScene().onAfterCameraRenderObservable.add(this._multiLine.onPointUpdate);
  13388. }
  13389. this._multiLine._markAsDirty();
  13390. },
  13391. enumerable: false,
  13392. configurable: true
  13393. });
  13394. /** Resets links */
  13395. MultiLinePoint.prototype.resetLinks = function () {
  13396. this.control = null;
  13397. this.mesh = null;
  13398. };
  13399. /**
  13400. * Gets a translation vector
  13401. * @returns the translation vector
  13402. */
  13403. MultiLinePoint.prototype.translate = function () {
  13404. this._point = this._translatePoint();
  13405. return this._point;
  13406. };
  13407. MultiLinePoint.prototype._translatePoint = function () {
  13408. if (this._mesh != null) {
  13409. return this._multiLine._host.getProjectedPosition(this._mesh.getBoundingInfo().boundingSphere.center, this._mesh.getWorldMatrix());
  13410. }
  13411. else if (this._control != null) {
  13412. return new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__["Vector2"](this._control.centerX, this._control.centerY);
  13413. }
  13414. else {
  13415. var host = this._multiLine._host;
  13416. var xValue = this._x.getValueInPixel(host, Number(host._canvas.width));
  13417. var yValue = this._y.getValueInPixel(host, Number(host._canvas.height));
  13418. return new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_0__["Vector2"](xValue, yValue);
  13419. }
  13420. };
  13421. /** Release associated resources */
  13422. MultiLinePoint.prototype.dispose = function () {
  13423. this.resetLinks();
  13424. };
  13425. return MultiLinePoint;
  13426. }());
  13427. /***/ }),
  13428. /***/ "./2D/style.ts":
  13429. /*!*********************!*\
  13430. !*** ./2D/style.ts ***!
  13431. \*********************/
  13432. /*! exports provided: Style */
  13433. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  13434. "use strict";
  13435. __webpack_require__.r(__webpack_exports__);
  13436. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Style", function() { return Style; });
  13437. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math.vector");
  13438. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
  13439. /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./valueAndUnit */ "./2D/valueAndUnit.ts");
  13440. /**
  13441. * Define a style used by control to automatically setup properties based on a template.
  13442. * Only support font related properties so far
  13443. */
  13444. var Style = /** @class */ (function () {
  13445. /**
  13446. * Creates a new style object
  13447. * @param host defines the AdvancedDynamicTexture which hosts this style
  13448. */
  13449. function Style(host) {
  13450. this._fontFamily = "Arial";
  13451. this._fontStyle = "";
  13452. this._fontWeight = "";
  13453. /** @hidden */
  13454. this._fontSize = new _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"](18, _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__["ValueAndUnit"].UNITMODE_PIXEL, false);
  13455. /**
  13456. * Observable raised when the style values are changed
  13457. */
  13458. this.onChangedObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  13459. this._host = host;
  13460. }
  13461. Object.defineProperty(Style.prototype, "fontSize", {
  13462. /**
  13463. * Gets or sets the font size
  13464. */
  13465. get: function () {
  13466. return this._fontSize.toString(this._host);
  13467. },
  13468. set: function (value) {
  13469. if (this._fontSize.toString(this._host) === value) {
  13470. return;
  13471. }
  13472. if (this._fontSize.fromString(value)) {
  13473. this.onChangedObservable.notifyObservers(this);
  13474. }
  13475. },
  13476. enumerable: false,
  13477. configurable: true
  13478. });
  13479. Object.defineProperty(Style.prototype, "fontFamily", {
  13480. /**
  13481. * Gets or sets the font family
  13482. */
  13483. get: function () {
  13484. return this._fontFamily;
  13485. },
  13486. set: function (value) {
  13487. if (this._fontFamily === value) {
  13488. return;
  13489. }
  13490. this._fontFamily = value;
  13491. this.onChangedObservable.notifyObservers(this);
  13492. },
  13493. enumerable: false,
  13494. configurable: true
  13495. });
  13496. Object.defineProperty(Style.prototype, "fontStyle", {
  13497. /**
  13498. * Gets or sets the font style
  13499. */
  13500. get: function () {
  13501. return this._fontStyle;
  13502. },
  13503. set: function (value) {
  13504. if (this._fontStyle === value) {
  13505. return;
  13506. }
  13507. this._fontStyle = value;
  13508. this.onChangedObservable.notifyObservers(this);
  13509. },
  13510. enumerable: false,
  13511. configurable: true
  13512. });
  13513. Object.defineProperty(Style.prototype, "fontWeight", {
  13514. /** Gets or sets font weight */
  13515. get: function () {
  13516. return this._fontWeight;
  13517. },
  13518. set: function (value) {
  13519. if (this._fontWeight === value) {
  13520. return;
  13521. }
  13522. this._fontWeight = value;
  13523. this.onChangedObservable.notifyObservers(this);
  13524. },
  13525. enumerable: false,
  13526. configurable: true
  13527. });
  13528. /** Dispose all associated resources */
  13529. Style.prototype.dispose = function () {
  13530. this.onChangedObservable.clear();
  13531. };
  13532. return Style;
  13533. }());
  13534. /***/ }),
  13535. /***/ "./2D/valueAndUnit.ts":
  13536. /*!****************************!*\
  13537. !*** ./2D/valueAndUnit.ts ***!
  13538. \****************************/
  13539. /*! exports provided: ValueAndUnit */
  13540. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  13541. "use strict";
  13542. __webpack_require__.r(__webpack_exports__);
  13543. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ValueAndUnit", function() { return ValueAndUnit; });
  13544. /**
  13545. * Class used to specific a value and its associated unit
  13546. */
  13547. var ValueAndUnit = /** @class */ (function () {
  13548. /**
  13549. * Creates a new ValueAndUnit
  13550. * @param value defines the value to store
  13551. * @param unit defines the unit to store
  13552. * @param negativeValueAllowed defines a boolean indicating if the value can be negative
  13553. */
  13554. function ValueAndUnit(value,
  13555. /** defines the unit to store */
  13556. unit,
  13557. /** defines a boolean indicating if the value can be negative */
  13558. negativeValueAllowed) {
  13559. if (unit === void 0) { unit = ValueAndUnit.UNITMODE_PIXEL; }
  13560. if (negativeValueAllowed === void 0) { negativeValueAllowed = true; }
  13561. this.unit = unit;
  13562. this.negativeValueAllowed = negativeValueAllowed;
  13563. this._value = 1;
  13564. /**
  13565. * Gets or sets a value indicating that this value will not scale accordingly with adaptive scaling property
  13566. * @see https://doc.babylonjs.com/how_to/gui#adaptive-scaling
  13567. */
  13568. this.ignoreAdaptiveScaling = false;
  13569. this._value = value;
  13570. this._originalUnit = unit;
  13571. }
  13572. Object.defineProperty(ValueAndUnit.prototype, "isPercentage", {
  13573. /** Gets a boolean indicating if the value is a percentage */
  13574. get: function () {
  13575. return this.unit === ValueAndUnit.UNITMODE_PERCENTAGE;
  13576. },
  13577. enumerable: false,
  13578. configurable: true
  13579. });
  13580. Object.defineProperty(ValueAndUnit.prototype, "isPixel", {
  13581. /** Gets a boolean indicating if the value is store as pixel */
  13582. get: function () {
  13583. return this.unit === ValueAndUnit.UNITMODE_PIXEL;
  13584. },
  13585. enumerable: false,
  13586. configurable: true
  13587. });
  13588. Object.defineProperty(ValueAndUnit.prototype, "internalValue", {
  13589. /** Gets direct internal value */
  13590. get: function () {
  13591. return this._value;
  13592. },
  13593. enumerable: false,
  13594. configurable: true
  13595. });
  13596. /**
  13597. * Gets value as pixel
  13598. * @param host defines the root host
  13599. * @param refValue defines the reference value for percentages
  13600. * @returns the value as pixel
  13601. */
  13602. ValueAndUnit.prototype.getValueInPixel = function (host, refValue) {
  13603. if (this.isPixel) {
  13604. return this.getValue(host);
  13605. }
  13606. return this.getValue(host) * refValue;
  13607. };
  13608. /**
  13609. * Update the current value and unit. This should be done cautiously as the GUi won't be marked as dirty with this function.
  13610. * @param value defines the value to store
  13611. * @param unit defines the unit to store
  13612. * @returns the current ValueAndUnit
  13613. */
  13614. ValueAndUnit.prototype.updateInPlace = function (value, unit) {
  13615. if (unit === void 0) { unit = ValueAndUnit.UNITMODE_PIXEL; }
  13616. this._value = value;
  13617. this.unit = unit;
  13618. return this;
  13619. };
  13620. /**
  13621. * Gets the value accordingly to its unit
  13622. * @param host defines the root host
  13623. * @returns the value
  13624. */
  13625. ValueAndUnit.prototype.getValue = function (host) {
  13626. if (host && !this.ignoreAdaptiveScaling && this.unit !== ValueAndUnit.UNITMODE_PERCENTAGE) {
  13627. var width = 0;
  13628. var height = 0;
  13629. if (host.idealWidth) {
  13630. width = (this._value * host.getSize().width) / host.idealWidth;
  13631. }
  13632. if (host.idealHeight) {
  13633. height = (this._value * host.getSize().height) / host.idealHeight;
  13634. }
  13635. if (host.useSmallestIdeal && host.idealWidth && host.idealHeight) {
  13636. return window.innerWidth < window.innerHeight ? width : height;
  13637. }
  13638. if (host.idealWidth) { // horizontal
  13639. return width;
  13640. }
  13641. if (host.idealHeight) { // vertical
  13642. return height;
  13643. }
  13644. }
  13645. return this._value;
  13646. };
  13647. /**
  13648. * Gets a string representation of the value
  13649. * @param host defines the root host
  13650. * @param decimals defines an optional number of decimals to display
  13651. * @returns a string
  13652. */
  13653. ValueAndUnit.prototype.toString = function (host, decimals) {
  13654. switch (this.unit) {
  13655. case ValueAndUnit.UNITMODE_PERCENTAGE:
  13656. var percentage = this.getValue(host) * 100;
  13657. return (decimals ? percentage.toFixed(decimals) : percentage) + "%";
  13658. case ValueAndUnit.UNITMODE_PIXEL:
  13659. var pixels = this.getValue(host);
  13660. return (decimals ? pixels.toFixed(decimals) : pixels) + "px";
  13661. }
  13662. return this.unit.toString();
  13663. };
  13664. /**
  13665. * Store a value parsed from a string
  13666. * @param source defines the source string
  13667. * @returns true if the value was successfully parsed
  13668. */
  13669. ValueAndUnit.prototype.fromString = function (source) {
  13670. var match = ValueAndUnit._Regex.exec(source.toString());
  13671. if (!match || match.length === 0) {
  13672. return false;
  13673. }
  13674. var sourceValue = parseFloat(match[1]);
  13675. var sourceUnit = this._originalUnit;
  13676. if (!this.negativeValueAllowed) {
  13677. if (sourceValue < 0) {
  13678. sourceValue = 0;
  13679. }
  13680. }
  13681. if (match.length === 4) {
  13682. switch (match[3]) {
  13683. case "px":
  13684. sourceUnit = ValueAndUnit.UNITMODE_PIXEL;
  13685. break;
  13686. case "%":
  13687. sourceUnit = ValueAndUnit.UNITMODE_PERCENTAGE;
  13688. sourceValue /= 100.0;
  13689. break;
  13690. }
  13691. }
  13692. if (sourceValue === this._value && sourceUnit === this.unit) {
  13693. return false;
  13694. }
  13695. this._value = sourceValue;
  13696. this.unit = sourceUnit;
  13697. return true;
  13698. };
  13699. Object.defineProperty(ValueAndUnit, "UNITMODE_PERCENTAGE", {
  13700. /** UNITMODE_PERCENTAGE */
  13701. get: function () {
  13702. return ValueAndUnit._UNITMODE_PERCENTAGE;
  13703. },
  13704. enumerable: false,
  13705. configurable: true
  13706. });
  13707. Object.defineProperty(ValueAndUnit, "UNITMODE_PIXEL", {
  13708. /** UNITMODE_PIXEL */
  13709. get: function () {
  13710. return ValueAndUnit._UNITMODE_PIXEL;
  13711. },
  13712. enumerable: false,
  13713. configurable: true
  13714. });
  13715. // Static
  13716. ValueAndUnit._Regex = /(^-?\d*(\.\d+)?)(%|px)?/;
  13717. ValueAndUnit._UNITMODE_PERCENTAGE = 0;
  13718. ValueAndUnit._UNITMODE_PIXEL = 1;
  13719. return ValueAndUnit;
  13720. }());
  13721. /***/ }),
  13722. /***/ "./2D/xmlLoader.ts":
  13723. /*!*************************!*\
  13724. !*** ./2D/xmlLoader.ts ***!
  13725. \*************************/
  13726. /*! exports provided: XmlLoader */
  13727. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  13728. "use strict";
  13729. __webpack_require__.r(__webpack_exports__);
  13730. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "XmlLoader", function() { return XmlLoader; });
  13731. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math.vector");
  13732. /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_0__);
  13733. /**
  13734. * Class used to load GUI via XML.
  13735. */
  13736. var XmlLoader = /** @class */ (function () {
  13737. /**
  13738. * Create a new xml loader
  13739. * @param parentClass Sets the class context. Used when the loader is instanced inside a class and not in a global context
  13740. */
  13741. function XmlLoader(parentClass) {
  13742. if (parentClass === void 0) { parentClass = null; }
  13743. this._nodes = {};
  13744. this._nodeTypes = {
  13745. element: 1,
  13746. attribute: 2,
  13747. text: 3
  13748. };
  13749. this._isLoaded = false;
  13750. this._objectAttributes = {
  13751. "textHorizontalAlignment": 1,
  13752. "textVerticalAlignment": 2,
  13753. "horizontalAlignment": 3,
  13754. "verticalAlignment": 4,
  13755. "stretch": 5,
  13756. };
  13757. if (parentClass) {
  13758. this._parentClass = parentClass;
  13759. }
  13760. }
  13761. XmlLoader.prototype._getChainElement = function (attributeValue) {
  13762. var element = window;
  13763. if (this._parentClass) {
  13764. element = this._parentClass;
  13765. }
  13766. var value = attributeValue;
  13767. value = value.split(".");
  13768. for (var i = 0; i < value.length; i++) {
  13769. element = element[value[i]];
  13770. }
  13771. return element;
  13772. };
  13773. XmlLoader.prototype._getClassAttribute = function (attributeName) {
  13774. var attribute = attributeName.split(".");
  13775. var className = babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_0__["_TypeStore"].GetClass("BABYLON.GUI." + attribute[0]);
  13776. return className[attribute[1]];
  13777. };
  13778. XmlLoader.prototype._createGuiElement = function (node, parent, linkParent) {
  13779. if (linkParent === void 0) { linkParent = true; }
  13780. try {
  13781. var className = babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_0__["_TypeStore"].GetClass("BABYLON.GUI." + node.nodeName);
  13782. var guiNode = new className();
  13783. if (parent && linkParent) {
  13784. parent.addControl(guiNode);
  13785. }
  13786. for (var i = 0; i < node.attributes.length; i++) {
  13787. if (node.attributes[i].name.toLowerCase().includes("datasource")) {
  13788. continue;
  13789. }
  13790. if (node.attributes[i].name.toLowerCase().includes("observable")) {
  13791. var element = this._getChainElement(node.attributes[i].value);
  13792. guiNode[node.attributes[i].name].add(element);
  13793. continue;
  13794. }
  13795. else if (node.attributes[i].name == "linkWithMesh") {
  13796. if (this._parentClass) {
  13797. guiNode.linkWithMesh(this._parentClass[node.attributes[i].value]);
  13798. }
  13799. else {
  13800. guiNode.linkWithMesh(window[node.attributes[i].value]);
  13801. }
  13802. }
  13803. else if (node.attributes[i].value.startsWith("{{") && node.attributes[i].value.endsWith("}}")) {
  13804. var element = this._getChainElement(node.attributes[i].value.substring(2, node.attributes[i].value.length - 2));
  13805. guiNode[node.attributes[i].name] = element;
  13806. }
  13807. else if (!this._objectAttributes[node.attributes[i].name]) {
  13808. if (node.attributes[i].value == "true" || node.attributes[i].value == "false") {
  13809. guiNode[node.attributes[i].name] = (node.attributes[i].value == 'true');
  13810. }
  13811. else {
  13812. guiNode[node.attributes[i].name] = !isNaN(Number(node.attributes[i].value)) ? Number(node.attributes[i].value) : node.attributes[i].value;
  13813. }
  13814. }
  13815. else {
  13816. guiNode[node.attributes[i].name] = this._getClassAttribute(node.attributes[i].value);
  13817. }
  13818. }
  13819. if (!node.attributes.getNamedItem("id")) {
  13820. this._nodes[node.nodeName + Object.keys(this._nodes).length + "_gen"] = guiNode;
  13821. return guiNode;
  13822. }
  13823. var id = node.attributes.getNamedItem("id").value;
  13824. if (id.startsWith("{{") && id.endsWith("}}")) {
  13825. id = this._getChainElement(id.substring(2, id.length - 2));
  13826. }
  13827. if (!this._nodes[id]) {
  13828. this._nodes[id] = guiNode;
  13829. }
  13830. else {
  13831. throw "XmlLoader Exception : Duplicate ID, every element should have an unique ID attribute";
  13832. }
  13833. return guiNode;
  13834. }
  13835. catch (e) {
  13836. throw "XmlLoader Exception : Error parsing Control " + node.nodeName + "," + e + ".";
  13837. }
  13838. };
  13839. XmlLoader.prototype._parseGrid = function (node, guiNode, parent) {
  13840. var width;
  13841. var height;
  13842. var columns;
  13843. var rows = node.children;
  13844. var cells;
  13845. var isPixel = false;
  13846. var cellNode;
  13847. var rowNumber = -1;
  13848. var columnNumber = -1;
  13849. var totalColumnsNumber = 0;
  13850. for (var i = 0; i < rows.length; i++) {
  13851. if (rows[i].nodeType != this._nodeTypes.element) {
  13852. continue;
  13853. }
  13854. if (rows[i].nodeName != "Row") {
  13855. throw "XmlLoader Exception : Expecting Row node, received " + rows[i].nodeName;
  13856. }
  13857. rowNumber += 1;
  13858. columns = rows[i].children;
  13859. if (!rows[i].attributes.getNamedItem("height")) {
  13860. throw "XmlLoader Exception : Height must be defined for grid rows";
  13861. }
  13862. height = Number(rows[i].attributes.getNamedItem("height").nodeValue);
  13863. isPixel = rows[i].attributes.getNamedItem("isPixel") ? JSON.parse(rows[i].attributes.getNamedItem("isPixel").nodeValue) : false;
  13864. guiNode.addRowDefinition(height, isPixel);
  13865. for (var j = 0; j < columns.length; j++) {
  13866. if (columns[j].nodeType != this._nodeTypes.element) {
  13867. continue;
  13868. }
  13869. if (columns[j].nodeName != "Column") {
  13870. throw "XmlLoader Exception : Expecting Column node, received " + columns[j].nodeName;
  13871. }
  13872. columnNumber += 1;
  13873. if (rowNumber > 0 && columnNumber > totalColumnsNumber) {
  13874. throw "XmlLoader Exception : In the Grid element, the number of columns is defined in the first row, do not add more columns in the subsequent rows.";
  13875. }
  13876. if (rowNumber == 0) {
  13877. if (!columns[j].attributes.getNamedItem("width")) {
  13878. throw "XmlLoader Exception : Width must be defined for all the grid columns in the first row";
  13879. }
  13880. width = Number(columns[j].attributes.getNamedItem("width").nodeValue);
  13881. isPixel = columns[j].attributes.getNamedItem("isPixel") ? JSON.parse(columns[j].attributes.getNamedItem("isPixel").nodeValue) : false;
  13882. guiNode.addColumnDefinition(width, isPixel);
  13883. }
  13884. cells = columns[j].children;
  13885. for (var k = 0; k < cells.length; k++) {
  13886. if (cells[k].nodeType != this._nodeTypes.element) {
  13887. continue;
  13888. }
  13889. cellNode = this._createGuiElement(cells[k], guiNode, false);
  13890. guiNode.addControl(cellNode, rowNumber, columnNumber);
  13891. if (cells[k].firstChild) {
  13892. this._parseXml(cells[k].firstChild, cellNode);
  13893. }
  13894. }
  13895. }
  13896. if (rowNumber == 0) {
  13897. totalColumnsNumber = columnNumber;
  13898. }
  13899. columnNumber = -1;
  13900. }
  13901. if (node.nextSibling) {
  13902. this._parseXml(node.nextSibling, parent);
  13903. }
  13904. };
  13905. XmlLoader.prototype._parseElement = function (node, guiNode, parent) {
  13906. if (node.firstChild) {
  13907. this._parseXml(node.firstChild, guiNode);
  13908. }
  13909. if (node.nextSibling) {
  13910. this._parseXml(node.nextSibling, parent);
  13911. }
  13912. };
  13913. XmlLoader.prototype._prepareSourceElement = function (node, guiNode, variable, source, iterator) {
  13914. if (this._parentClass) {
  13915. this._parentClass[variable] = source[iterator];
  13916. }
  13917. else {
  13918. window[variable] = source[iterator];
  13919. }
  13920. if (node.firstChild) {
  13921. this._parseXml(node.firstChild, guiNode, true);
  13922. }
  13923. };
  13924. XmlLoader.prototype._parseElementsFromSource = function (node, guiNode, parent) {
  13925. var dataSource = node.attributes.getNamedItem("dataSource").value;
  13926. if (!dataSource.includes(" in ")) {
  13927. throw "XmlLoader Exception : Malformed XML, Data Source must include an in";
  13928. }
  13929. else {
  13930. var isArray = true;
  13931. var splittedSource = dataSource.split(" in ");
  13932. if (splittedSource.length < 2) {
  13933. throw "XmlLoader Exception : Malformed XML, Data Source must an iterator and a source";
  13934. }
  13935. var source = splittedSource[1];
  13936. if (source.startsWith("{") && source.endsWith("}")) {
  13937. isArray = false;
  13938. }
  13939. if (!isArray || (source.startsWith("[") && source.endsWith("]"))) {
  13940. source = source.substring(1, source.length - 1);
  13941. }
  13942. if (this._parentClass) {
  13943. source = this._parentClass[source];
  13944. }
  13945. else {
  13946. source = window[source];
  13947. }
  13948. if (isArray) {
  13949. for (var i = 0; i < source.length; i++) {
  13950. this._prepareSourceElement(node, guiNode, splittedSource[0], source, i);
  13951. }
  13952. }
  13953. else {
  13954. for (var i in source) {
  13955. this._prepareSourceElement(node, guiNode, splittedSource[0], source, i);
  13956. }
  13957. }
  13958. if (node.nextSibling) {
  13959. this._parseXml(node.nextSibling, parent);
  13960. }
  13961. }
  13962. };
  13963. XmlLoader.prototype._parseXml = function (node, parent, generated) {
  13964. if (generated === void 0) { generated = false; }
  13965. if (node.nodeType != this._nodeTypes.element) {
  13966. if (node.nextSibling) {
  13967. this._parseXml(node.nextSibling, parent, generated);
  13968. }
  13969. return;
  13970. }
  13971. if (generated) {
  13972. node.setAttribute("id", parent.id + (parent._children.length + 1));
  13973. }
  13974. var guiNode = this._createGuiElement(node, parent);
  13975. if (node.nodeName == "Grid") {
  13976. this._parseGrid(node, guiNode, parent);
  13977. }
  13978. else if (!node.attributes.getNamedItem("dataSource")) {
  13979. this._parseElement(node, guiNode, parent);
  13980. }
  13981. else {
  13982. this._parseElementsFromSource(node, guiNode, parent);
  13983. }
  13984. };
  13985. /**
  13986. * Gets if the loading has finished.
  13987. * @returns whether the loading has finished or not
  13988. */
  13989. XmlLoader.prototype.isLoaded = function () {
  13990. return this._isLoaded;
  13991. };
  13992. /**
  13993. * Gets a loaded node / control by id.
  13994. * @param id the Controls id set in the xml
  13995. * @returns element of type Control
  13996. */
  13997. XmlLoader.prototype.getNodeById = function (id) {
  13998. return this._nodes[id];
  13999. };
  14000. /**
  14001. * Gets all loaded nodes / controls
  14002. * @returns Array of controls
  14003. */
  14004. XmlLoader.prototype.getNodes = function () {
  14005. return this._nodes;
  14006. };
  14007. /**
  14008. * Initiates the xml layout loading
  14009. * @param xmlFile defines the xml layout to load
  14010. * @param rootNode defines the node / control to use as a parent for the loaded layout controls.
  14011. * @param callback defines the callback called on layout load.
  14012. */
  14013. XmlLoader.prototype.loadLayout = function (xmlFile, rootNode, callback) {
  14014. var xhttp = new XMLHttpRequest();
  14015. xhttp.onreadystatechange = function () {
  14016. if (xhttp.readyState == 4 && xhttp.status == 200) {
  14017. if (!xhttp.responseXML) {
  14018. throw "XmlLoader Exception : XML file is malformed or corrupted.";
  14019. }
  14020. var xmlDoc = xhttp.responseXML.documentElement;
  14021. this._parseXml(xmlDoc.firstChild, rootNode);
  14022. this._isLoaded = true;
  14023. if (callback) {
  14024. callback();
  14025. }
  14026. }
  14027. }.bind(this);
  14028. xhttp.open("GET", xmlFile, true);
  14029. xhttp.send();
  14030. };
  14031. return XmlLoader;
  14032. }());
  14033. /***/ }),
  14034. /***/ "./3D/controls/abstractButton3D.ts":
  14035. /*!*****************************************!*\
  14036. !*** ./3D/controls/abstractButton3D.ts ***!
  14037. \*****************************************/
  14038. /*! exports provided: AbstractButton3D */
  14039. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  14040. "use strict";
  14041. __webpack_require__.r(__webpack_exports__);
  14042. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AbstractButton3D", function() { return AbstractButton3D; });
  14043. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  14044. /* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Meshes/transformNode */ "babylonjs/Maths/math.vector");
  14045. /* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__);
  14046. /* harmony import */ var _control3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control3D */ "./3D/controls/control3D.ts");
  14047. /**
  14048. * Class used as a root to all buttons
  14049. */
  14050. var AbstractButton3D = /** @class */ (function (_super) {
  14051. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(AbstractButton3D, _super);
  14052. /**
  14053. * Creates a new button
  14054. * @param name defines the control name
  14055. */
  14056. function AbstractButton3D(name) {
  14057. return _super.call(this, name) || this;
  14058. }
  14059. AbstractButton3D.prototype._getTypeName = function () {
  14060. return "AbstractButton3D";
  14061. };
  14062. // Mesh association
  14063. AbstractButton3D.prototype._createNode = function (scene) {
  14064. return new babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__["TransformNode"]("button" + this.name);
  14065. };
  14066. return AbstractButton3D;
  14067. }(_control3D__WEBPACK_IMPORTED_MODULE_2__["Control3D"]));
  14068. /***/ }),
  14069. /***/ "./3D/controls/button3D.ts":
  14070. /*!*********************************!*\
  14071. !*** ./3D/controls/button3D.ts ***!
  14072. \*********************************/
  14073. /*! exports provided: Button3D */
  14074. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  14075. "use strict";
  14076. __webpack_require__.r(__webpack_exports__);
  14077. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Button3D", function() { return Button3D; });
  14078. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  14079. /* harmony import */ var babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math.vector */ "babylonjs/Maths/math.vector");
  14080. /* harmony import */ var babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__);
  14081. /* harmony import */ var _abstractButton3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./abstractButton3D */ "./3D/controls/abstractButton3D.ts");
  14082. /* harmony import */ var _2D_advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../2D/advancedDynamicTexture */ "./2D/advancedDynamicTexture.ts");
  14083. /**
  14084. * Class used to create a button in 3D
  14085. */
  14086. var Button3D = /** @class */ (function (_super) {
  14087. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(Button3D, _super);
  14088. /**
  14089. * Creates a new button
  14090. * @param name defines the control name
  14091. */
  14092. function Button3D(name) {
  14093. var _this = _super.call(this, name) || this;
  14094. _this._contentResolution = 512;
  14095. _this._contentScaleRatio = 2;
  14096. // Default animations
  14097. _this.pointerEnterAnimation = function () {
  14098. if (!_this.mesh) {
  14099. return;
  14100. }
  14101. _this._currentMaterial.emissiveColor = babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["Color3"].Red();
  14102. };
  14103. _this.pointerOutAnimation = function () {
  14104. _this._currentMaterial.emissiveColor = babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["Color3"].Black();
  14105. };
  14106. _this.pointerDownAnimation = function () {
  14107. if (!_this.mesh) {
  14108. return;
  14109. }
  14110. _this.mesh.scaling.scaleInPlace(0.95);
  14111. };
  14112. _this.pointerUpAnimation = function () {
  14113. if (!_this.mesh) {
  14114. return;
  14115. }
  14116. _this.mesh.scaling.scaleInPlace(1.0 / 0.95);
  14117. };
  14118. return _this;
  14119. }
  14120. Object.defineProperty(Button3D.prototype, "contentResolution", {
  14121. /**
  14122. * Gets or sets the texture resolution used to render content (512 by default)
  14123. */
  14124. get: function () {
  14125. return this._contentResolution;
  14126. },
  14127. set: function (value) {
  14128. if (this._contentResolution === value) {
  14129. return;
  14130. }
  14131. this._contentResolution = value;
  14132. this._resetContent();
  14133. },
  14134. enumerable: false,
  14135. configurable: true
  14136. });
  14137. Object.defineProperty(Button3D.prototype, "contentScaleRatio", {
  14138. /**
  14139. * Gets or sets the texture scale ratio used to render content (2 by default)
  14140. */
  14141. get: function () {
  14142. return this._contentScaleRatio;
  14143. },
  14144. set: function (value) {
  14145. if (this._contentScaleRatio === value) {
  14146. return;
  14147. }
  14148. this._contentScaleRatio = value;
  14149. this._resetContent();
  14150. },
  14151. enumerable: false,
  14152. configurable: true
  14153. });
  14154. Button3D.prototype._disposeFacadeTexture = function () {
  14155. if (this._facadeTexture) {
  14156. this._facadeTexture.dispose();
  14157. this._facadeTexture = null;
  14158. }
  14159. };
  14160. Button3D.prototype._resetContent = function () {
  14161. this._disposeFacadeTexture();
  14162. this.content = this._content;
  14163. };
  14164. Object.defineProperty(Button3D.prototype, "content", {
  14165. /**
  14166. * Gets or sets the GUI 2D content used to display the button's facade
  14167. */
  14168. get: function () {
  14169. return this._content;
  14170. },
  14171. set: function (value) {
  14172. this._content = value;
  14173. if (!this._host || !this._host.utilityLayer) {
  14174. return;
  14175. }
  14176. if (!this._facadeTexture) {
  14177. this._facadeTexture = new _2D_advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_3__["AdvancedDynamicTexture"]("Facade", this._contentResolution, this._contentResolution, this._host.utilityLayer.utilityLayerScene, true, babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["Texture"].TRILINEAR_SAMPLINGMODE);
  14178. this._facadeTexture.rootContainer.scaleX = this._contentScaleRatio;
  14179. this._facadeTexture.rootContainer.scaleY = this._contentScaleRatio;
  14180. this._facadeTexture.premulAlpha = true;
  14181. }
  14182. else {
  14183. this._facadeTexture.rootContainer.clearControls();
  14184. }
  14185. this._facadeTexture.addControl(value);
  14186. this._applyFacade(this._facadeTexture);
  14187. },
  14188. enumerable: false,
  14189. configurable: true
  14190. });
  14191. /**
  14192. * Apply the facade texture (created from the content property).
  14193. * This function can be overloaded by child classes
  14194. * @param facadeTexture defines the AdvancedDynamicTexture to use
  14195. */
  14196. Button3D.prototype._applyFacade = function (facadeTexture) {
  14197. this._currentMaterial.emissiveTexture = facadeTexture;
  14198. };
  14199. Button3D.prototype._getTypeName = function () {
  14200. return "Button3D";
  14201. };
  14202. // Mesh association
  14203. Button3D.prototype._createNode = function (scene) {
  14204. var faceUV = new Array(6);
  14205. for (var i = 0; i < 6; i++) {
  14206. faceUV[i] = new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["Vector4"](0, 0, 0, 0);
  14207. }
  14208. faceUV[1] = new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["Vector4"](0, 0, 1, 1);
  14209. var mesh = babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["BoxBuilder"].CreateBox(this.name + "_rootMesh", {
  14210. width: 1.0,
  14211. height: 1.0,
  14212. depth: 0.08,
  14213. faceUV: faceUV
  14214. }, scene);
  14215. return mesh;
  14216. };
  14217. Button3D.prototype._affectMaterial = function (mesh) {
  14218. var material = new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["StandardMaterial"](this.name + "Material", mesh.getScene());
  14219. material.specularColor = babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["Color3"].Black();
  14220. mesh.material = material;
  14221. this._currentMaterial = material;
  14222. this._resetContent();
  14223. };
  14224. /**
  14225. * Releases all associated resources
  14226. */
  14227. Button3D.prototype.dispose = function () {
  14228. _super.prototype.dispose.call(this);
  14229. this._disposeFacadeTexture();
  14230. if (this._currentMaterial) {
  14231. this._currentMaterial.dispose();
  14232. }
  14233. };
  14234. return Button3D;
  14235. }(_abstractButton3D__WEBPACK_IMPORTED_MODULE_2__["AbstractButton3D"]));
  14236. /***/ }),
  14237. /***/ "./3D/controls/container3D.ts":
  14238. /*!************************************!*\
  14239. !*** ./3D/controls/container3D.ts ***!
  14240. \************************************/
  14241. /*! exports provided: Container3D */
  14242. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  14243. "use strict";
  14244. __webpack_require__.r(__webpack_exports__);
  14245. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Container3D", function() { return Container3D; });
  14246. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  14247. /* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Meshes/transformNode */ "babylonjs/Maths/math.vector");
  14248. /* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__);
  14249. /* harmony import */ var _control3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control3D */ "./3D/controls/control3D.ts");
  14250. /**
  14251. * Class used to create containers for controls
  14252. */
  14253. var Container3D = /** @class */ (function (_super) {
  14254. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(Container3D, _super);
  14255. /**
  14256. * Creates a new container
  14257. * @param name defines the container name
  14258. */
  14259. function Container3D(name) {
  14260. var _this = _super.call(this, name) || this;
  14261. _this._blockLayout = false;
  14262. /**
  14263. * Gets the list of child controls
  14264. */
  14265. _this._children = new Array();
  14266. return _this;
  14267. }
  14268. Object.defineProperty(Container3D.prototype, "children", {
  14269. /**
  14270. * Gets the list of child controls
  14271. */
  14272. get: function () {
  14273. return this._children;
  14274. },
  14275. enumerable: false,
  14276. configurable: true
  14277. });
  14278. Object.defineProperty(Container3D.prototype, "blockLayout", {
  14279. /**
  14280. * Gets or sets a boolean indicating if the layout must be blocked (default is false).
  14281. * This is helpful to optimize layout operation when adding multiple children in a row
  14282. */
  14283. get: function () {
  14284. return this._blockLayout;
  14285. },
  14286. set: function (value) {
  14287. if (this._blockLayout === value) {
  14288. return;
  14289. }
  14290. this._blockLayout = value;
  14291. if (!this._blockLayout) {
  14292. this._arrangeChildren();
  14293. }
  14294. },
  14295. enumerable: false,
  14296. configurable: true
  14297. });
  14298. /**
  14299. * Force the container to update the layout. Please note that it will not take blockLayout property in account
  14300. * @returns the current container
  14301. */
  14302. Container3D.prototype.updateLayout = function () {
  14303. this._arrangeChildren();
  14304. return this;
  14305. };
  14306. /**
  14307. * Gets a boolean indicating if the given control is in the children of this control
  14308. * @param control defines the control to check
  14309. * @returns true if the control is in the child list
  14310. */
  14311. Container3D.prototype.containsControl = function (control) {
  14312. return this._children.indexOf(control) !== -1;
  14313. };
  14314. /**
  14315. * Adds a control to the children of this control
  14316. * @param control defines the control to add
  14317. * @returns the current container
  14318. */
  14319. Container3D.prototype.addControl = function (control) {
  14320. var index = this._children.indexOf(control);
  14321. if (index !== -1) {
  14322. return this;
  14323. }
  14324. control.parent = this;
  14325. control._host = this._host;
  14326. this._children.push(control);
  14327. if (this._host.utilityLayer) {
  14328. control._prepareNode(this._host.utilityLayer.utilityLayerScene);
  14329. if (control.node) {
  14330. control.node.parent = this.node;
  14331. }
  14332. if (!this.blockLayout) {
  14333. this._arrangeChildren();
  14334. }
  14335. }
  14336. return this;
  14337. };
  14338. /**
  14339. * This function will be called everytime a new control is added
  14340. */
  14341. Container3D.prototype._arrangeChildren = function () {
  14342. };
  14343. Container3D.prototype._createNode = function (scene) {
  14344. return new babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__["TransformNode"]("ContainerNode", scene);
  14345. };
  14346. /**
  14347. * Removes a control from the children of this control
  14348. * @param control defines the control to remove
  14349. * @returns the current container
  14350. */
  14351. Container3D.prototype.removeControl = function (control) {
  14352. var index = this._children.indexOf(control);
  14353. if (index !== -1) {
  14354. this._children.splice(index, 1);
  14355. control.parent = null;
  14356. control._disposeNode();
  14357. }
  14358. return this;
  14359. };
  14360. Container3D.prototype._getTypeName = function () {
  14361. return "Container3D";
  14362. };
  14363. /**
  14364. * Releases all associated resources
  14365. */
  14366. Container3D.prototype.dispose = function () {
  14367. for (var _i = 0, _a = this._children; _i < _a.length; _i++) {
  14368. var control = _a[_i];
  14369. control.dispose();
  14370. }
  14371. this._children = [];
  14372. _super.prototype.dispose.call(this);
  14373. };
  14374. /** Control rotation will remain unchanged */
  14375. Container3D.UNSET_ORIENTATION = 0;
  14376. /** Control will rotate to make it look at sphere central axis */
  14377. Container3D.FACEORIGIN_ORIENTATION = 1;
  14378. /** Control will rotate to make it look back at sphere central axis */
  14379. Container3D.FACEORIGINREVERSED_ORIENTATION = 2;
  14380. /** Control will rotate to look at z axis (0, 0, 1) */
  14381. Container3D.FACEFORWARD_ORIENTATION = 3;
  14382. /** Control will rotate to look at negative z axis (0, 0, -1) */
  14383. Container3D.FACEFORWARDREVERSED_ORIENTATION = 4;
  14384. return Container3D;
  14385. }(_control3D__WEBPACK_IMPORTED_MODULE_2__["Control3D"]));
  14386. /***/ }),
  14387. /***/ "./3D/controls/control3D.ts":
  14388. /*!**********************************!*\
  14389. !*** ./3D/controls/control3D.ts ***!
  14390. \**********************************/
  14391. /*! exports provided: Control3D */
  14392. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  14393. "use strict";
  14394. __webpack_require__.r(__webpack_exports__);
  14395. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Control3D", function() { return Control3D; });
  14396. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math.vector");
  14397. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
  14398. /* harmony import */ var _vector3WithInfo__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../vector3WithInfo */ "./3D/vector3WithInfo.ts");
  14399. /**
  14400. * Class used as base class for controls
  14401. */
  14402. var Control3D = /** @class */ (function () {
  14403. /**
  14404. * Creates a new control
  14405. * @param name defines the control name
  14406. */
  14407. function Control3D(
  14408. /** Defines the control name */
  14409. name) {
  14410. this.name = name;
  14411. this._downCount = 0;
  14412. this._enterCount = -1;
  14413. this._downPointerIds = {};
  14414. this._isVisible = true;
  14415. /**
  14416. * An event triggered when the pointer move over the control
  14417. */
  14418. this.onPointerMoveObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  14419. /**
  14420. * An event triggered when the pointer move out of the control
  14421. */
  14422. this.onPointerOutObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  14423. /**
  14424. * An event triggered when the pointer taps the control
  14425. */
  14426. this.onPointerDownObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  14427. /**
  14428. * An event triggered when pointer is up
  14429. */
  14430. this.onPointerUpObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  14431. /**
  14432. * An event triggered when a control is clicked on (with a mouse)
  14433. */
  14434. this.onPointerClickObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  14435. /**
  14436. * An event triggered when pointer enters the control
  14437. */
  14438. this.onPointerEnterObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  14439. // Behaviors
  14440. this._behaviors = new Array();
  14441. }
  14442. Object.defineProperty(Control3D.prototype, "position", {
  14443. /** Gets or sets the control position in world space */
  14444. get: function () {
  14445. if (!this._node) {
  14446. return babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Vector3"].Zero();
  14447. }
  14448. return this._node.position;
  14449. },
  14450. set: function (value) {
  14451. if (!this._node) {
  14452. return;
  14453. }
  14454. this._node.position = value;
  14455. },
  14456. enumerable: false,
  14457. configurable: true
  14458. });
  14459. Object.defineProperty(Control3D.prototype, "scaling", {
  14460. /** Gets or sets the control scaling in world space */
  14461. get: function () {
  14462. if (!this._node) {
  14463. return new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Vector3"](1, 1, 1);
  14464. }
  14465. return this._node.scaling;
  14466. },
  14467. set: function (value) {
  14468. if (!this._node) {
  14469. return;
  14470. }
  14471. this._node.scaling = value;
  14472. },
  14473. enumerable: false,
  14474. configurable: true
  14475. });
  14476. Object.defineProperty(Control3D.prototype, "behaviors", {
  14477. /**
  14478. * Gets the list of attached behaviors
  14479. * @see https://doc.babylonjs.com/features/behaviour
  14480. */
  14481. get: function () {
  14482. return this._behaviors;
  14483. },
  14484. enumerable: false,
  14485. configurable: true
  14486. });
  14487. /**
  14488. * Attach a behavior to the control
  14489. * @see https://doc.babylonjs.com/features/behaviour
  14490. * @param behavior defines the behavior to attach
  14491. * @returns the current control
  14492. */
  14493. Control3D.prototype.addBehavior = function (behavior) {
  14494. var _this = this;
  14495. var index = this._behaviors.indexOf(behavior);
  14496. if (index !== -1) {
  14497. return this;
  14498. }
  14499. behavior.init();
  14500. var scene = this._host.scene;
  14501. if (scene.isLoading) {
  14502. // We defer the attach when the scene will be loaded
  14503. scene.onDataLoadedObservable.addOnce(function () {
  14504. behavior.attach(_this);
  14505. });
  14506. }
  14507. else {
  14508. behavior.attach(this);
  14509. }
  14510. this._behaviors.push(behavior);
  14511. return this;
  14512. };
  14513. /**
  14514. * Remove an attached behavior
  14515. * @see https://doc.babylonjs.com/features/behaviour
  14516. * @param behavior defines the behavior to attach
  14517. * @returns the current control
  14518. */
  14519. Control3D.prototype.removeBehavior = function (behavior) {
  14520. var index = this._behaviors.indexOf(behavior);
  14521. if (index === -1) {
  14522. return this;
  14523. }
  14524. this._behaviors[index].detach();
  14525. this._behaviors.splice(index, 1);
  14526. return this;
  14527. };
  14528. /**
  14529. * Gets an attached behavior by name
  14530. * @param name defines the name of the behavior to look for
  14531. * @see https://doc.babylonjs.com/features/behaviour
  14532. * @returns null if behavior was not found else the requested behavior
  14533. */
  14534. Control3D.prototype.getBehaviorByName = function (name) {
  14535. for (var _i = 0, _a = this._behaviors; _i < _a.length; _i++) {
  14536. var behavior = _a[_i];
  14537. if (behavior.name === name) {
  14538. return behavior;
  14539. }
  14540. }
  14541. return null;
  14542. };
  14543. Object.defineProperty(Control3D.prototype, "isVisible", {
  14544. /** Gets or sets a boolean indicating if the control is visible */
  14545. get: function () {
  14546. return this._isVisible;
  14547. },
  14548. set: function (value) {
  14549. if (this._isVisible === value) {
  14550. return;
  14551. }
  14552. this._isVisible = value;
  14553. var mesh = this.mesh;
  14554. if (mesh) {
  14555. mesh.setEnabled(value);
  14556. }
  14557. },
  14558. enumerable: false,
  14559. configurable: true
  14560. });
  14561. Object.defineProperty(Control3D.prototype, "typeName", {
  14562. /**
  14563. * Gets a string representing the class name
  14564. */
  14565. get: function () {
  14566. return this._getTypeName();
  14567. },
  14568. enumerable: false,
  14569. configurable: true
  14570. });
  14571. /**
  14572. * Get the current class name of the control.
  14573. * @returns current class name
  14574. */
  14575. Control3D.prototype.getClassName = function () {
  14576. return this._getTypeName();
  14577. };
  14578. Control3D.prototype._getTypeName = function () {
  14579. return "Control3D";
  14580. };
  14581. Object.defineProperty(Control3D.prototype, "node", {
  14582. /**
  14583. * Gets the transform node used by this control
  14584. */
  14585. get: function () {
  14586. return this._node;
  14587. },
  14588. enumerable: false,
  14589. configurable: true
  14590. });
  14591. Object.defineProperty(Control3D.prototype, "mesh", {
  14592. /**
  14593. * Gets the mesh used to render this control
  14594. */
  14595. get: function () {
  14596. if (this._node instanceof babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["AbstractMesh"]) {
  14597. return this._node;
  14598. }
  14599. return null;
  14600. },
  14601. enumerable: false,
  14602. configurable: true
  14603. });
  14604. /**
  14605. * Link the control as child of the given node
  14606. * @param node defines the node to link to. Use null to unlink the control
  14607. * @returns the current control
  14608. */
  14609. Control3D.prototype.linkToTransformNode = function (node) {
  14610. if (this._node) {
  14611. this._node.parent = node;
  14612. }
  14613. return this;
  14614. };
  14615. /** @hidden **/
  14616. Control3D.prototype._prepareNode = function (scene) {
  14617. if (!this._node) {
  14618. this._node = this._createNode(scene);
  14619. if (!this.node) {
  14620. return;
  14621. }
  14622. this._node.metadata = this; // Store the control on the metadata field in order to get it when picking
  14623. this._node.position = this.position;
  14624. this._node.scaling = this.scaling;
  14625. var mesh = this.mesh;
  14626. if (mesh) {
  14627. mesh.isPickable = true;
  14628. this._affectMaterial(mesh);
  14629. }
  14630. }
  14631. };
  14632. /**
  14633. * Node creation.
  14634. * Can be overriden by children
  14635. * @param scene defines the scene where the node must be attached
  14636. * @returns the attached node or null if none. Must return a Mesh or AbstractMesh if there is an atttached visible object
  14637. */
  14638. Control3D.prototype._createNode = function (scene) {
  14639. // Do nothing by default
  14640. return null;
  14641. };
  14642. /**
  14643. * Affect a material to the given mesh
  14644. * @param mesh defines the mesh which will represent the control
  14645. */
  14646. Control3D.prototype._affectMaterial = function (mesh) {
  14647. mesh.material = null;
  14648. };
  14649. // Pointers
  14650. /** @hidden */
  14651. Control3D.prototype._onPointerMove = function (target, coordinates) {
  14652. this.onPointerMoveObservable.notifyObservers(coordinates, -1, target, this);
  14653. };
  14654. /** @hidden */
  14655. Control3D.prototype._onPointerEnter = function (target) {
  14656. if (this._enterCount > 0) {
  14657. return false;
  14658. }
  14659. if (this._enterCount === -1) { // -1 is for touch input, we are now sure we are with a mouse or pencil
  14660. this._enterCount = 0;
  14661. }
  14662. this._enterCount++;
  14663. this.onPointerEnterObservable.notifyObservers(this, -1, target, this);
  14664. if (this.pointerEnterAnimation) {
  14665. this.pointerEnterAnimation();
  14666. }
  14667. return true;
  14668. };
  14669. /** @hidden */
  14670. Control3D.prototype._onPointerOut = function (target) {
  14671. this._enterCount = 0;
  14672. this.onPointerOutObservable.notifyObservers(this, -1, target, this);
  14673. if (this.pointerOutAnimation) {
  14674. this.pointerOutAnimation();
  14675. }
  14676. };
  14677. /** @hidden */
  14678. Control3D.prototype._onPointerDown = function (target, coordinates, pointerId, buttonIndex) {
  14679. if (this._downCount !== 0) {
  14680. this._downCount++;
  14681. return false;
  14682. }
  14683. this._downCount++;
  14684. this._downPointerIds[pointerId] = true;
  14685. this.onPointerDownObservable.notifyObservers(new _vector3WithInfo__WEBPACK_IMPORTED_MODULE_1__["Vector3WithInfo"](coordinates, buttonIndex), -1, target, this);
  14686. if (this.pointerDownAnimation) {
  14687. this.pointerDownAnimation();
  14688. }
  14689. return true;
  14690. };
  14691. /** @hidden */
  14692. Control3D.prototype._onPointerUp = function (target, coordinates, pointerId, buttonIndex, notifyClick) {
  14693. this._downCount--;
  14694. delete this._downPointerIds[pointerId];
  14695. if (this._downCount < 0) {
  14696. // Handle if forcePointerUp was called prior to this
  14697. this._downCount = 0;
  14698. return;
  14699. }
  14700. if (this._downCount == 0) {
  14701. if (notifyClick && (this._enterCount > 0 || this._enterCount === -1)) {
  14702. this.onPointerClickObservable.notifyObservers(new _vector3WithInfo__WEBPACK_IMPORTED_MODULE_1__["Vector3WithInfo"](coordinates, buttonIndex), -1, target, this);
  14703. }
  14704. this.onPointerUpObservable.notifyObservers(new _vector3WithInfo__WEBPACK_IMPORTED_MODULE_1__["Vector3WithInfo"](coordinates, buttonIndex), -1, target, this);
  14705. if (this.pointerUpAnimation) {
  14706. this.pointerUpAnimation();
  14707. }
  14708. }
  14709. };
  14710. /** @hidden */
  14711. Control3D.prototype.forcePointerUp = function (pointerId) {
  14712. if (pointerId === void 0) { pointerId = null; }
  14713. if (pointerId !== null) {
  14714. this._onPointerUp(this, babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Vector3"].Zero(), pointerId, 0, true);
  14715. }
  14716. else {
  14717. for (var key in this._downPointerIds) {
  14718. this._onPointerUp(this, babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Vector3"].Zero(), +key, 0, true);
  14719. }
  14720. if (this._downCount > 0) {
  14721. this._downCount = 1;
  14722. this._onPointerUp(this, babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Vector3"].Zero(), 0, 0, true);
  14723. }
  14724. }
  14725. };
  14726. /** @hidden */
  14727. Control3D.prototype._processObservables = function (type, pickedPoint, pointerId, buttonIndex) {
  14728. if (type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["PointerEventTypes"].POINTERMOVE) {
  14729. this._onPointerMove(this, pickedPoint);
  14730. var previousControlOver = this._host._lastControlOver[pointerId];
  14731. if (previousControlOver && previousControlOver !== this) {
  14732. previousControlOver._onPointerOut(this);
  14733. }
  14734. if (previousControlOver !== this) {
  14735. this._onPointerEnter(this);
  14736. }
  14737. this._host._lastControlOver[pointerId] = this;
  14738. return true;
  14739. }
  14740. if (type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["PointerEventTypes"].POINTERDOWN) {
  14741. this._onPointerDown(this, pickedPoint, pointerId, buttonIndex);
  14742. this._host._lastControlDown[pointerId] = this;
  14743. this._host._lastPickedControl = this;
  14744. return true;
  14745. }
  14746. if (type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["PointerEventTypes"].POINTERUP || type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["PointerEventTypes"].POINTERDOUBLETAP) {
  14747. if (this._host._lastControlDown[pointerId]) {
  14748. this._host._lastControlDown[pointerId]._onPointerUp(this, pickedPoint, pointerId, buttonIndex, true);
  14749. }
  14750. delete this._host._lastControlDown[pointerId];
  14751. return true;
  14752. }
  14753. return false;
  14754. };
  14755. /** @hidden */
  14756. Control3D.prototype._disposeNode = function () {
  14757. if (this._node) {
  14758. this._node.dispose();
  14759. this._node = null;
  14760. }
  14761. };
  14762. /**
  14763. * Releases all associated resources
  14764. */
  14765. Control3D.prototype.dispose = function () {
  14766. this.onPointerDownObservable.clear();
  14767. this.onPointerEnterObservable.clear();
  14768. this.onPointerMoveObservable.clear();
  14769. this.onPointerOutObservable.clear();
  14770. this.onPointerUpObservable.clear();
  14771. this.onPointerClickObservable.clear();
  14772. this._disposeNode();
  14773. // Behaviors
  14774. for (var _i = 0, _a = this._behaviors; _i < _a.length; _i++) {
  14775. var behavior = _a[_i];
  14776. behavior.detach();
  14777. }
  14778. };
  14779. return Control3D;
  14780. }());
  14781. /***/ }),
  14782. /***/ "./3D/controls/cylinderPanel.ts":
  14783. /*!**************************************!*\
  14784. !*** ./3D/controls/cylinderPanel.ts ***!
  14785. \**************************************/
  14786. /*! exports provided: CylinderPanel */
  14787. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  14788. "use strict";
  14789. __webpack_require__.r(__webpack_exports__);
  14790. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "CylinderPanel", function() { return CylinderPanel; });
  14791. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  14792. /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Maths/math.vector");
  14793. /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
  14794. /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
  14795. /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
  14796. /**
  14797. * Class used to create a container panel deployed on the surface of a cylinder
  14798. */
  14799. var CylinderPanel = /** @class */ (function (_super) {
  14800. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(CylinderPanel, _super);
  14801. function CylinderPanel() {
  14802. var _this = _super !== null && _super.apply(this, arguments) || this;
  14803. _this._radius = 5.0;
  14804. return _this;
  14805. }
  14806. Object.defineProperty(CylinderPanel.prototype, "radius", {
  14807. /**
  14808. * Gets or sets the radius of the cylinder where to project controls (5 by default)
  14809. */
  14810. get: function () {
  14811. return this._radius;
  14812. },
  14813. set: function (value) {
  14814. var _this = this;
  14815. if (this._radius === value) {
  14816. return;
  14817. }
  14818. this._radius = value;
  14819. babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Tools"].SetImmediate(function () {
  14820. _this._arrangeChildren();
  14821. });
  14822. },
  14823. enumerable: false,
  14824. configurable: true
  14825. });
  14826. CylinderPanel.prototype._mapGridNode = function (control, nodePosition) {
  14827. var mesh = control.mesh;
  14828. if (!mesh) {
  14829. return;
  14830. }
  14831. var newPos = this._cylindricalMapping(nodePosition);
  14832. control.position = newPos;
  14833. switch (this.orientation) {
  14834. case _container3D__WEBPACK_IMPORTED_MODULE_3__["Container3D"].FACEORIGIN_ORIENTATION:
  14835. mesh.lookAt(new babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Vector3"](2 * newPos.x, newPos.y, 2 * newPos.z));
  14836. break;
  14837. case _container3D__WEBPACK_IMPORTED_MODULE_3__["Container3D"].FACEORIGINREVERSED_ORIENTATION:
  14838. mesh.lookAt(new babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Vector3"](-newPos.x, newPos.y, -newPos.z));
  14839. break;
  14840. case _container3D__WEBPACK_IMPORTED_MODULE_3__["Container3D"].FACEFORWARD_ORIENTATION:
  14841. break;
  14842. case _container3D__WEBPACK_IMPORTED_MODULE_3__["Container3D"].FACEFORWARDREVERSED_ORIENTATION:
  14843. mesh.rotate(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Axis"].Y, Math.PI, babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Space"].LOCAL);
  14844. break;
  14845. }
  14846. };
  14847. CylinderPanel.prototype._cylindricalMapping = function (source) {
  14848. var newPos = new babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Vector3"](0, source.y, this._radius);
  14849. var yAngle = (source.x / this._radius);
  14850. babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Matrix"].RotationYawPitchRollToRef(yAngle, 0, 0, babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["TmpVectors"].Matrix[0]);
  14851. return babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Vector3"].TransformNormal(newPos, babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["TmpVectors"].Matrix[0]);
  14852. };
  14853. return CylinderPanel;
  14854. }(_volumeBasedPanel__WEBPACK_IMPORTED_MODULE_2__["VolumeBasedPanel"]));
  14855. /***/ }),
  14856. /***/ "./3D/controls/holographicButton.ts":
  14857. /*!******************************************!*\
  14858. !*** ./3D/controls/holographicButton.ts ***!
  14859. \******************************************/
  14860. /*! exports provided: HolographicButton */
  14861. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  14862. "use strict";
  14863. __webpack_require__.r(__webpack_exports__);
  14864. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "HolographicButton", function() { return HolographicButton; });
  14865. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  14866. /* harmony import */ var _button3D__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./button3D */ "./3D/controls/button3D.ts");
  14867. /* harmony import */ var babylonjs_Materials_standardMaterial__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Materials/standardMaterial */ "babylonjs/Maths/math.vector");
  14868. /* harmony import */ var babylonjs_Materials_standardMaterial__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Materials_standardMaterial__WEBPACK_IMPORTED_MODULE_2__);
  14869. /* harmony import */ var _materials_fluentMaterial__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../materials/fluentMaterial */ "./3D/materials/fluentMaterial.ts");
  14870. /* harmony import */ var _2D_controls_stackPanel__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../2D/controls/stackPanel */ "./2D/controls/stackPanel.ts");
  14871. /* harmony import */ var _2D_controls_image__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../2D/controls/image */ "./2D/controls/image.ts");
  14872. /* harmony import */ var _2D_controls_textBlock__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../2D/controls/textBlock */ "./2D/controls/textBlock.ts");
  14873. /* harmony import */ var _2D_advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../2D/advancedDynamicTexture */ "./2D/advancedDynamicTexture.ts");
  14874. /**
  14875. * Class used to create a holographic button in 3D
  14876. */
  14877. var HolographicButton = /** @class */ (function (_super) {
  14878. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(HolographicButton, _super);
  14879. /**
  14880. * Creates a new button
  14881. * @param name defines the control name
  14882. */
  14883. function HolographicButton(name, shareMaterials) {
  14884. if (shareMaterials === void 0) { shareMaterials = true; }
  14885. var _this = _super.call(this, name) || this;
  14886. _this._shareMaterials = true;
  14887. _this._shareMaterials = shareMaterials;
  14888. // Default animations
  14889. _this.pointerEnterAnimation = function () {
  14890. if (!_this.mesh) {
  14891. return;
  14892. }
  14893. _this._frontPlate.setEnabled(true);
  14894. };
  14895. _this.pointerOutAnimation = function () {
  14896. if (!_this.mesh) {
  14897. return;
  14898. }
  14899. _this._frontPlate.setEnabled(false);
  14900. };
  14901. return _this;
  14902. }
  14903. HolographicButton.prototype._disposeTooltip = function () {
  14904. this._tooltipFade = null;
  14905. if (this._tooltipTextBlock) {
  14906. this._tooltipTextBlock.dispose();
  14907. }
  14908. if (this._tooltipTexture) {
  14909. this._tooltipTexture.dispose();
  14910. }
  14911. if (this._tooltipMesh) {
  14912. this._tooltipMesh.dispose();
  14913. }
  14914. this.onPointerEnterObservable.remove(this._tooltipHoverObserver);
  14915. this.onPointerOutObservable.remove(this._tooltipOutObserver);
  14916. };
  14917. Object.defineProperty(HolographicButton.prototype, "renderingGroupId", {
  14918. get: function () {
  14919. return this._backPlate.renderingGroupId;
  14920. },
  14921. /**
  14922. * Rendering ground id of all the mesh in the button
  14923. */
  14924. set: function (id) {
  14925. this._backPlate.renderingGroupId = id;
  14926. this._textPlate.renderingGroupId = id;
  14927. this._frontPlate.renderingGroupId = id;
  14928. if (this._tooltipMesh) {
  14929. this._tooltipMesh.renderingGroupId = id;
  14930. }
  14931. },
  14932. enumerable: false,
  14933. configurable: true
  14934. });
  14935. Object.defineProperty(HolographicButton.prototype, "tooltipText", {
  14936. get: function () {
  14937. if (this._tooltipTextBlock) {
  14938. return this._tooltipTextBlock.text;
  14939. }
  14940. return null;
  14941. },
  14942. /**
  14943. * Text to be displayed on the tooltip shown when hovering on the button. When set to null tooltip is disabled. (Default: null)
  14944. */
  14945. set: function (text) {
  14946. var _this = this;
  14947. if (!text) {
  14948. this._disposeTooltip();
  14949. return;
  14950. }
  14951. if (!this._tooltipFade) {
  14952. // Create tooltip with mesh and text
  14953. this._tooltipMesh = babylonjs_Materials_standardMaterial__WEBPACK_IMPORTED_MODULE_2__["PlaneBuilder"].CreatePlane("", { size: 1 }, this._backPlate._scene);
  14954. var tooltipBackground = babylonjs_Materials_standardMaterial__WEBPACK_IMPORTED_MODULE_2__["PlaneBuilder"].CreatePlane("", { size: 1, sideOrientation: babylonjs_Materials_standardMaterial__WEBPACK_IMPORTED_MODULE_2__["Mesh"].DOUBLESIDE }, this._backPlate._scene);
  14955. var mat = new babylonjs_Materials_standardMaterial__WEBPACK_IMPORTED_MODULE_2__["StandardMaterial"]("", this._backPlate._scene);
  14956. mat.diffuseColor = babylonjs_Materials_standardMaterial__WEBPACK_IMPORTED_MODULE_2__["Color3"].FromHexString("#212121");
  14957. tooltipBackground.material = mat;
  14958. tooltipBackground.isPickable = false;
  14959. this._tooltipMesh.addChild(tooltipBackground);
  14960. tooltipBackground.position.z = 0.05;
  14961. this._tooltipMesh.scaling.y = 1 / 3;
  14962. this._tooltipMesh.position.y = 0.7;
  14963. this._tooltipMesh.position.z = -0.15;
  14964. this._tooltipMesh.isPickable = false;
  14965. this._tooltipMesh.parent = this._backPlate;
  14966. // Create text texture for the tooltip
  14967. this._tooltipTexture = _2D_advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_7__["AdvancedDynamicTexture"].CreateForMesh(this._tooltipMesh);
  14968. this._tooltipTextBlock = new _2D_controls_textBlock__WEBPACK_IMPORTED_MODULE_6__["TextBlock"]();
  14969. this._tooltipTextBlock.scaleY = 3;
  14970. this._tooltipTextBlock.color = "white";
  14971. this._tooltipTextBlock.fontSize = 130;
  14972. this._tooltipTexture.addControl(this._tooltipTextBlock);
  14973. // Add hover action to tooltip
  14974. this._tooltipFade = new babylonjs_Materials_standardMaterial__WEBPACK_IMPORTED_MODULE_2__["FadeInOutBehavior"]();
  14975. this._tooltipFade.delay = 500;
  14976. this._tooltipMesh.addBehavior(this._tooltipFade);
  14977. this._tooltipHoverObserver = this.onPointerEnterObservable.add(function () {
  14978. if (_this._tooltipFade) {
  14979. _this._tooltipFade.fadeIn(true);
  14980. }
  14981. });
  14982. this._tooltipOutObserver = this.onPointerOutObservable.add(function () {
  14983. if (_this._tooltipFade) {
  14984. _this._tooltipFade.fadeIn(false);
  14985. }
  14986. });
  14987. }
  14988. if (this._tooltipTextBlock) {
  14989. this._tooltipTextBlock.text = text;
  14990. }
  14991. },
  14992. enumerable: false,
  14993. configurable: true
  14994. });
  14995. Object.defineProperty(HolographicButton.prototype, "text", {
  14996. /**
  14997. * Gets or sets text for the button
  14998. */
  14999. get: function () {
  15000. return this._text;
  15001. },
  15002. set: function (value) {
  15003. if (this._text === value) {
  15004. return;
  15005. }
  15006. this._text = value;
  15007. this._rebuildContent();
  15008. },
  15009. enumerable: false,
  15010. configurable: true
  15011. });
  15012. Object.defineProperty(HolographicButton.prototype, "imageUrl", {
  15013. /**
  15014. * Gets or sets the image url for the button
  15015. */
  15016. get: function () {
  15017. return this._imageUrl;
  15018. },
  15019. set: function (value) {
  15020. if (this._imageUrl === value) {
  15021. return;
  15022. }
  15023. this._imageUrl = value;
  15024. this._rebuildContent();
  15025. },
  15026. enumerable: false,
  15027. configurable: true
  15028. });
  15029. Object.defineProperty(HolographicButton.prototype, "backMaterial", {
  15030. /**
  15031. * Gets the back material used by this button
  15032. */
  15033. get: function () {
  15034. return this._backMaterial;
  15035. },
  15036. enumerable: false,
  15037. configurable: true
  15038. });
  15039. Object.defineProperty(HolographicButton.prototype, "frontMaterial", {
  15040. /**
  15041. * Gets the front material used by this button
  15042. */
  15043. get: function () {
  15044. return this._frontMaterial;
  15045. },
  15046. enumerable: false,
  15047. configurable: true
  15048. });
  15049. Object.defineProperty(HolographicButton.prototype, "plateMaterial", {
  15050. /**
  15051. * Gets the plate material used by this button
  15052. */
  15053. get: function () {
  15054. return this._plateMaterial;
  15055. },
  15056. enumerable: false,
  15057. configurable: true
  15058. });
  15059. Object.defineProperty(HolographicButton.prototype, "shareMaterials", {
  15060. /**
  15061. * Gets a boolean indicating if this button shares its material with other HolographicButtons
  15062. */
  15063. get: function () {
  15064. return this._shareMaterials;
  15065. },
  15066. enumerable: false,
  15067. configurable: true
  15068. });
  15069. HolographicButton.prototype._getTypeName = function () {
  15070. return "HolographicButton";
  15071. };
  15072. HolographicButton.prototype._rebuildContent = function () {
  15073. this._disposeFacadeTexture();
  15074. var panel = new _2D_controls_stackPanel__WEBPACK_IMPORTED_MODULE_4__["StackPanel"]();
  15075. panel.isVertical = true;
  15076. if (this._imageUrl) {
  15077. var image = new _2D_controls_image__WEBPACK_IMPORTED_MODULE_5__["Image"]();
  15078. image.source = this._imageUrl;
  15079. image.paddingTop = "40px";
  15080. image.height = "180px";
  15081. image.width = "100px";
  15082. image.paddingBottom = "40px";
  15083. panel.addControl(image);
  15084. }
  15085. if (this._text) {
  15086. var text = new _2D_controls_textBlock__WEBPACK_IMPORTED_MODULE_6__["TextBlock"]();
  15087. text.text = this._text;
  15088. text.color = "white";
  15089. text.height = "30px";
  15090. text.fontSize = 24;
  15091. panel.addControl(text);
  15092. }
  15093. if (this._frontPlate) {
  15094. this.content = panel;
  15095. }
  15096. };
  15097. // Mesh association
  15098. HolographicButton.prototype._createNode = function (scene) {
  15099. this._backPlate = babylonjs_Materials_standardMaterial__WEBPACK_IMPORTED_MODULE_2__["BoxBuilder"].CreateBox(this.name + "BackMesh", {
  15100. width: 1.0,
  15101. height: 1.0,
  15102. depth: 0.08
  15103. }, scene);
  15104. this._frontPlate = babylonjs_Materials_standardMaterial__WEBPACK_IMPORTED_MODULE_2__["BoxBuilder"].CreateBox(this.name + "FrontMesh", {
  15105. width: 1.0,
  15106. height: 1.0,
  15107. depth: 0.08
  15108. }, scene);
  15109. this._frontPlate.parent = this._backPlate;
  15110. this._frontPlate.position.z = -0.08;
  15111. this._frontPlate.isPickable = false;
  15112. this._frontPlate.setEnabled(false);
  15113. this._textPlate = _super.prototype._createNode.call(this, scene);
  15114. this._textPlate.parent = this._backPlate;
  15115. this._textPlate.position.z = -0.08;
  15116. this._textPlate.isPickable = false;
  15117. return this._backPlate;
  15118. };
  15119. HolographicButton.prototype._applyFacade = function (facadeTexture) {
  15120. this._plateMaterial.emissiveTexture = facadeTexture;
  15121. this._plateMaterial.opacityTexture = facadeTexture;
  15122. };
  15123. HolographicButton.prototype._createBackMaterial = function (mesh) {
  15124. var _this = this;
  15125. this._backMaterial = new _materials_fluentMaterial__WEBPACK_IMPORTED_MODULE_3__["FluentMaterial"](this.name + "Back Material", mesh.getScene());
  15126. this._backMaterial.renderHoverLight = true;
  15127. this._pickedPointObserver = this._host.onPickedPointChangedObservable.add(function (pickedPoint) {
  15128. if (pickedPoint) {
  15129. _this._backMaterial.hoverPosition = pickedPoint;
  15130. _this._backMaterial.hoverColor.a = 1.0;
  15131. }
  15132. else {
  15133. _this._backMaterial.hoverColor.a = 0;
  15134. }
  15135. });
  15136. };
  15137. HolographicButton.prototype._createFrontMaterial = function (mesh) {
  15138. this._frontMaterial = new _materials_fluentMaterial__WEBPACK_IMPORTED_MODULE_3__["FluentMaterial"](this.name + "Front Material", mesh.getScene());
  15139. this._frontMaterial.innerGlowColorIntensity = 0; // No inner glow
  15140. this._frontMaterial.alpha = 0.5; // Additive
  15141. this._frontMaterial.renderBorders = true;
  15142. };
  15143. HolographicButton.prototype._createPlateMaterial = function (mesh) {
  15144. this._plateMaterial = new babylonjs_Materials_standardMaterial__WEBPACK_IMPORTED_MODULE_2__["StandardMaterial"](this.name + "Plate Material", mesh.getScene());
  15145. this._plateMaterial.specularColor = babylonjs_Materials_standardMaterial__WEBPACK_IMPORTED_MODULE_2__["Color3"].Black();
  15146. };
  15147. HolographicButton.prototype._affectMaterial = function (mesh) {
  15148. // Back
  15149. if (this._shareMaterials) {
  15150. if (!this._host._sharedMaterials["backFluentMaterial"]) {
  15151. this._createBackMaterial(mesh);
  15152. this._host._sharedMaterials["backFluentMaterial"] = this._backMaterial;
  15153. }
  15154. else {
  15155. this._backMaterial = this._host._sharedMaterials["backFluentMaterial"];
  15156. }
  15157. // Front
  15158. if (!this._host._sharedMaterials["frontFluentMaterial"]) {
  15159. this._createFrontMaterial(mesh);
  15160. this._host._sharedMaterials["frontFluentMaterial"] = this._frontMaterial;
  15161. }
  15162. else {
  15163. this._frontMaterial = this._host._sharedMaterials["frontFluentMaterial"];
  15164. }
  15165. }
  15166. else {
  15167. this._createBackMaterial(mesh);
  15168. this._createFrontMaterial(mesh);
  15169. }
  15170. this._createPlateMaterial(mesh);
  15171. this._backPlate.material = this._backMaterial;
  15172. this._frontPlate.material = this._frontMaterial;
  15173. this._textPlate.material = this._plateMaterial;
  15174. this._rebuildContent();
  15175. };
  15176. /**
  15177. * Releases all associated resources
  15178. */
  15179. HolographicButton.prototype.dispose = function () {
  15180. _super.prototype.dispose.call(this); // will dispose main mesh ie. back plate
  15181. this._disposeTooltip();
  15182. if (!this.shareMaterials) {
  15183. this._backMaterial.dispose();
  15184. this._frontMaterial.dispose();
  15185. this._plateMaterial.dispose();
  15186. if (this._pickedPointObserver) {
  15187. this._host.onPickedPointChangedObservable.remove(this._pickedPointObserver);
  15188. this._pickedPointObserver = null;
  15189. }
  15190. }
  15191. };
  15192. return HolographicButton;
  15193. }(_button3D__WEBPACK_IMPORTED_MODULE_1__["Button3D"]));
  15194. /***/ }),
  15195. /***/ "./3D/controls/index.ts":
  15196. /*!******************************!*\
  15197. !*** ./3D/controls/index.ts ***!
  15198. \******************************/
  15199. /*! exports provided: AbstractButton3D, Button3D, Container3D, Control3D, CylinderPanel, HolographicButton, MeshButton3D, PlanePanel, ScatterPanel, SpherePanel, StackPanel3D, VolumeBasedPanel */
  15200. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  15201. "use strict";
  15202. __webpack_require__.r(__webpack_exports__);
  15203. /* harmony import */ var _abstractButton3D__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./abstractButton3D */ "./3D/controls/abstractButton3D.ts");
  15204. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AbstractButton3D", function() { return _abstractButton3D__WEBPACK_IMPORTED_MODULE_0__["AbstractButton3D"]; });
  15205. /* harmony import */ var _button3D__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./button3D */ "./3D/controls/button3D.ts");
  15206. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Button3D", function() { return _button3D__WEBPACK_IMPORTED_MODULE_1__["Button3D"]; });
  15207. /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
  15208. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Container3D", function() { return _container3D__WEBPACK_IMPORTED_MODULE_2__["Container3D"]; });
  15209. /* harmony import */ var _control3D__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./control3D */ "./3D/controls/control3D.ts");
  15210. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Control3D", function() { return _control3D__WEBPACK_IMPORTED_MODULE_3__["Control3D"]; });
  15211. /* harmony import */ var _cylinderPanel__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./cylinderPanel */ "./3D/controls/cylinderPanel.ts");
  15212. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "CylinderPanel", function() { return _cylinderPanel__WEBPACK_IMPORTED_MODULE_4__["CylinderPanel"]; });
  15213. /* harmony import */ var _holographicButton__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./holographicButton */ "./3D/controls/holographicButton.ts");
  15214. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "HolographicButton", function() { return _holographicButton__WEBPACK_IMPORTED_MODULE_5__["HolographicButton"]; });
  15215. /* harmony import */ var _meshButton3D__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./meshButton3D */ "./3D/controls/meshButton3D.ts");
  15216. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MeshButton3D", function() { return _meshButton3D__WEBPACK_IMPORTED_MODULE_6__["MeshButton3D"]; });
  15217. /* harmony import */ var _planePanel__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./planePanel */ "./3D/controls/planePanel.ts");
  15218. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "PlanePanel", function() { return _planePanel__WEBPACK_IMPORTED_MODULE_7__["PlanePanel"]; });
  15219. /* harmony import */ var _scatterPanel__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./scatterPanel */ "./3D/controls/scatterPanel.ts");
  15220. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ScatterPanel", function() { return _scatterPanel__WEBPACK_IMPORTED_MODULE_8__["ScatterPanel"]; });
  15221. /* harmony import */ var _spherePanel__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./spherePanel */ "./3D/controls/spherePanel.ts");
  15222. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SpherePanel", function() { return _spherePanel__WEBPACK_IMPORTED_MODULE_9__["SpherePanel"]; });
  15223. /* harmony import */ var _stackPanel3D__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./stackPanel3D */ "./3D/controls/stackPanel3D.ts");
  15224. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "StackPanel3D", function() { return _stackPanel3D__WEBPACK_IMPORTED_MODULE_10__["StackPanel3D"]; });
  15225. /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
  15226. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "VolumeBasedPanel", function() { return _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_11__["VolumeBasedPanel"]; });
  15227. /***/ }),
  15228. /***/ "./3D/controls/meshButton3D.ts":
  15229. /*!*************************************!*\
  15230. !*** ./3D/controls/meshButton3D.ts ***!
  15231. \*************************************/
  15232. /*! exports provided: MeshButton3D */
  15233. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  15234. "use strict";
  15235. __webpack_require__.r(__webpack_exports__);
  15236. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MeshButton3D", function() { return MeshButton3D; });
  15237. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  15238. /* harmony import */ var _button3D__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./button3D */ "./3D/controls/button3D.ts");
  15239. /**
  15240. * Class used to create an interactable object. It's a 3D button using a mesh coming from the current scene
  15241. */
  15242. var MeshButton3D = /** @class */ (function (_super) {
  15243. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(MeshButton3D, _super);
  15244. /**
  15245. * Creates a new 3D button based on a mesh
  15246. * @param mesh mesh to become a 3D button
  15247. * @param name defines the control name
  15248. */
  15249. function MeshButton3D(mesh, name) {
  15250. var _this = _super.call(this, name) || this;
  15251. _this._currentMesh = mesh;
  15252. /**
  15253. * Provides a default behavior on hover/out & up/down
  15254. * Override those function to create your own desired behavior specific to your mesh
  15255. */
  15256. _this.pointerEnterAnimation = function () {
  15257. if (!_this.mesh) {
  15258. return;
  15259. }
  15260. _this.mesh.scaling.scaleInPlace(1.1);
  15261. };
  15262. _this.pointerOutAnimation = function () {
  15263. if (!_this.mesh) {
  15264. return;
  15265. }
  15266. _this.mesh.scaling.scaleInPlace(1.0 / 1.1);
  15267. };
  15268. _this.pointerDownAnimation = function () {
  15269. if (!_this.mesh) {
  15270. return;
  15271. }
  15272. _this.mesh.scaling.scaleInPlace(0.95);
  15273. };
  15274. _this.pointerUpAnimation = function () {
  15275. if (!_this.mesh) {
  15276. return;
  15277. }
  15278. _this.mesh.scaling.scaleInPlace(1.0 / 0.95);
  15279. };
  15280. return _this;
  15281. }
  15282. MeshButton3D.prototype._getTypeName = function () {
  15283. return "MeshButton3D";
  15284. };
  15285. // Mesh association
  15286. MeshButton3D.prototype._createNode = function (scene) {
  15287. var _this = this;
  15288. this._currentMesh.getChildMeshes().forEach(function (mesh) {
  15289. mesh.metadata = _this;
  15290. });
  15291. return this._currentMesh;
  15292. };
  15293. MeshButton3D.prototype._affectMaterial = function (mesh) {
  15294. };
  15295. return MeshButton3D;
  15296. }(_button3D__WEBPACK_IMPORTED_MODULE_1__["Button3D"]));
  15297. /***/ }),
  15298. /***/ "./3D/controls/planePanel.ts":
  15299. /*!***********************************!*\
  15300. !*** ./3D/controls/planePanel.ts ***!
  15301. \***********************************/
  15302. /*! exports provided: PlanePanel */
  15303. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  15304. "use strict";
  15305. __webpack_require__.r(__webpack_exports__);
  15306. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PlanePanel", function() { return PlanePanel; });
  15307. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  15308. /* harmony import */ var babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math.vector */ "babylonjs/Maths/math.vector");
  15309. /* harmony import */ var babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__);
  15310. /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
  15311. /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
  15312. /**
  15313. * Class used to create a container panel deployed on the surface of a plane
  15314. */
  15315. var PlanePanel = /** @class */ (function (_super) {
  15316. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(PlanePanel, _super);
  15317. function PlanePanel() {
  15318. return _super !== null && _super.apply(this, arguments) || this;
  15319. }
  15320. PlanePanel.prototype._mapGridNode = function (control, nodePosition) {
  15321. var mesh = control.mesh;
  15322. if (!mesh) {
  15323. return;
  15324. }
  15325. control.position = nodePosition.clone();
  15326. var target = babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["TmpVectors"].Vector3[0];
  15327. target.copyFrom(nodePosition);
  15328. switch (this.orientation) {
  15329. case _container3D__WEBPACK_IMPORTED_MODULE_2__["Container3D"].FACEORIGIN_ORIENTATION:
  15330. case _container3D__WEBPACK_IMPORTED_MODULE_2__["Container3D"].FACEFORWARD_ORIENTATION:
  15331. target.addInPlace(new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["Vector3"](0, 0, 1));
  15332. mesh.lookAt(target);
  15333. break;
  15334. case _container3D__WEBPACK_IMPORTED_MODULE_2__["Container3D"].FACEFORWARDREVERSED_ORIENTATION:
  15335. case _container3D__WEBPACK_IMPORTED_MODULE_2__["Container3D"].FACEORIGINREVERSED_ORIENTATION:
  15336. target.addInPlace(new babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["Vector3"](0, 0, -1));
  15337. mesh.lookAt(target);
  15338. break;
  15339. }
  15340. };
  15341. return PlanePanel;
  15342. }(_volumeBasedPanel__WEBPACK_IMPORTED_MODULE_3__["VolumeBasedPanel"]));
  15343. /***/ }),
  15344. /***/ "./3D/controls/scatterPanel.ts":
  15345. /*!*************************************!*\
  15346. !*** ./3D/controls/scatterPanel.ts ***!
  15347. \*************************************/
  15348. /*! exports provided: ScatterPanel */
  15349. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  15350. "use strict";
  15351. __webpack_require__.r(__webpack_exports__);
  15352. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ScatterPanel", function() { return ScatterPanel; });
  15353. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  15354. /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Maths/math.vector");
  15355. /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
  15356. /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
  15357. /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
  15358. /**
  15359. * Class used to create a container panel where items get randomized planar mapping
  15360. */
  15361. var ScatterPanel = /** @class */ (function (_super) {
  15362. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(ScatterPanel, _super);
  15363. function ScatterPanel() {
  15364. var _this = _super !== null && _super.apply(this, arguments) || this;
  15365. _this._iteration = 100.0;
  15366. return _this;
  15367. }
  15368. Object.defineProperty(ScatterPanel.prototype, "iteration", {
  15369. /**
  15370. * Gets or sets the number of iteration to use to scatter the controls (100 by default)
  15371. */
  15372. get: function () {
  15373. return this._iteration;
  15374. },
  15375. set: function (value) {
  15376. var _this = this;
  15377. if (this._iteration === value) {
  15378. return;
  15379. }
  15380. this._iteration = value;
  15381. babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Tools"].SetImmediate(function () {
  15382. _this._arrangeChildren();
  15383. });
  15384. },
  15385. enumerable: false,
  15386. configurable: true
  15387. });
  15388. ScatterPanel.prototype._mapGridNode = function (control, nodePosition) {
  15389. var mesh = control.mesh;
  15390. var newPos = this._scatterMapping(nodePosition);
  15391. if (!mesh) {
  15392. return;
  15393. }
  15394. switch (this.orientation) {
  15395. case _container3D__WEBPACK_IMPORTED_MODULE_3__["Container3D"].FACEORIGIN_ORIENTATION:
  15396. case _container3D__WEBPACK_IMPORTED_MODULE_3__["Container3D"].FACEFORWARD_ORIENTATION:
  15397. mesh.lookAt(new babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Vector3"](0, 0, 1));
  15398. break;
  15399. case _container3D__WEBPACK_IMPORTED_MODULE_3__["Container3D"].FACEFORWARDREVERSED_ORIENTATION:
  15400. case _container3D__WEBPACK_IMPORTED_MODULE_3__["Container3D"].FACEORIGINREVERSED_ORIENTATION:
  15401. mesh.lookAt(new babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Vector3"](0, 0, -1));
  15402. break;
  15403. }
  15404. control.position = newPos;
  15405. };
  15406. ScatterPanel.prototype._scatterMapping = function (source) {
  15407. source.x = (1.0 - Math.random() * 2.0) * this._cellWidth;
  15408. source.y = (1.0 - Math.random() * 2.0) * this._cellHeight;
  15409. return source;
  15410. };
  15411. ScatterPanel.prototype._finalProcessing = function () {
  15412. var meshes = [];
  15413. for (var _i = 0, _a = this._children; _i < _a.length; _i++) {
  15414. var child = _a[_i];
  15415. if (!child.mesh) {
  15416. continue;
  15417. }
  15418. meshes.push(child.mesh);
  15419. }
  15420. for (var count = 0; count < this._iteration; count++) {
  15421. meshes.sort(function (a, b) {
  15422. var distance1 = a.position.lengthSquared();
  15423. var distance2 = b.position.lengthSquared();
  15424. if (distance1 < distance2) {
  15425. return 1;
  15426. }
  15427. else if (distance1 > distance2) {
  15428. return -1;
  15429. }
  15430. return 0;
  15431. });
  15432. var radiusPaddingSquared = Math.pow(this.margin, 2.0);
  15433. var cellSize = Math.max(this._cellWidth, this._cellHeight);
  15434. var difference2D = babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["TmpVectors"].Vector2[0];
  15435. var difference = babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["TmpVectors"].Vector3[0];
  15436. for (var i = 0; i < meshes.length - 1; i++) {
  15437. for (var j = i + 1; j < meshes.length; j++) {
  15438. if (i != j) {
  15439. meshes[j].position.subtractToRef(meshes[i].position, difference);
  15440. // Ignore Z axis
  15441. difference2D.x = difference.x;
  15442. difference2D.y = difference.y;
  15443. var combinedRadius = cellSize;
  15444. var distance = difference2D.lengthSquared() - radiusPaddingSquared;
  15445. var minSeparation = Math.min(distance, radiusPaddingSquared);
  15446. distance -= minSeparation;
  15447. if (distance < (Math.pow(combinedRadius, 2.0))) {
  15448. difference2D.normalize();
  15449. difference.scaleInPlace((combinedRadius - Math.sqrt(distance)) * 0.5);
  15450. meshes[j].position.addInPlace(difference);
  15451. meshes[i].position.subtractInPlace(difference);
  15452. }
  15453. }
  15454. }
  15455. }
  15456. }
  15457. };
  15458. return ScatterPanel;
  15459. }(_volumeBasedPanel__WEBPACK_IMPORTED_MODULE_2__["VolumeBasedPanel"]));
  15460. /***/ }),
  15461. /***/ "./3D/controls/spherePanel.ts":
  15462. /*!************************************!*\
  15463. !*** ./3D/controls/spherePanel.ts ***!
  15464. \************************************/
  15465. /*! exports provided: SpherePanel */
  15466. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  15467. "use strict";
  15468. __webpack_require__.r(__webpack_exports__);
  15469. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SpherePanel", function() { return SpherePanel; });
  15470. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  15471. /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Maths/math.vector");
  15472. /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
  15473. /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
  15474. /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
  15475. /**
  15476. * Class used to create a container panel deployed on the surface of a sphere
  15477. */
  15478. var SpherePanel = /** @class */ (function (_super) {
  15479. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(SpherePanel, _super);
  15480. function SpherePanel() {
  15481. var _this = _super !== null && _super.apply(this, arguments) || this;
  15482. _this._radius = 5.0;
  15483. return _this;
  15484. }
  15485. Object.defineProperty(SpherePanel.prototype, "radius", {
  15486. /**
  15487. * Gets or sets the radius of the sphere where to project controls (5 by default)
  15488. */
  15489. get: function () {
  15490. return this._radius;
  15491. },
  15492. set: function (value) {
  15493. var _this = this;
  15494. if (this._radius === value) {
  15495. return;
  15496. }
  15497. this._radius = value;
  15498. babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Tools"].SetImmediate(function () {
  15499. _this._arrangeChildren();
  15500. });
  15501. },
  15502. enumerable: false,
  15503. configurable: true
  15504. });
  15505. SpherePanel.prototype._mapGridNode = function (control, nodePosition) {
  15506. var mesh = control.mesh;
  15507. if (!mesh) {
  15508. return;
  15509. }
  15510. var newPos = this._sphericalMapping(nodePosition);
  15511. control.position = newPos;
  15512. switch (this.orientation) {
  15513. case _container3D__WEBPACK_IMPORTED_MODULE_3__["Container3D"].FACEORIGIN_ORIENTATION:
  15514. mesh.lookAt(new babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Vector3"](2 * newPos.x, 2 * newPos.y, 2 * newPos.z));
  15515. break;
  15516. case _container3D__WEBPACK_IMPORTED_MODULE_3__["Container3D"].FACEORIGINREVERSED_ORIENTATION:
  15517. mesh.lookAt(new babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Vector3"](-newPos.x, -newPos.y, -newPos.z));
  15518. break;
  15519. case _container3D__WEBPACK_IMPORTED_MODULE_3__["Container3D"].FACEFORWARD_ORIENTATION:
  15520. break;
  15521. case _container3D__WEBPACK_IMPORTED_MODULE_3__["Container3D"].FACEFORWARDREVERSED_ORIENTATION:
  15522. mesh.rotate(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Axis"].Y, Math.PI, babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Space"].LOCAL);
  15523. break;
  15524. }
  15525. };
  15526. SpherePanel.prototype._sphericalMapping = function (source) {
  15527. var newPos = new babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Vector3"](0, 0, this._radius);
  15528. var xAngle = (source.y / this._radius);
  15529. var yAngle = -(source.x / this._radius);
  15530. babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Matrix"].RotationYawPitchRollToRef(yAngle, xAngle, 0, babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["TmpVectors"].Matrix[0]);
  15531. return babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Vector3"].TransformNormal(newPos, babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["TmpVectors"].Matrix[0]);
  15532. };
  15533. return SpherePanel;
  15534. }(_volumeBasedPanel__WEBPACK_IMPORTED_MODULE_2__["VolumeBasedPanel"]));
  15535. /***/ }),
  15536. /***/ "./3D/controls/stackPanel3D.ts":
  15537. /*!*************************************!*\
  15538. !*** ./3D/controls/stackPanel3D.ts ***!
  15539. \*************************************/
  15540. /*! exports provided: StackPanel3D */
  15541. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  15542. "use strict";
  15543. __webpack_require__.r(__webpack_exports__);
  15544. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "StackPanel3D", function() { return StackPanel3D; });
  15545. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  15546. /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Maths/math.vector");
  15547. /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
  15548. /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
  15549. /**
  15550. * Class used to create a stack panel in 3D on XY plane
  15551. */
  15552. var StackPanel3D = /** @class */ (function (_super) {
  15553. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(StackPanel3D, _super);
  15554. /**
  15555. * Creates new StackPanel
  15556. * @param isVertical
  15557. */
  15558. function StackPanel3D(isVertical) {
  15559. if (isVertical === void 0) { isVertical = false; }
  15560. var _this = _super.call(this) || this;
  15561. _this._isVertical = false;
  15562. /**
  15563. * Gets or sets the distance between elements
  15564. */
  15565. _this.margin = 0.1;
  15566. _this._isVertical = isVertical;
  15567. return _this;
  15568. }
  15569. Object.defineProperty(StackPanel3D.prototype, "isVertical", {
  15570. /**
  15571. * Gets or sets a boolean indicating if the stack panel is vertical or horizontal (horizontal by default)
  15572. */
  15573. get: function () {
  15574. return this._isVertical;
  15575. },
  15576. set: function (value) {
  15577. var _this = this;
  15578. if (this._isVertical === value) {
  15579. return;
  15580. }
  15581. this._isVertical = value;
  15582. babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Tools"].SetImmediate(function () {
  15583. _this._arrangeChildren();
  15584. });
  15585. },
  15586. enumerable: false,
  15587. configurable: true
  15588. });
  15589. StackPanel3D.prototype._arrangeChildren = function () {
  15590. var width = 0;
  15591. var height = 0;
  15592. var controlCount = 0;
  15593. var extendSizes = [];
  15594. var currentInverseWorld = babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Matrix"].Invert(this.node.computeWorldMatrix(true));
  15595. // Measure
  15596. for (var _i = 0, _a = this._children; _i < _a.length; _i++) {
  15597. var child = _a[_i];
  15598. if (!child.mesh) {
  15599. continue;
  15600. }
  15601. controlCount++;
  15602. child.mesh.computeWorldMatrix(true);
  15603. child.mesh.getWorldMatrix().multiplyToRef(currentInverseWorld, babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["TmpVectors"].Matrix[0]);
  15604. var boundingBox = child.mesh.getBoundingInfo().boundingBox;
  15605. var extendSize = babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Vector3"].TransformNormal(boundingBox.extendSize, babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["TmpVectors"].Matrix[0]);
  15606. extendSizes.push(extendSize);
  15607. if (this._isVertical) {
  15608. height += extendSize.y;
  15609. }
  15610. else {
  15611. width += extendSize.x;
  15612. }
  15613. }
  15614. if (this._isVertical) {
  15615. height += (controlCount - 1) * this.margin / 2;
  15616. }
  15617. else {
  15618. width += (controlCount - 1) * this.margin / 2;
  15619. }
  15620. // Arrange
  15621. var offset;
  15622. if (this._isVertical) {
  15623. offset = -height;
  15624. }
  15625. else {
  15626. offset = -width;
  15627. }
  15628. var index = 0;
  15629. for (var _b = 0, _c = this._children; _b < _c.length; _b++) {
  15630. var child = _c[_b];
  15631. if (!child.mesh) {
  15632. continue;
  15633. }
  15634. controlCount--;
  15635. var extendSize = extendSizes[index++];
  15636. if (this._isVertical) {
  15637. child.position.y = offset + extendSize.y;
  15638. child.position.x = 0;
  15639. offset += extendSize.y * 2;
  15640. }
  15641. else {
  15642. child.position.x = offset + extendSize.x;
  15643. child.position.y = 0;
  15644. offset += extendSize.x * 2;
  15645. }
  15646. offset += (controlCount > 0 ? this.margin : 0);
  15647. }
  15648. };
  15649. return StackPanel3D;
  15650. }(_container3D__WEBPACK_IMPORTED_MODULE_2__["Container3D"]));
  15651. /***/ }),
  15652. /***/ "./3D/controls/volumeBasedPanel.ts":
  15653. /*!*****************************************!*\
  15654. !*** ./3D/controls/volumeBasedPanel.ts ***!
  15655. \*****************************************/
  15656. /*! exports provided: VolumeBasedPanel */
  15657. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  15658. "use strict";
  15659. __webpack_require__.r(__webpack_exports__);
  15660. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "VolumeBasedPanel", function() { return VolumeBasedPanel; });
  15661. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  15662. /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Maths/math.vector");
  15663. /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
  15664. /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
  15665. /**
  15666. * Abstract class used to create a container panel deployed on the surface of a volume
  15667. */
  15668. var VolumeBasedPanel = /** @class */ (function (_super) {
  15669. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(VolumeBasedPanel, _super);
  15670. /**
  15671. * Creates new VolumeBasedPanel
  15672. */
  15673. function VolumeBasedPanel() {
  15674. var _this = _super.call(this) || this;
  15675. _this._columns = 10;
  15676. _this._rows = 0;
  15677. _this._rowThenColum = true;
  15678. _this._orientation = _container3D__WEBPACK_IMPORTED_MODULE_2__["Container3D"].FACEORIGIN_ORIENTATION;
  15679. /**
  15680. * Gets or sets the distance between elements
  15681. */
  15682. _this.margin = 0;
  15683. return _this;
  15684. }
  15685. Object.defineProperty(VolumeBasedPanel.prototype, "orientation", {
  15686. /**
  15687. * Gets or sets the orientation to apply to all controls (BABYLON.Container3D.FaceOriginReversedOrientation by default)
  15688. * | Value | Type | Description |
  15689. * | ----- | ----------------------------------- | ----------- |
  15690. * | 0 | UNSET_ORIENTATION | Control rotation will remain unchanged |
  15691. * | 1 | FACEORIGIN_ORIENTATION | Control will rotate to make it look at sphere central axis |
  15692. * | 2 | FACEORIGINREVERSED_ORIENTATION | Control will rotate to make it look back at sphere central axis |
  15693. * | 3 | FACEFORWARD_ORIENTATION | Control will rotate to look at z axis (0, 0, 1) |
  15694. * | 4 | FACEFORWARDREVERSED_ORIENTATION | Control will rotate to look at negative z axis (0, 0, -1) |
  15695. */
  15696. get: function () {
  15697. return this._orientation;
  15698. },
  15699. set: function (value) {
  15700. var _this = this;
  15701. if (this._orientation === value) {
  15702. return;
  15703. }
  15704. this._orientation = value;
  15705. babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Tools"].SetImmediate(function () {
  15706. _this._arrangeChildren();
  15707. });
  15708. },
  15709. enumerable: false,
  15710. configurable: true
  15711. });
  15712. Object.defineProperty(VolumeBasedPanel.prototype, "columns", {
  15713. /**
  15714. * Gets or sets the number of columns requested (10 by default).
  15715. * The panel will automatically compute the number of rows based on number of child controls.
  15716. */
  15717. get: function () {
  15718. return this._columns;
  15719. },
  15720. set: function (value) {
  15721. var _this = this;
  15722. if (this._columns === value) {
  15723. return;
  15724. }
  15725. this._columns = value;
  15726. this._rowThenColum = true;
  15727. babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Tools"].SetImmediate(function () {
  15728. _this._arrangeChildren();
  15729. });
  15730. },
  15731. enumerable: false,
  15732. configurable: true
  15733. });
  15734. Object.defineProperty(VolumeBasedPanel.prototype, "rows", {
  15735. /**
  15736. * Gets or sets a the number of rows requested.
  15737. * The panel will automatically compute the number of columns based on number of child controls.
  15738. */
  15739. get: function () {
  15740. return this._rows;
  15741. },
  15742. set: function (value) {
  15743. var _this = this;
  15744. if (this._rows === value) {
  15745. return;
  15746. }
  15747. this._rows = value;
  15748. this._rowThenColum = false;
  15749. babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Tools"].SetImmediate(function () {
  15750. _this._arrangeChildren();
  15751. });
  15752. },
  15753. enumerable: false,
  15754. configurable: true
  15755. });
  15756. VolumeBasedPanel.prototype._arrangeChildren = function () {
  15757. this._cellWidth = 0;
  15758. this._cellHeight = 0;
  15759. var rows = 0;
  15760. var columns = 0;
  15761. var controlCount = 0;
  15762. var currentInverseWorld = babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Matrix"].Invert(this.node.computeWorldMatrix(true));
  15763. // Measure
  15764. for (var _i = 0, _a = this._children; _i < _a.length; _i++) {
  15765. var child = _a[_i];
  15766. if (!child.mesh) {
  15767. continue;
  15768. }
  15769. controlCount++;
  15770. child.mesh.computeWorldMatrix(true);
  15771. // child.mesh.getWorldMatrix().multiplyToRef(currentInverseWorld, Tmp.Matrix[0]);
  15772. var boundingBox = child.mesh.getHierarchyBoundingVectors();
  15773. var extendSize = babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["TmpVectors"].Vector3[0];
  15774. var diff = babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["TmpVectors"].Vector3[1];
  15775. boundingBox.max.subtractToRef(boundingBox.min, diff);
  15776. diff.scaleInPlace(0.5);
  15777. babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Vector3"].TransformNormalToRef(diff, currentInverseWorld, extendSize);
  15778. this._cellWidth = Math.max(this._cellWidth, extendSize.x * 2);
  15779. this._cellHeight = Math.max(this._cellHeight, extendSize.y * 2);
  15780. }
  15781. this._cellWidth += this.margin * 2;
  15782. this._cellHeight += this.margin * 2;
  15783. // Arrange
  15784. if (this._rowThenColum) {
  15785. columns = this._columns;
  15786. rows = Math.ceil(controlCount / this._columns);
  15787. }
  15788. else {
  15789. rows = this._rows;
  15790. columns = Math.ceil(controlCount / this._rows);
  15791. }
  15792. var startOffsetX = (columns * 0.5) * this._cellWidth;
  15793. var startOffsetY = (rows * 0.5) * this._cellHeight;
  15794. var nodeGrid = [];
  15795. var cellCounter = 0;
  15796. if (this._rowThenColum) {
  15797. for (var r = 0; r < rows; r++) {
  15798. for (var c = 0; c < columns; c++) {
  15799. nodeGrid.push(new babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Vector3"]((c * this._cellWidth) - startOffsetX + this._cellWidth / 2, (r * this._cellHeight) - startOffsetY + this._cellHeight / 2, 0));
  15800. cellCounter++;
  15801. if (cellCounter > controlCount) {
  15802. break;
  15803. }
  15804. }
  15805. }
  15806. }
  15807. else {
  15808. for (var c = 0; c < columns; c++) {
  15809. for (var r = 0; r < rows; r++) {
  15810. nodeGrid.push(new babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__["Vector3"]((c * this._cellWidth) - startOffsetX + this._cellWidth / 2, (r * this._cellHeight) - startOffsetY + this._cellHeight / 2, 0));
  15811. cellCounter++;
  15812. if (cellCounter > controlCount) {
  15813. break;
  15814. }
  15815. }
  15816. }
  15817. }
  15818. cellCounter = 0;
  15819. for (var _b = 0, _c = this._children; _b < _c.length; _b++) {
  15820. var child = _c[_b];
  15821. if (!child.mesh) {
  15822. continue;
  15823. }
  15824. this._mapGridNode(child, nodeGrid[cellCounter]);
  15825. cellCounter++;
  15826. }
  15827. this._finalProcessing();
  15828. };
  15829. /** Child classes can implement this function to provide additional processing */
  15830. VolumeBasedPanel.prototype._finalProcessing = function () {
  15831. };
  15832. return VolumeBasedPanel;
  15833. }(_container3D__WEBPACK_IMPORTED_MODULE_2__["Container3D"]));
  15834. /***/ }),
  15835. /***/ "./3D/gui3DManager.ts":
  15836. /*!****************************!*\
  15837. !*** ./3D/gui3DManager.ts ***!
  15838. \****************************/
  15839. /*! exports provided: GUI3DManager */
  15840. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  15841. "use strict";
  15842. __webpack_require__.r(__webpack_exports__);
  15843. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "GUI3DManager", function() { return GUI3DManager; });
  15844. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math.vector");
  15845. /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
  15846. /* harmony import */ var _controls_container3D__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./controls/container3D */ "./3D/controls/container3D.ts");
  15847. /**
  15848. * Class used to manage 3D user interface
  15849. * @see https://doc.babylonjs.com/how_to/gui3d
  15850. */
  15851. var GUI3DManager = /** @class */ (function () {
  15852. /**
  15853. * Creates a new GUI3DManager
  15854. * @param scene
  15855. */
  15856. function GUI3DManager(scene) {
  15857. var _this = this;
  15858. /** @hidden */
  15859. this._lastControlOver = {};
  15860. /** @hidden */
  15861. this._lastControlDown = {};
  15862. /**
  15863. * Observable raised when the point picked by the pointer events changed
  15864. */
  15865. this.onPickedPointChangedObservable = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Observable"]();
  15866. // Shared resources
  15867. /** @hidden */
  15868. this._sharedMaterials = {};
  15869. this._scene = scene || babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["EngineStore"].LastCreatedScene;
  15870. this._sceneDisposeObserver = this._scene.onDisposeObservable.add(function () {
  15871. _this._sceneDisposeObserver = null;
  15872. _this._utilityLayer = null;
  15873. _this.dispose();
  15874. });
  15875. this._utilityLayer = new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["UtilityLayerRenderer"](this._scene);
  15876. this._utilityLayer.onlyCheckPointerDownEvents = false;
  15877. this._utilityLayer.pickUtilitySceneFirst = false;
  15878. this._utilityLayer.mainSceneTrackerPredicate = function (mesh) {
  15879. return mesh && mesh.metadata && mesh.metadata._node;
  15880. };
  15881. // Root
  15882. this._rootContainer = new _controls_container3D__WEBPACK_IMPORTED_MODULE_1__["Container3D"]("RootContainer");
  15883. this._rootContainer._host = this;
  15884. var utilityLayerScene = this._utilityLayer.utilityLayerScene;
  15885. // Events
  15886. this._pointerOutObserver = this._utilityLayer.onPointerOutObservable.add(function (pointerId) {
  15887. _this._handlePointerOut(pointerId, true);
  15888. });
  15889. this._pointerObserver = utilityLayerScene.onPointerObservable.add(function (pi, state) {
  15890. _this._doPicking(pi);
  15891. });
  15892. // Scene
  15893. this._utilityLayer.utilityLayerScene.autoClear = false;
  15894. this._utilityLayer.utilityLayerScene.autoClearDepthAndStencil = false;
  15895. new babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["HemisphericLight"]("hemi", babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["Vector3"].Up(), this._utilityLayer.utilityLayerScene);
  15896. }
  15897. Object.defineProperty(GUI3DManager.prototype, "scene", {
  15898. /** Gets the hosting scene */
  15899. get: function () {
  15900. return this._scene;
  15901. },
  15902. enumerable: false,
  15903. configurable: true
  15904. });
  15905. Object.defineProperty(GUI3DManager.prototype, "utilityLayer", {
  15906. /** Gets associated utility layer */
  15907. get: function () {
  15908. return this._utilityLayer;
  15909. },
  15910. enumerable: false,
  15911. configurable: true
  15912. });
  15913. GUI3DManager.prototype._handlePointerOut = function (pointerId, isPointerUp) {
  15914. var previousControlOver = this._lastControlOver[pointerId];
  15915. if (previousControlOver) {
  15916. previousControlOver._onPointerOut(previousControlOver);
  15917. delete this._lastControlOver[pointerId];
  15918. }
  15919. if (isPointerUp) {
  15920. if (this._lastControlDown[pointerId]) {
  15921. this._lastControlDown[pointerId].forcePointerUp();
  15922. delete this._lastControlDown[pointerId];
  15923. }
  15924. }
  15925. this.onPickedPointChangedObservable.notifyObservers(null);
  15926. };
  15927. GUI3DManager.prototype._doPicking = function (pi) {
  15928. if (!this._utilityLayer || !this._utilityLayer.shouldRender || !this._utilityLayer.utilityLayerScene.activeCamera) {
  15929. return false;
  15930. }
  15931. var pointerEvent = (pi.event);
  15932. var pointerId = pointerEvent.pointerId || 0;
  15933. var buttonIndex = pointerEvent.button;
  15934. var pickingInfo = pi.pickInfo;
  15935. if (!pickingInfo || !pickingInfo.hit) {
  15936. this._handlePointerOut(pointerId, pi.type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["PointerEventTypes"].POINTERUP);
  15937. return false;
  15938. }
  15939. var control = (pickingInfo.pickedMesh.metadata);
  15940. if (pickingInfo.pickedPoint) {
  15941. this.onPickedPointChangedObservable.notifyObservers(pickingInfo.pickedPoint);
  15942. }
  15943. if (!control._processObservables(pi.type, pickingInfo.pickedPoint, pointerId, buttonIndex)) {
  15944. if (pi.type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["PointerEventTypes"].POINTERMOVE) {
  15945. if (this._lastControlOver[pointerId]) {
  15946. this._lastControlOver[pointerId]._onPointerOut(this._lastControlOver[pointerId]);
  15947. }
  15948. delete this._lastControlOver[pointerId];
  15949. }
  15950. }
  15951. if (pi.type === babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__["PointerEventTypes"].POINTERUP) {
  15952. if (this._lastControlDown[pointerEvent.pointerId]) {
  15953. this._lastControlDown[pointerEvent.pointerId].forcePointerUp();
  15954. delete this._lastControlDown[pointerEvent.pointerId];
  15955. }
  15956. if (pointerEvent.pointerType === "touch") {
  15957. this._handlePointerOut(pointerId, false);
  15958. }
  15959. }
  15960. return true;
  15961. };
  15962. Object.defineProperty(GUI3DManager.prototype, "rootContainer", {
  15963. /**
  15964. * Gets the root container
  15965. */
  15966. get: function () {
  15967. return this._rootContainer;
  15968. },
  15969. enumerable: false,
  15970. configurable: true
  15971. });
  15972. /**
  15973. * Gets a boolean indicating if the given control is in the root child list
  15974. * @param control defines the control to check
  15975. * @returns true if the control is in the root child list
  15976. */
  15977. GUI3DManager.prototype.containsControl = function (control) {
  15978. return this._rootContainer.containsControl(control);
  15979. };
  15980. /**
  15981. * Adds a control to the root child list
  15982. * @param control defines the control to add
  15983. * @returns the current manager
  15984. */
  15985. GUI3DManager.prototype.addControl = function (control) {
  15986. this._rootContainer.addControl(control);
  15987. return this;
  15988. };
  15989. /**
  15990. * Removes a control from the root child list
  15991. * @param control defines the control to remove
  15992. * @returns the current container
  15993. */
  15994. GUI3DManager.prototype.removeControl = function (control) {
  15995. this._rootContainer.removeControl(control);
  15996. return this;
  15997. };
  15998. /**
  15999. * Releases all associated resources
  16000. */
  16001. GUI3DManager.prototype.dispose = function () {
  16002. this._rootContainer.dispose();
  16003. for (var materialName in this._sharedMaterials) {
  16004. if (!this._sharedMaterials.hasOwnProperty(materialName)) {
  16005. continue;
  16006. }
  16007. this._sharedMaterials[materialName].dispose();
  16008. }
  16009. this._sharedMaterials = {};
  16010. if (this._pointerOutObserver && this._utilityLayer) {
  16011. this._utilityLayer.onPointerOutObservable.remove(this._pointerOutObserver);
  16012. this._pointerOutObserver = null;
  16013. }
  16014. this.onPickedPointChangedObservable.clear();
  16015. var utilityLayerScene = this._utilityLayer ? this._utilityLayer.utilityLayerScene : null;
  16016. if (utilityLayerScene) {
  16017. if (this._pointerObserver) {
  16018. utilityLayerScene.onPointerObservable.remove(this._pointerObserver);
  16019. this._pointerObserver = null;
  16020. }
  16021. }
  16022. if (this._scene) {
  16023. if (this._sceneDisposeObserver) {
  16024. this._scene.onDisposeObservable.remove(this._sceneDisposeObserver);
  16025. this._sceneDisposeObserver = null;
  16026. }
  16027. }
  16028. if (this._utilityLayer) {
  16029. this._utilityLayer.dispose();
  16030. }
  16031. };
  16032. return GUI3DManager;
  16033. }());
  16034. /***/ }),
  16035. /***/ "./3D/index.ts":
  16036. /*!*********************!*\
  16037. !*** ./3D/index.ts ***!
  16038. \*********************/
  16039. /*! exports provided: AbstractButton3D, Button3D, Container3D, Control3D, CylinderPanel, HolographicButton, MeshButton3D, PlanePanel, ScatterPanel, SpherePanel, StackPanel3D, VolumeBasedPanel, FluentMaterialDefines, FluentMaterial, GUI3DManager, Vector3WithInfo */
  16040. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  16041. "use strict";
  16042. __webpack_require__.r(__webpack_exports__);
  16043. /* harmony import */ var _controls__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./controls */ "./3D/controls/index.ts");
  16044. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AbstractButton3D", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["AbstractButton3D"]; });
  16045. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Button3D", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["Button3D"]; });
  16046. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Container3D", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["Container3D"]; });
  16047. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Control3D", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["Control3D"]; });
  16048. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "CylinderPanel", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["CylinderPanel"]; });
  16049. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "HolographicButton", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["HolographicButton"]; });
  16050. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MeshButton3D", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["MeshButton3D"]; });
  16051. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "PlanePanel", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["PlanePanel"]; });
  16052. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ScatterPanel", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["ScatterPanel"]; });
  16053. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SpherePanel", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["SpherePanel"]; });
  16054. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "StackPanel3D", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["StackPanel3D"]; });
  16055. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "VolumeBasedPanel", function() { return _controls__WEBPACK_IMPORTED_MODULE_0__["VolumeBasedPanel"]; });
  16056. /* harmony import */ var _materials__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./materials */ "./3D/materials/index.ts");
  16057. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "FluentMaterialDefines", function() { return _materials__WEBPACK_IMPORTED_MODULE_1__["FluentMaterialDefines"]; });
  16058. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "FluentMaterial", function() { return _materials__WEBPACK_IMPORTED_MODULE_1__["FluentMaterial"]; });
  16059. /* harmony import */ var _gui3DManager__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./gui3DManager */ "./3D/gui3DManager.ts");
  16060. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "GUI3DManager", function() { return _gui3DManager__WEBPACK_IMPORTED_MODULE_2__["GUI3DManager"]; });
  16061. /* harmony import */ var _vector3WithInfo__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./vector3WithInfo */ "./3D/vector3WithInfo.ts");
  16062. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Vector3WithInfo", function() { return _vector3WithInfo__WEBPACK_IMPORTED_MODULE_3__["Vector3WithInfo"]; });
  16063. /***/ }),
  16064. /***/ "./3D/materials/fluentMaterial.ts":
  16065. /*!****************************************!*\
  16066. !*** ./3D/materials/fluentMaterial.ts ***!
  16067. \****************************************/
  16068. /*! exports provided: FluentMaterialDefines, FluentMaterial */
  16069. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  16070. "use strict";
  16071. __webpack_require__.r(__webpack_exports__);
  16072. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "FluentMaterialDefines", function() { return FluentMaterialDefines; });
  16073. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "FluentMaterial", function() { return FluentMaterial; });
  16074. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  16075. /* harmony import */ var babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/decorators */ "babylonjs/Maths/math.vector");
  16076. /* harmony import */ var babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__);
  16077. /* harmony import */ var _shaders_fluent_vertex__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./shaders/fluent.vertex */ "./3D/materials/shaders/fluent.vertex.ts");
  16078. /* harmony import */ var _shaders_fluent_fragment__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./shaders/fluent.fragment */ "./3D/materials/shaders/fluent.fragment.ts");
  16079. /** @hidden */
  16080. var FluentMaterialDefines = /** @class */ (function (_super) {
  16081. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(FluentMaterialDefines, _super);
  16082. function FluentMaterialDefines() {
  16083. var _this = _super.call(this) || this;
  16084. _this.INNERGLOW = false;
  16085. _this.BORDER = false;
  16086. _this.HOVERLIGHT = false;
  16087. _this.TEXTURE = false;
  16088. _this.rebuild();
  16089. return _this;
  16090. }
  16091. return FluentMaterialDefines;
  16092. }(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["MaterialDefines"]));
  16093. /**
  16094. * Class used to render controls with fluent desgin
  16095. */
  16096. var FluentMaterial = /** @class */ (function (_super) {
  16097. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(FluentMaterial, _super);
  16098. /**
  16099. * Creates a new Fluent material
  16100. * @param name defines the name of the material
  16101. * @param scene defines the hosting scene
  16102. */
  16103. function FluentMaterial(name, scene) {
  16104. var _this = _super.call(this, name, scene) || this;
  16105. /**
  16106. * Gets or sets inner glow intensity. A value of 0 means no glow (default is 0.5)
  16107. */
  16108. _this.innerGlowColorIntensity = 0.5;
  16109. /**
  16110. * Gets or sets the inner glow color (white by default)
  16111. */
  16112. _this.innerGlowColor = new babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["Color3"](1.0, 1.0, 1.0);
  16113. /**
  16114. * Gets or sets the albedo color (Default is Color3(0.3, 0.35, 0.4))
  16115. */
  16116. _this.albedoColor = new babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["Color3"](0.3, 0.35, 0.4);
  16117. /**
  16118. * Gets or sets a boolean indicating if borders must be rendered (default is false)
  16119. */
  16120. _this.renderBorders = false;
  16121. /**
  16122. * Gets or sets border width (default is 0.5)
  16123. */
  16124. _this.borderWidth = 0.5;
  16125. /**
  16126. * Gets or sets a value indicating the smoothing value applied to border edges (0.02 by default)
  16127. */
  16128. _this.edgeSmoothingValue = 0.02;
  16129. /**
  16130. * Gets or sets the minimum value that can be applied to border width (default is 0.1)
  16131. */
  16132. _this.borderMinValue = 0.1;
  16133. /**
  16134. * Gets or sets a boolean indicating if hover light must be rendered (default is false)
  16135. */
  16136. _this.renderHoverLight = false;
  16137. /**
  16138. * Gets or sets the radius used to render the hover light (default is 1.0)
  16139. */
  16140. _this.hoverRadius = 1.0;
  16141. /**
  16142. * Gets or sets the color used to render the hover light (default is Color4(0.3, 0.3, 0.3, 1.0))
  16143. */
  16144. _this.hoverColor = new babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["Color4"](0.3, 0.3, 0.3, 1.0);
  16145. /**
  16146. * Gets or sets the hover light position in world space (default is Vector3.Zero())
  16147. */
  16148. _this.hoverPosition = babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["Vector3"].Zero();
  16149. return _this;
  16150. }
  16151. FluentMaterial.prototype.needAlphaBlending = function () {
  16152. return this.alpha !== 1.0;
  16153. };
  16154. FluentMaterial.prototype.needAlphaTesting = function () {
  16155. return false;
  16156. };
  16157. FluentMaterial.prototype.getAlphaTestTexture = function () {
  16158. return null;
  16159. };
  16160. FluentMaterial.prototype.isReadyForSubMesh = function (mesh, subMesh, useInstances) {
  16161. if (this.isFrozen) {
  16162. if (subMesh.effect && subMesh.effect._wasPreviouslyReady) {
  16163. return true;
  16164. }
  16165. }
  16166. if (!subMesh._materialDefines) {
  16167. subMesh._materialDefines = new FluentMaterialDefines();
  16168. }
  16169. var scene = this.getScene();
  16170. var defines = subMesh._materialDefines;
  16171. if (!this.checkReadyOnEveryCall && subMesh.effect) {
  16172. if (defines._renderId === scene.getRenderId()) {
  16173. return true;
  16174. }
  16175. }
  16176. if (defines._areTexturesDirty) {
  16177. defines.INNERGLOW = this.innerGlowColorIntensity > 0;
  16178. defines.BORDER = this.renderBorders;
  16179. defines.HOVERLIGHT = this.renderHoverLight;
  16180. if (this._albedoTexture) {
  16181. if (!this._albedoTexture.isReadyOrNotBlocking()) {
  16182. return false;
  16183. }
  16184. else {
  16185. defines.TEXTURE = true;
  16186. }
  16187. }
  16188. else {
  16189. defines.TEXTURE = false;
  16190. }
  16191. }
  16192. var engine = scene.getEngine();
  16193. // Get correct effect
  16194. if (defines.isDirty) {
  16195. defines.markAsProcessed();
  16196. scene.resetCachedMaterial();
  16197. //Attributes
  16198. var attribs = [babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["VertexBuffer"].PositionKind];
  16199. attribs.push(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["VertexBuffer"].NormalKind);
  16200. attribs.push(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["VertexBuffer"].UVKind);
  16201. var shaderName = "fluent";
  16202. var uniforms = ["world", "viewProjection", "innerGlowColor", "albedoColor", "borderWidth", "edgeSmoothingValue", "scaleFactor", "borderMinValue",
  16203. "hoverColor", "hoverPosition", "hoverRadius"
  16204. ];
  16205. var samplers = ["albedoSampler"];
  16206. var uniformBuffers = new Array();
  16207. babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["MaterialHelper"].PrepareUniformsAndSamplersList({
  16208. uniformsNames: uniforms,
  16209. uniformBuffersNames: uniformBuffers,
  16210. samplers: samplers,
  16211. defines: defines,
  16212. maxSimultaneousLights: 4
  16213. });
  16214. var join = defines.toString();
  16215. subMesh.setEffect(scene.getEngine().createEffect(shaderName, {
  16216. attributes: attribs,
  16217. uniformsNames: uniforms,
  16218. uniformBuffersNames: uniformBuffers,
  16219. samplers: samplers,
  16220. defines: join,
  16221. fallbacks: null,
  16222. onCompiled: this.onCompiled,
  16223. onError: this.onError,
  16224. indexParameters: { maxSimultaneousLights: 4 }
  16225. }, engine));
  16226. }
  16227. if (!subMesh.effect || !subMesh.effect.isReady()) {
  16228. return false;
  16229. }
  16230. defines._renderId = scene.getRenderId();
  16231. subMesh.effect._wasPreviouslyReady = true;
  16232. return true;
  16233. };
  16234. FluentMaterial.prototype.bindForSubMesh = function (world, mesh, subMesh) {
  16235. var scene = this.getScene();
  16236. var defines = subMesh._materialDefines;
  16237. if (!defines) {
  16238. return;
  16239. }
  16240. var effect = subMesh.effect;
  16241. if (!effect) {
  16242. return;
  16243. }
  16244. this._activeEffect = effect;
  16245. // Matrices
  16246. this.bindOnlyWorldMatrix(world);
  16247. this._activeEffect.setMatrix("viewProjection", scene.getTransformMatrix());
  16248. if (this._mustRebind(scene, effect)) {
  16249. this._activeEffect.setColor4("albedoColor", this.albedoColor, this.alpha);
  16250. if (defines.INNERGLOW) {
  16251. this._activeEffect.setColor4("innerGlowColor", this.innerGlowColor, this.innerGlowColorIntensity);
  16252. }
  16253. if (defines.BORDER) {
  16254. this._activeEffect.setFloat("borderWidth", this.borderWidth);
  16255. this._activeEffect.setFloat("edgeSmoothingValue", this.edgeSmoothingValue);
  16256. this._activeEffect.setFloat("borderMinValue", this.borderMinValue);
  16257. mesh.getBoundingInfo().boundingBox.extendSize.multiplyToRef(mesh.scaling, babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["TmpVectors"].Vector3[0]);
  16258. this._activeEffect.setVector3("scaleFactor", babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["TmpVectors"].Vector3[0]);
  16259. }
  16260. if (defines.HOVERLIGHT) {
  16261. this._activeEffect.setDirectColor4("hoverColor", this.hoverColor);
  16262. this._activeEffect.setFloat("hoverRadius", this.hoverRadius);
  16263. this._activeEffect.setVector3("hoverPosition", this.hoverPosition);
  16264. }
  16265. if (defines.TEXTURE) {
  16266. this._activeEffect.setTexture("albedoSampler", this._albedoTexture);
  16267. }
  16268. }
  16269. this._afterBind(mesh, this._activeEffect);
  16270. };
  16271. FluentMaterial.prototype.getActiveTextures = function () {
  16272. var activeTextures = _super.prototype.getActiveTextures.call(this);
  16273. return activeTextures;
  16274. };
  16275. FluentMaterial.prototype.hasTexture = function (texture) {
  16276. if (_super.prototype.hasTexture.call(this, texture)) {
  16277. return true;
  16278. }
  16279. return false;
  16280. };
  16281. FluentMaterial.prototype.dispose = function (forceDisposeEffect) {
  16282. _super.prototype.dispose.call(this, forceDisposeEffect);
  16283. };
  16284. FluentMaterial.prototype.clone = function (name) {
  16285. var _this = this;
  16286. return babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["SerializationHelper"].Clone(function () { return new FluentMaterial(name, _this.getScene()); }, this);
  16287. };
  16288. FluentMaterial.prototype.serialize = function () {
  16289. var serializationObject = babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["SerializationHelper"].Serialize(this);
  16290. serializationObject.customType = "BABYLON.GUI.FluentMaterial";
  16291. return serializationObject;
  16292. };
  16293. FluentMaterial.prototype.getClassName = function () {
  16294. return "FluentMaterial";
  16295. };
  16296. // Statics
  16297. FluentMaterial.Parse = function (source, scene, rootUrl) {
  16298. return babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["SerializationHelper"].Parse(function () { return new FluentMaterial(source.name, scene); }, source, scene, rootUrl);
  16299. };
  16300. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([
  16301. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["serialize"])(),
  16302. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["expandToProperty"])("_markAllSubMeshesAsTexturesDirty")
  16303. ], FluentMaterial.prototype, "innerGlowColorIntensity", void 0);
  16304. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([
  16305. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["serializeAsColor3"])()
  16306. ], FluentMaterial.prototype, "innerGlowColor", void 0);
  16307. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([
  16308. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["serializeAsColor3"])()
  16309. ], FluentMaterial.prototype, "albedoColor", void 0);
  16310. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([
  16311. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["serialize"])(),
  16312. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["expandToProperty"])("_markAllSubMeshesAsTexturesDirty")
  16313. ], FluentMaterial.prototype, "renderBorders", void 0);
  16314. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([
  16315. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["serialize"])()
  16316. ], FluentMaterial.prototype, "borderWidth", void 0);
  16317. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([
  16318. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["serialize"])()
  16319. ], FluentMaterial.prototype, "edgeSmoothingValue", void 0);
  16320. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([
  16321. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["serialize"])()
  16322. ], FluentMaterial.prototype, "borderMinValue", void 0);
  16323. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([
  16324. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["serialize"])(),
  16325. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["expandToProperty"])("_markAllSubMeshesAsTexturesDirty")
  16326. ], FluentMaterial.prototype, "renderHoverLight", void 0);
  16327. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([
  16328. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["serialize"])()
  16329. ], FluentMaterial.prototype, "hoverRadius", void 0);
  16330. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([
  16331. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["serializeAsColor4"])()
  16332. ], FluentMaterial.prototype, "hoverColor", void 0);
  16333. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([
  16334. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["serializeAsVector3"])()
  16335. ], FluentMaterial.prototype, "hoverPosition", void 0);
  16336. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([
  16337. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["serializeAsTexture"])("albedoTexture")
  16338. ], FluentMaterial.prototype, "_albedoTexture", void 0);
  16339. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([
  16340. Object(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["expandToProperty"])("_markAllSubMeshesAsTexturesAndMiscDirty")
  16341. ], FluentMaterial.prototype, "albedoTexture", void 0);
  16342. return FluentMaterial;
  16343. }(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["PushMaterial"]));
  16344. babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredTypes["BABYLON.GUI.FluentMaterial"] = FluentMaterial;
  16345. /***/ }),
  16346. /***/ "./3D/materials/index.ts":
  16347. /*!*******************************!*\
  16348. !*** ./3D/materials/index.ts ***!
  16349. \*******************************/
  16350. /*! exports provided: FluentMaterialDefines, FluentMaterial */
  16351. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  16352. "use strict";
  16353. __webpack_require__.r(__webpack_exports__);
  16354. /* harmony import */ var _fluentMaterial__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./fluentMaterial */ "./3D/materials/fluentMaterial.ts");
  16355. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "FluentMaterialDefines", function() { return _fluentMaterial__WEBPACK_IMPORTED_MODULE_0__["FluentMaterialDefines"]; });
  16356. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "FluentMaterial", function() { return _fluentMaterial__WEBPACK_IMPORTED_MODULE_0__["FluentMaterial"]; });
  16357. /***/ }),
  16358. /***/ "./3D/materials/shaders/fluent.fragment.ts":
  16359. /*!*************************************************!*\
  16360. !*** ./3D/materials/shaders/fluent.fragment.ts ***!
  16361. \*************************************************/
  16362. /*! exports provided: fluentPixelShader */
  16363. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  16364. "use strict";
  16365. __webpack_require__.r(__webpack_exports__);
  16366. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "fluentPixelShader", function() { return fluentPixelShader; });
  16367. /* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Materials/effect */ "babylonjs/Maths/math.vector");
  16368. /* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__);
  16369. var name = 'fluentPixelShader';
  16370. var shader = "precision highp float;\nvarying vec2 vUV;\nuniform vec4 albedoColor;\n#ifdef INNERGLOW\nuniform vec4 innerGlowColor;\n#endif\n#ifdef BORDER\nvarying vec2 scaleInfo;\nuniform float edgeSmoothingValue;\nuniform float borderMinValue;\n#endif\n#ifdef HOVERLIGHT\nvarying vec3 worldPosition;\nuniform vec3 hoverPosition;\nuniform vec4 hoverColor;\nuniform float hoverRadius;\n#endif\n#ifdef TEXTURE\nuniform sampler2D albedoSampler;\n#endif\nvoid main(void) {\nvec3 albedo=albedoColor.rgb;\nfloat alpha=albedoColor.a;\n#ifdef TEXTURE\nalbedo=texture2D(albedoSampler,vUV).rgb;\n#endif\n#ifdef HOVERLIGHT\nfloat pointToHover=(1.0-clamp(length(hoverPosition-worldPosition)/hoverRadius,0.,1.))*hoverColor.a;\nalbedo=clamp(albedo+hoverColor.rgb*pointToHover,0.,1.);\n#else\nfloat pointToHover=1.0;\n#endif\n#ifdef BORDER\nfloat borderPower=10.0;\nfloat inverseBorderPower=1.0/borderPower;\nvec3 borderColor=albedo*borderPower;\nvec2 distanceToEdge;\ndistanceToEdge.x=abs(vUV.x-0.5)*2.0;\ndistanceToEdge.y=abs(vUV.y-0.5)*2.0;\nfloat borderValue=max(smoothstep(scaleInfo.x-edgeSmoothingValue,scaleInfo.x+edgeSmoothingValue,distanceToEdge.x),\nsmoothstep(scaleInfo.y-edgeSmoothingValue,scaleInfo.y+edgeSmoothingValue,distanceToEdge.y));\nborderColor=borderColor*borderValue*max(borderMinValue*inverseBorderPower,pointToHover);\nalbedo+=borderColor;\nalpha=max(alpha,borderValue);\n#endif\n#ifdef INNERGLOW\n\nvec2 uvGlow=(vUV-vec2(0.5,0.5))*(innerGlowColor.a*2.0);\nuvGlow=uvGlow*uvGlow;\nuvGlow=uvGlow*uvGlow;\nalbedo+=mix(vec3(0.0,0.0,0.0),innerGlowColor.rgb,uvGlow.x+uvGlow.y);\n#endif\ngl_FragColor=vec4(albedo,alpha);\n}";
  16371. babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__["Effect"].ShadersStore[name] = shader;
  16372. /** @hidden */
  16373. var fluentPixelShader = { name: name, shader: shader };
  16374. /***/ }),
  16375. /***/ "./3D/materials/shaders/fluent.vertex.ts":
  16376. /*!***********************************************!*\
  16377. !*** ./3D/materials/shaders/fluent.vertex.ts ***!
  16378. \***********************************************/
  16379. /*! exports provided: fluentVertexShader */
  16380. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  16381. "use strict";
  16382. __webpack_require__.r(__webpack_exports__);
  16383. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "fluentVertexShader", function() { return fluentVertexShader; });
  16384. /* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Materials/effect */ "babylonjs/Maths/math.vector");
  16385. /* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__);
  16386. var name = 'fluentVertexShader';
  16387. var shader = "precision highp float;\n\nattribute vec3 position;\nattribute vec3 normal;\nattribute vec2 uv;\n\nuniform mat4 world;\nuniform mat4 viewProjection;\nvarying vec2 vUV;\n#ifdef BORDER\nvarying vec2 scaleInfo;\nuniform float borderWidth;\nuniform vec3 scaleFactor;\n#endif\n#ifdef HOVERLIGHT\nvarying vec3 worldPosition;\n#endif\nvoid main(void) {\nvUV=uv;\n#ifdef BORDER\nvec3 scale=scaleFactor;\nfloat minScale=min(min(scale.x,scale.y),scale.z);\nfloat maxScale=max(max(scale.x,scale.y),scale.z);\nfloat minOverMiddleScale=minScale/(scale.x+scale.y+scale.z-minScale-maxScale);\nfloat areaYZ=scale.y*scale.z;\nfloat areaXZ=scale.x*scale.z;\nfloat areaXY=scale.x*scale.y;\nfloat scaledBorderWidth=borderWidth;\nif (abs(normal.x) == 1.0)\n{\nscale.x=scale.y;\nscale.y=scale.z;\nif (areaYZ>areaXZ && areaYZ>areaXY)\n{\nscaledBorderWidth*=minOverMiddleScale;\n}\n}\nelse if (abs(normal.y) == 1.0)\n{\nscale.x=scale.z;\nif (areaXZ>areaXY && areaXZ>areaYZ)\n{\nscaledBorderWidth*=minOverMiddleScale;\n}\n}\nelse\n{\nif (areaXY>areaYZ && areaXY>areaXZ)\n{\nscaledBorderWidth*=minOverMiddleScale;\n}\n}\nfloat scaleRatio=min(scale.x,scale.y)/max(scale.x,scale.y);\nif (scale.x>scale.y)\n{\nscaleInfo.x=1.0-(scaledBorderWidth*scaleRatio);\nscaleInfo.y=1.0-scaledBorderWidth;\n}\nelse\n{\nscaleInfo.x=1.0-scaledBorderWidth;\nscaleInfo.y=1.0-(scaledBorderWidth*scaleRatio);\n}\n#endif\nvec4 worldPos=world*vec4(position,1.0);\n#ifdef HOVERLIGHT\nworldPosition=worldPos.xyz;\n#endif\ngl_Position=viewProjection*worldPos;\n}\n";
  16388. babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__["Effect"].ShadersStore[name] = shader;
  16389. /** @hidden */
  16390. var fluentVertexShader = { name: name, shader: shader };
  16391. /***/ }),
  16392. /***/ "./3D/vector3WithInfo.ts":
  16393. /*!*******************************!*\
  16394. !*** ./3D/vector3WithInfo.ts ***!
  16395. \*******************************/
  16396. /*! exports provided: Vector3WithInfo */
  16397. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  16398. "use strict";
  16399. __webpack_require__.r(__webpack_exports__);
  16400. /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Vector3WithInfo", function() { return Vector3WithInfo; });
  16401. /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
  16402. /* harmony import */ var babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math.vector */ "babylonjs/Maths/math.vector");
  16403. /* harmony import */ var babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__);
  16404. /**
  16405. * Class used to transport Vector3 information for pointer events
  16406. */
  16407. var Vector3WithInfo = /** @class */ (function (_super) {
  16408. Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(Vector3WithInfo, _super);
  16409. /**
  16410. * Creates a new Vector3WithInfo
  16411. * @param source defines the vector3 data to transport
  16412. * @param buttonIndex defines the current mouse button index
  16413. */
  16414. function Vector3WithInfo(source,
  16415. /** defines the current mouse button index */
  16416. buttonIndex) {
  16417. if (buttonIndex === void 0) { buttonIndex = 0; }
  16418. var _this = _super.call(this, source.x, source.y, source.z) || this;
  16419. _this.buttonIndex = buttonIndex;
  16420. return _this;
  16421. }
  16422. return Vector3WithInfo;
  16423. }(babylonjs_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__["Vector3"]));
  16424. /***/ }),
  16425. /***/ "./index.ts":
  16426. /*!******************!*\
  16427. !*** ./index.ts ***!
  16428. \******************/
  16429. /*! exports provided: Button, Checkbox, ColorPicker, Container, Control, Ellipse, Grid, Image, InputText, InputPassword, Line, MultiLine, RadioButton, StackPanel, SelectorGroup, CheckboxGroup, RadioGroup, SliderGroup, SelectionPanel, ScrollViewer, TextWrapping, TextBlock, KeyPropertySet, VirtualKeyboard, Rectangle, DisplayGrid, BaseSlider, Slider, ImageBasedSlider, ScrollBar, ImageScrollBar, name, AdvancedDynamicTexture, AdvancedDynamicTextureInstrumentation, Vector2WithInfo, Matrix2D, Measure, MultiLinePoint, Style, ValueAndUnit, XmlLoader, AbstractButton3D, Button3D, Container3D, Control3D, CylinderPanel, HolographicButton, MeshButton3D, PlanePanel, ScatterPanel, SpherePanel, StackPanel3D, VolumeBasedPanel, FluentMaterialDefines, FluentMaterial, GUI3DManager, Vector3WithInfo */
  16430. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  16431. "use strict";
  16432. __webpack_require__.r(__webpack_exports__);
  16433. /* harmony import */ var _2D__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./2D */ "./2D/index.ts");
  16434. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Button", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["Button"]; });
  16435. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Checkbox", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["Checkbox"]; });
  16436. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ColorPicker", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["ColorPicker"]; });
  16437. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Container", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["Container"]; });
  16438. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Control", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["Control"]; });
  16439. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Ellipse", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["Ellipse"]; });
  16440. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Grid", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["Grid"]; });
  16441. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Image", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["Image"]; });
  16442. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "InputText", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["InputText"]; });
  16443. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "InputPassword", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["InputPassword"]; });
  16444. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Line", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["Line"]; });
  16445. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MultiLine", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["MultiLine"]; });
  16446. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "RadioButton", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["RadioButton"]; });
  16447. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "StackPanel", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["StackPanel"]; });
  16448. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SelectorGroup", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["SelectorGroup"]; });
  16449. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "CheckboxGroup", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["CheckboxGroup"]; });
  16450. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "RadioGroup", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["RadioGroup"]; });
  16451. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SliderGroup", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["SliderGroup"]; });
  16452. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SelectionPanel", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["SelectionPanel"]; });
  16453. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ScrollViewer", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["ScrollViewer"]; });
  16454. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "TextWrapping", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["TextWrapping"]; });
  16455. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "TextBlock", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["TextBlock"]; });
  16456. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "KeyPropertySet", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["KeyPropertySet"]; });
  16457. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "VirtualKeyboard", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["VirtualKeyboard"]; });
  16458. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Rectangle", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["Rectangle"]; });
  16459. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DisplayGrid", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["DisplayGrid"]; });
  16460. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "BaseSlider", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["BaseSlider"]; });
  16461. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Slider", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["Slider"]; });
  16462. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ImageBasedSlider", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["ImageBasedSlider"]; });
  16463. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ScrollBar", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["ScrollBar"]; });
  16464. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ImageScrollBar", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["ImageScrollBar"]; });
  16465. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "name", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["name"]; });
  16466. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AdvancedDynamicTexture", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["AdvancedDynamicTexture"]; });
  16467. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AdvancedDynamicTextureInstrumentation", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["AdvancedDynamicTextureInstrumentation"]; });
  16468. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Vector2WithInfo", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["Vector2WithInfo"]; });
  16469. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Matrix2D", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["Matrix2D"]; });
  16470. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Measure", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["Measure"]; });
  16471. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MultiLinePoint", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["MultiLinePoint"]; });
  16472. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Style", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["Style"]; });
  16473. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ValueAndUnit", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["ValueAndUnit"]; });
  16474. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "XmlLoader", function() { return _2D__WEBPACK_IMPORTED_MODULE_0__["XmlLoader"]; });
  16475. /* harmony import */ var _3D__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./3D */ "./3D/index.ts");
  16476. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AbstractButton3D", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["AbstractButton3D"]; });
  16477. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Button3D", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["Button3D"]; });
  16478. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Container3D", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["Container3D"]; });
  16479. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Control3D", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["Control3D"]; });
  16480. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "CylinderPanel", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["CylinderPanel"]; });
  16481. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "HolographicButton", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["HolographicButton"]; });
  16482. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MeshButton3D", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["MeshButton3D"]; });
  16483. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "PlanePanel", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["PlanePanel"]; });
  16484. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ScatterPanel", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["ScatterPanel"]; });
  16485. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SpherePanel", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["SpherePanel"]; });
  16486. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "StackPanel3D", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["StackPanel3D"]; });
  16487. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "VolumeBasedPanel", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["VolumeBasedPanel"]; });
  16488. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "FluentMaterialDefines", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["FluentMaterialDefines"]; });
  16489. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "FluentMaterial", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["FluentMaterial"]; });
  16490. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "GUI3DManager", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["GUI3DManager"]; });
  16491. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Vector3WithInfo", function() { return _3D__WEBPACK_IMPORTED_MODULE_1__["Vector3WithInfo"]; });
  16492. /***/ }),
  16493. /***/ "./legacy/legacy.ts":
  16494. /*!**************************!*\
  16495. !*** ./legacy/legacy.ts ***!
  16496. \**************************/
  16497. /*! exports provided: Button, Checkbox, ColorPicker, Container, Control, Ellipse, Grid, Image, InputText, InputPassword, Line, MultiLine, RadioButton, StackPanel, SelectorGroup, CheckboxGroup, RadioGroup, SliderGroup, SelectionPanel, ScrollViewer, TextWrapping, TextBlock, KeyPropertySet, VirtualKeyboard, Rectangle, DisplayGrid, BaseSlider, Slider, ImageBasedSlider, ScrollBar, ImageScrollBar, name, AdvancedDynamicTexture, AdvancedDynamicTextureInstrumentation, Vector2WithInfo, Matrix2D, Measure, MultiLinePoint, Style, ValueAndUnit, XmlLoader, AbstractButton3D, Button3D, Container3D, Control3D, CylinderPanel, HolographicButton, MeshButton3D, PlanePanel, ScatterPanel, SpherePanel, StackPanel3D, VolumeBasedPanel, FluentMaterialDefines, FluentMaterial, GUI3DManager, Vector3WithInfo */
  16498. /***/ (function(module, __webpack_exports__, __webpack_require__) {
  16499. "use strict";
  16500. __webpack_require__.r(__webpack_exports__);
  16501. /* WEBPACK VAR INJECTION */(function(global) {/* harmony import */ var _index__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../index */ "./index.ts");
  16502. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Button", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Button"]; });
  16503. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Checkbox", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Checkbox"]; });
  16504. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ColorPicker", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["ColorPicker"]; });
  16505. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Container", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Container"]; });
  16506. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Control", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Control"]; });
  16507. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Ellipse", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Ellipse"]; });
  16508. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Grid", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Grid"]; });
  16509. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Image", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Image"]; });
  16510. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "InputText", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["InputText"]; });
  16511. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "InputPassword", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["InputPassword"]; });
  16512. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Line", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Line"]; });
  16513. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MultiLine", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["MultiLine"]; });
  16514. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "RadioButton", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["RadioButton"]; });
  16515. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "StackPanel", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["StackPanel"]; });
  16516. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SelectorGroup", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["SelectorGroup"]; });
  16517. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "CheckboxGroup", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["CheckboxGroup"]; });
  16518. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "RadioGroup", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["RadioGroup"]; });
  16519. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SliderGroup", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["SliderGroup"]; });
  16520. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SelectionPanel", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["SelectionPanel"]; });
  16521. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ScrollViewer", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["ScrollViewer"]; });
  16522. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "TextWrapping", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["TextWrapping"]; });
  16523. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "TextBlock", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["TextBlock"]; });
  16524. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "KeyPropertySet", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["KeyPropertySet"]; });
  16525. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "VirtualKeyboard", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["VirtualKeyboard"]; });
  16526. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Rectangle", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Rectangle"]; });
  16527. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DisplayGrid", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["DisplayGrid"]; });
  16528. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "BaseSlider", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["BaseSlider"]; });
  16529. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Slider", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Slider"]; });
  16530. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ImageBasedSlider", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["ImageBasedSlider"]; });
  16531. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ScrollBar", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["ScrollBar"]; });
  16532. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ImageScrollBar", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["ImageScrollBar"]; });
  16533. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "name", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["name"]; });
  16534. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AdvancedDynamicTexture", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["AdvancedDynamicTexture"]; });
  16535. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AdvancedDynamicTextureInstrumentation", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["AdvancedDynamicTextureInstrumentation"]; });
  16536. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Vector2WithInfo", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Vector2WithInfo"]; });
  16537. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Matrix2D", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Matrix2D"]; });
  16538. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Measure", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Measure"]; });
  16539. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MultiLinePoint", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["MultiLinePoint"]; });
  16540. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Style", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Style"]; });
  16541. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ValueAndUnit", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["ValueAndUnit"]; });
  16542. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "XmlLoader", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["XmlLoader"]; });
  16543. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "AbstractButton3D", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["AbstractButton3D"]; });
  16544. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Button3D", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Button3D"]; });
  16545. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Container3D", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Container3D"]; });
  16546. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Control3D", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Control3D"]; });
  16547. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "CylinderPanel", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["CylinderPanel"]; });
  16548. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "HolographicButton", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["HolographicButton"]; });
  16549. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MeshButton3D", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["MeshButton3D"]; });
  16550. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "PlanePanel", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["PlanePanel"]; });
  16551. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ScatterPanel", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["ScatterPanel"]; });
  16552. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SpherePanel", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["SpherePanel"]; });
  16553. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "StackPanel3D", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["StackPanel3D"]; });
  16554. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "VolumeBasedPanel", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["VolumeBasedPanel"]; });
  16555. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "FluentMaterialDefines", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["FluentMaterialDefines"]; });
  16556. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "FluentMaterial", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["FluentMaterial"]; });
  16557. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "GUI3DManager", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["GUI3DManager"]; });
  16558. /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "Vector3WithInfo", function() { return _index__WEBPACK_IMPORTED_MODULE_0__["Vector3WithInfo"]; });
  16559. /**
  16560. * Legacy support, defining window.BABYLON.GUI (global variable).
  16561. *
  16562. * This is the entry point for the UMD module.
  16563. * The entry point for a future ESM package should be index.ts
  16564. */
  16565. var globalObject = (typeof global !== 'undefined') ? global : ((typeof window !== 'undefined') ? window : undefined);
  16566. if (typeof globalObject !== "undefined") {
  16567. globalObject.BABYLON = globalObject.BABYLON || {};
  16568. globalObject.BABYLON.GUI = _index__WEBPACK_IMPORTED_MODULE_0__;
  16569. }
  16570. /* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../../../node_modules/webpack/buildin/global.js */ "../../node_modules/webpack/buildin/global.js")))
  16571. /***/ }),
  16572. /***/ "babylonjs/Maths/math.vector":
  16573. /*!****************************************************************************************************!*\
  16574. !*** external {"root":"BABYLON","commonjs":"babylonjs","commonjs2":"babylonjs","amd":"babylonjs"} ***!
  16575. \****************************************************************************************************/
  16576. /*! no static exports found */
  16577. /***/ (function(module, exports) {
  16578. module.exports = __WEBPACK_EXTERNAL_MODULE_babylonjs_Maths_math_vector__;
  16579. /***/ })
  16580. /******/ });
  16581. });
  16582. //# sourceMappingURL=babylon.gui.js.map