Graph.js 388 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090209120922093209420952096209720982099210021012102210321042105210621072108210921102111211221132114211521162117211821192120212121222123212421252126212721282129213021312132213321342135213621372138213921402141214221432144214521462147214821492150215121522153215421552156215721582159216021612162216321642165216621672168216921702171217221732174217521762177217821792180218121822183218421852186218721882189219021912192219321942195219621972198219922002201220222032204220522062207220822092210221122122213221422152216221722182219222022212222222322242225222622272228222922302231223222332234223522362237223822392240224122422243224422452246224722482249225022512252225322542255225622572258225922602261226222632264226522662267226822692270227122722273227422752276227722782279228022812282228322842285228622872288228922902291229222932294229522962297229822992300230123022303230423052306230723082309231023112312231323142315231623172318231923202321232223232324232523262327232823292330233123322333233423352336233723382339234023412342234323442345234623472348234923502351235223532354235523562357235823592360236123622363236423652366236723682369237023712372237323742375237623772378237923802381238223832384238523862387238823892390239123922393239423952396239723982399240024012402240324042405240624072408240924102411241224132414241524162417241824192420242124222423242424252426242724282429243024312432243324342435243624372438243924402441244224432444244524462447244824492450245124522453245424552456245724582459246024612462246324642465246624672468246924702471247224732474247524762477247824792480248124822483248424852486248724882489249024912492249324942495249624972498249925002501250225032504250525062507250825092510251125122513251425152516251725182519252025212522252325242525252625272528252925302531253225332534253525362537253825392540254125422543254425452546254725482549255025512552255325542555255625572558255925602561256225632564256525662567256825692570257125722573257425752576257725782579258025812582258325842585258625872588258925902591259225932594259525962597259825992600260126022603260426052606260726082609261026112612261326142615261626172618261926202621262226232624262526262627262826292630263126322633263426352636263726382639264026412642264326442645264626472648264926502651265226532654265526562657265826592660266126622663266426652666266726682669267026712672267326742675267626772678267926802681268226832684268526862687268826892690269126922693269426952696269726982699270027012702270327042705270627072708270927102711271227132714271527162717271827192720272127222723272427252726272727282729273027312732273327342735273627372738273927402741274227432744274527462747274827492750275127522753275427552756275727582759276027612762276327642765276627672768276927702771277227732774277527762777277827792780278127822783278427852786278727882789279027912792279327942795279627972798279928002801280228032804280528062807280828092810281128122813281428152816281728182819282028212822282328242825282628272828282928302831283228332834283528362837283828392840284128422843284428452846284728482849285028512852285328542855285628572858285928602861286228632864286528662867286828692870287128722873287428752876287728782879288028812882288328842885288628872888288928902891289228932894289528962897289828992900290129022903290429052906290729082909291029112912291329142915291629172918291929202921292229232924292529262927292829292930293129322933293429352936293729382939294029412942294329442945294629472948294929502951295229532954295529562957295829592960296129622963296429652966296729682969297029712972297329742975297629772978297929802981298229832984298529862987298829892990299129922993299429952996299729982999300030013002300330043005300630073008300930103011301230133014301530163017301830193020302130223023302430253026302730283029303030313032303330343035303630373038303930403041304230433044304530463047304830493050305130523053305430553056305730583059306030613062306330643065306630673068306930703071307230733074307530763077307830793080308130823083308430853086308730883089309030913092309330943095309630973098309931003101310231033104310531063107310831093110311131123113311431153116311731183119312031213122312331243125312631273128312931303131313231333134313531363137313831393140314131423143314431453146314731483149315031513152315331543155315631573158315931603161316231633164316531663167316831693170317131723173317431753176317731783179318031813182318331843185318631873188318931903191319231933194319531963197319831993200320132023203320432053206320732083209321032113212321332143215321632173218321932203221322232233224322532263227322832293230323132323233323432353236323732383239324032413242324332443245324632473248324932503251325232533254325532563257325832593260326132623263326432653266326732683269327032713272327332743275327632773278327932803281328232833284328532863287328832893290329132923293329432953296329732983299330033013302330333043305330633073308330933103311331233133314331533163317331833193320332133223323332433253326332733283329333033313332333333343335333633373338333933403341334233433344334533463347334833493350335133523353335433553356335733583359336033613362336333643365336633673368336933703371337233733374337533763377337833793380338133823383338433853386338733883389339033913392339333943395339633973398339934003401340234033404340534063407340834093410341134123413341434153416341734183419342034213422342334243425342634273428342934303431343234333434343534363437343834393440344134423443344434453446344734483449345034513452345334543455345634573458345934603461346234633464346534663467346834693470347134723473347434753476347734783479348034813482348334843485348634873488348934903491349234933494349534963497349834993500350135023503350435053506350735083509351035113512351335143515351635173518351935203521352235233524352535263527352835293530353135323533353435353536353735383539354035413542354335443545354635473548354935503551355235533554355535563557355835593560356135623563356435653566356735683569357035713572357335743575357635773578357935803581358235833584358535863587358835893590359135923593359435953596359735983599360036013602360336043605360636073608360936103611361236133614361536163617361836193620362136223623362436253626362736283629363036313632363336343635363636373638363936403641364236433644364536463647364836493650365136523653365436553656365736583659366036613662366336643665366636673668366936703671367236733674367536763677367836793680368136823683368436853686368736883689369036913692369336943695369636973698369937003701370237033704370537063707370837093710371137123713371437153716371737183719372037213722372337243725372637273728372937303731373237333734373537363737373837393740374137423743374437453746374737483749375037513752375337543755375637573758375937603761376237633764376537663767376837693770377137723773377437753776377737783779378037813782378337843785378637873788378937903791379237933794379537963797379837993800380138023803380438053806380738083809381038113812381338143815381638173818381938203821382238233824382538263827382838293830383138323833383438353836383738383839384038413842384338443845384638473848384938503851385238533854385538563857385838593860386138623863386438653866386738683869387038713872387338743875387638773878387938803881388238833884388538863887388838893890389138923893389438953896389738983899390039013902390339043905390639073908390939103911391239133914391539163917391839193920392139223923392439253926392739283929393039313932393339343935393639373938393939403941394239433944394539463947394839493950395139523953395439553956395739583959396039613962396339643965396639673968396939703971397239733974397539763977397839793980398139823983398439853986398739883989399039913992399339943995399639973998399940004001400240034004400540064007400840094010401140124013401440154016401740184019402040214022402340244025402640274028402940304031403240334034403540364037403840394040404140424043404440454046404740484049405040514052405340544055405640574058405940604061406240634064406540664067406840694070407140724073407440754076407740784079408040814082408340844085408640874088408940904091409240934094409540964097409840994100410141024103410441054106410741084109411041114112411341144115411641174118411941204121412241234124412541264127412841294130413141324133413441354136413741384139414041414142414341444145414641474148414941504151415241534154415541564157415841594160416141624163416441654166416741684169417041714172417341744175417641774178417941804181418241834184418541864187418841894190419141924193419441954196419741984199420042014202420342044205420642074208420942104211421242134214421542164217421842194220422142224223422442254226422742284229423042314232423342344235423642374238423942404241424242434244424542464247424842494250425142524253425442554256425742584259426042614262426342644265426642674268426942704271427242734274427542764277427842794280428142824283428442854286428742884289429042914292429342944295429642974298429943004301430243034304430543064307430843094310431143124313431443154316431743184319432043214322432343244325432643274328432943304331433243334334433543364337433843394340434143424343434443454346434743484349435043514352435343544355435643574358435943604361436243634364436543664367436843694370437143724373437443754376437743784379438043814382438343844385438643874388438943904391439243934394439543964397439843994400440144024403440444054406440744084409441044114412441344144415441644174418441944204421442244234424442544264427442844294430443144324433443444354436443744384439444044414442444344444445444644474448444944504451445244534454445544564457445844594460446144624463446444654466446744684469447044714472447344744475447644774478447944804481448244834484448544864487448844894490449144924493449444954496449744984499450045014502450345044505450645074508450945104511451245134514451545164517451845194520452145224523452445254526452745284529453045314532453345344535453645374538453945404541454245434544454545464547454845494550455145524553455445554556455745584559456045614562456345644565456645674568456945704571457245734574457545764577457845794580458145824583458445854586458745884589459045914592459345944595459645974598459946004601460246034604460546064607460846094610461146124613461446154616461746184619462046214622462346244625462646274628462946304631463246334634463546364637463846394640464146424643464446454646464746484649465046514652465346544655465646574658465946604661466246634664466546664667466846694670467146724673467446754676467746784679468046814682468346844685468646874688468946904691469246934694469546964697469846994700470147024703470447054706470747084709471047114712471347144715471647174718471947204721472247234724472547264727472847294730473147324733473447354736473747384739474047414742474347444745474647474748474947504751475247534754475547564757475847594760476147624763476447654766476747684769477047714772477347744775477647774778477947804781478247834784478547864787478847894790479147924793479447954796479747984799480048014802480348044805480648074808480948104811481248134814481548164817481848194820482148224823482448254826482748284829483048314832483348344835483648374838483948404841484248434844484548464847484848494850485148524853485448554856485748584859486048614862486348644865486648674868486948704871487248734874487548764877487848794880488148824883488448854886488748884889489048914892489348944895489648974898489949004901490249034904490549064907490849094910491149124913491449154916491749184919492049214922492349244925492649274928492949304931493249334934493549364937493849394940494149424943494449454946494749484949495049514952495349544955495649574958495949604961496249634964496549664967496849694970497149724973497449754976497749784979498049814982498349844985498649874988498949904991499249934994499549964997499849995000500150025003500450055006500750085009501050115012501350145015501650175018501950205021502250235024502550265027502850295030503150325033503450355036503750385039504050415042504350445045504650475048504950505051505250535054505550565057505850595060506150625063506450655066506750685069507050715072507350745075507650775078507950805081508250835084508550865087508850895090509150925093509450955096509750985099510051015102510351045105510651075108510951105111511251135114511551165117511851195120512151225123512451255126512751285129513051315132513351345135513651375138513951405141514251435144514551465147514851495150515151525153515451555156515751585159516051615162516351645165516651675168516951705171517251735174517551765177517851795180518151825183518451855186518751885189519051915192519351945195519651975198519952005201520252035204520552065207520852095210521152125213521452155216521752185219522052215222522352245225522652275228522952305231523252335234523552365237523852395240524152425243524452455246524752485249525052515252525352545255525652575258525952605261526252635264526552665267526852695270527152725273527452755276527752785279528052815282528352845285528652875288528952905291529252935294529552965297529852995300530153025303530453055306530753085309531053115312531353145315531653175318531953205321532253235324532553265327532853295330533153325333533453355336533753385339534053415342534353445345534653475348534953505351535253535354535553565357535853595360536153625363536453655366536753685369537053715372537353745375537653775378537953805381538253835384538553865387538853895390539153925393539453955396539753985399540054015402540354045405540654075408540954105411541254135414541554165417541854195420542154225423542454255426542754285429543054315432543354345435543654375438543954405441544254435444544554465447544854495450545154525453545454555456545754585459546054615462546354645465546654675468546954705471547254735474547554765477547854795480548154825483548454855486548754885489549054915492549354945495549654975498549955005501550255035504550555065507550855095510551155125513551455155516551755185519552055215522552355245525552655275528552955305531553255335534553555365537553855395540554155425543554455455546554755485549555055515552555355545555555655575558555955605561556255635564556555665567556855695570557155725573557455755576557755785579558055815582558355845585558655875588558955905591559255935594559555965597559855995600560156025603560456055606560756085609561056115612561356145615561656175618561956205621562256235624562556265627562856295630563156325633563456355636563756385639564056415642564356445645564656475648564956505651565256535654565556565657565856595660566156625663566456655666566756685669567056715672567356745675567656775678567956805681568256835684568556865687568856895690569156925693569456955696569756985699570057015702570357045705570657075708570957105711571257135714571557165717571857195720572157225723572457255726572757285729573057315732573357345735573657375738573957405741574257435744574557465747574857495750575157525753575457555756575757585759576057615762576357645765576657675768576957705771577257735774577557765777577857795780578157825783578457855786578757885789579057915792579357945795579657975798579958005801580258035804580558065807580858095810581158125813581458155816581758185819582058215822582358245825582658275828582958305831583258335834583558365837583858395840584158425843584458455846584758485849585058515852585358545855585658575858585958605861586258635864586558665867586858695870587158725873587458755876587758785879588058815882588358845885588658875888588958905891589258935894589558965897589858995900590159025903590459055906590759085909591059115912591359145915591659175918591959205921592259235924592559265927592859295930593159325933593459355936593759385939594059415942594359445945594659475948594959505951595259535954595559565957595859595960596159625963596459655966596759685969597059715972597359745975597659775978597959805981598259835984598559865987598859895990599159925993599459955996599759985999600060016002600360046005600660076008600960106011601260136014601560166017601860196020602160226023602460256026602760286029603060316032603360346035603660376038603960406041604260436044604560466047604860496050605160526053605460556056605760586059606060616062606360646065606660676068606960706071607260736074607560766077607860796080608160826083608460856086608760886089609060916092609360946095609660976098609961006101610261036104610561066107610861096110611161126113611461156116611761186119612061216122612361246125612661276128612961306131613261336134613561366137613861396140614161426143614461456146614761486149615061516152615361546155615661576158615961606161616261636164616561666167616861696170617161726173617461756176617761786179618061816182618361846185618661876188618961906191619261936194619561966197619861996200620162026203620462056206620762086209621062116212621362146215621662176218621962206221622262236224622562266227622862296230623162326233623462356236623762386239624062416242624362446245624662476248624962506251625262536254625562566257625862596260626162626263626462656266626762686269627062716272627362746275627662776278627962806281628262836284628562866287628862896290629162926293629462956296629762986299630063016302630363046305630663076308630963106311631263136314631563166317631863196320632163226323632463256326632763286329633063316332633363346335633663376338633963406341634263436344634563466347634863496350635163526353635463556356635763586359636063616362636363646365636663676368636963706371637263736374637563766377637863796380638163826383638463856386638763886389639063916392639363946395639663976398639964006401640264036404640564066407640864096410641164126413641464156416641764186419642064216422642364246425642664276428642964306431643264336434643564366437643864396440644164426443644464456446644764486449645064516452645364546455645664576458645964606461646264636464646564666467646864696470647164726473647464756476647764786479648064816482648364846485648664876488648964906491649264936494649564966497649864996500650165026503650465056506650765086509651065116512651365146515651665176518651965206521652265236524652565266527652865296530653165326533653465356536653765386539654065416542654365446545654665476548654965506551655265536554655565566557655865596560656165626563656465656566656765686569657065716572657365746575657665776578657965806581658265836584658565866587658865896590659165926593659465956596659765986599660066016602660366046605660666076608660966106611661266136614661566166617661866196620662166226623662466256626662766286629663066316632663366346635663666376638663966406641664266436644664566466647664866496650665166526653665466556656665766586659666066616662666366646665666666676668666966706671667266736674667566766677667866796680668166826683668466856686668766886689669066916692669366946695669666976698669967006701670267036704670567066707670867096710671167126713671467156716671767186719672067216722672367246725672667276728672967306731673267336734673567366737673867396740674167426743674467456746674767486749675067516752675367546755675667576758675967606761676267636764676567666767676867696770677167726773677467756776677767786779678067816782678367846785678667876788678967906791679267936794679567966797679867996800680168026803680468056806680768086809681068116812681368146815681668176818681968206821682268236824682568266827682868296830683168326833683468356836683768386839684068416842684368446845684668476848684968506851685268536854685568566857685868596860686168626863686468656866686768686869687068716872687368746875687668776878687968806881688268836884688568866887688868896890689168926893689468956896689768986899690069016902690369046905690669076908690969106911691269136914691569166917691869196920692169226923692469256926692769286929693069316932693369346935693669376938693969406941694269436944694569466947694869496950695169526953695469556956695769586959696069616962696369646965696669676968696969706971697269736974697569766977697869796980698169826983698469856986698769886989699069916992699369946995699669976998699970007001700270037004700570067007700870097010701170127013701470157016701770187019702070217022702370247025702670277028702970307031703270337034703570367037703870397040704170427043704470457046704770487049705070517052705370547055705670577058705970607061706270637064706570667067706870697070707170727073707470757076707770787079708070817082708370847085708670877088708970907091709270937094709570967097709870997100710171027103710471057106710771087109711071117112711371147115711671177118711971207121712271237124712571267127712871297130713171327133713471357136713771387139714071417142714371447145714671477148714971507151715271537154715571567157715871597160716171627163716471657166716771687169717071717172717371747175717671777178717971807181718271837184718571867187718871897190719171927193719471957196719771987199720072017202720372047205720672077208720972107211721272137214721572167217721872197220722172227223722472257226722772287229723072317232723372347235723672377238723972407241724272437244724572467247724872497250725172527253725472557256725772587259726072617262726372647265726672677268726972707271727272737274727572767277727872797280728172827283728472857286728772887289729072917292729372947295729672977298729973007301730273037304730573067307730873097310731173127313731473157316731773187319732073217322732373247325732673277328732973307331733273337334733573367337733873397340734173427343734473457346734773487349735073517352735373547355735673577358735973607361736273637364736573667367736873697370737173727373737473757376737773787379738073817382738373847385738673877388738973907391739273937394739573967397739873997400740174027403740474057406740774087409741074117412741374147415741674177418741974207421742274237424742574267427742874297430743174327433743474357436743774387439744074417442744374447445744674477448744974507451745274537454745574567457745874597460746174627463746474657466746774687469747074717472747374747475747674777478747974807481748274837484748574867487748874897490749174927493749474957496749774987499750075017502750375047505750675077508750975107511751275137514751575167517751875197520752175227523752475257526752775287529753075317532753375347535753675377538753975407541754275437544754575467547754875497550755175527553755475557556755775587559756075617562756375647565756675677568756975707571757275737574757575767577757875797580758175827583758475857586758775887589759075917592759375947595759675977598759976007601760276037604760576067607760876097610761176127613761476157616761776187619762076217622762376247625762676277628762976307631763276337634763576367637763876397640764176427643764476457646764776487649765076517652765376547655765676577658765976607661766276637664766576667667766876697670767176727673767476757676767776787679768076817682768376847685768676877688768976907691769276937694769576967697769876997700770177027703770477057706770777087709771077117712771377147715771677177718771977207721772277237724772577267727772877297730773177327733773477357736773777387739774077417742774377447745774677477748774977507751775277537754775577567757775877597760776177627763776477657766776777687769777077717772777377747775777677777778777977807781778277837784778577867787778877897790779177927793779477957796779777987799780078017802780378047805780678077808780978107811781278137814781578167817781878197820782178227823782478257826782778287829783078317832783378347835783678377838783978407841784278437844784578467847784878497850785178527853785478557856785778587859786078617862786378647865786678677868786978707871787278737874787578767877787878797880788178827883788478857886788778887889789078917892789378947895789678977898789979007901790279037904790579067907790879097910791179127913791479157916791779187919792079217922792379247925792679277928792979307931793279337934793579367937793879397940794179427943794479457946794779487949795079517952795379547955795679577958795979607961796279637964796579667967796879697970797179727973797479757976797779787979798079817982798379847985798679877988798979907991799279937994799579967997799879998000800180028003800480058006800780088009801080118012801380148015801680178018801980208021802280238024802580268027802880298030803180328033803480358036803780388039804080418042804380448045804680478048804980508051805280538054805580568057805880598060806180628063806480658066806780688069807080718072807380748075807680778078807980808081808280838084808580868087808880898090809180928093809480958096809780988099810081018102810381048105810681078108810981108111811281138114811581168117811881198120812181228123812481258126812781288129813081318132813381348135813681378138813981408141814281438144814581468147814881498150815181528153815481558156815781588159816081618162816381648165816681678168816981708171817281738174817581768177817881798180818181828183818481858186818781888189819081918192819381948195819681978198819982008201820282038204820582068207820882098210821182128213821482158216821782188219822082218222822382248225822682278228822982308231823282338234823582368237823882398240824182428243824482458246824782488249825082518252825382548255825682578258825982608261826282638264826582668267826882698270827182728273827482758276827782788279828082818282828382848285828682878288828982908291829282938294829582968297829882998300830183028303830483058306830783088309831083118312831383148315831683178318831983208321832283238324832583268327832883298330833183328333833483358336833783388339834083418342834383448345834683478348834983508351835283538354835583568357835883598360836183628363836483658366836783688369837083718372837383748375837683778378837983808381838283838384838583868387838883898390839183928393839483958396839783988399840084018402840384048405840684078408840984108411841284138414841584168417841884198420842184228423842484258426842784288429843084318432843384348435843684378438843984408441844284438444844584468447844884498450845184528453845484558456845784588459846084618462846384648465846684678468846984708471847284738474847584768477847884798480848184828483848484858486848784888489849084918492849384948495849684978498849985008501850285038504850585068507850885098510851185128513851485158516851785188519852085218522852385248525852685278528852985308531853285338534853585368537853885398540854185428543854485458546854785488549855085518552855385548555855685578558855985608561856285638564856585668567856885698570857185728573857485758576857785788579858085818582858385848585858685878588858985908591859285938594859585968597859885998600860186028603860486058606860786088609861086118612861386148615861686178618861986208621862286238624862586268627862886298630863186328633863486358636863786388639864086418642864386448645864686478648864986508651865286538654865586568657865886598660866186628663866486658666866786688669867086718672867386748675867686778678867986808681868286838684868586868687868886898690869186928693869486958696869786988699870087018702870387048705870687078708870987108711871287138714871587168717871887198720872187228723872487258726872787288729873087318732873387348735873687378738873987408741874287438744874587468747874887498750875187528753875487558756875787588759876087618762876387648765876687678768876987708771877287738774877587768777877887798780878187828783878487858786878787888789879087918792879387948795879687978798879988008801880288038804880588068807880888098810881188128813881488158816881788188819882088218822882388248825882688278828882988308831883288338834883588368837883888398840884188428843884488458846884788488849885088518852885388548855885688578858885988608861886288638864886588668867886888698870887188728873887488758876887788788879888088818882888388848885888688878888888988908891889288938894889588968897889888998900890189028903890489058906890789088909891089118912891389148915891689178918891989208921892289238924892589268927892889298930893189328933893489358936893789388939894089418942894389448945894689478948894989508951895289538954895589568957895889598960896189628963896489658966896789688969897089718972897389748975897689778978897989808981898289838984898589868987898889898990899189928993899489958996899789988999900090019002900390049005900690079008900990109011901290139014901590169017901890199020902190229023902490259026902790289029903090319032903390349035903690379038903990409041904290439044904590469047904890499050905190529053905490559056905790589059906090619062906390649065906690679068906990709071907290739074907590769077907890799080908190829083908490859086908790889089909090919092909390949095909690979098909991009101910291039104910591069107910891099110911191129113911491159116911791189119912091219122912391249125912691279128912991309131913291339134913591369137913891399140914191429143914491459146914791489149915091519152915391549155915691579158915991609161916291639164916591669167916891699170917191729173917491759176917791789179918091819182918391849185918691879188918991909191919291939194919591969197919891999200920192029203920492059206920792089209921092119212921392149215921692179218921992209221922292239224922592269227922892299230923192329233923492359236923792389239924092419242924392449245924692479248924992509251925292539254925592569257925892599260926192629263926492659266926792689269927092719272927392749275927692779278927992809281928292839284928592869287928892899290929192929293929492959296929792989299930093019302930393049305930693079308930993109311931293139314931593169317931893199320932193229323932493259326932793289329933093319332933393349335933693379338933993409341934293439344934593469347934893499350935193529353935493559356935793589359936093619362936393649365936693679368936993709371937293739374937593769377937893799380938193829383938493859386938793889389939093919392939393949395939693979398939994009401940294039404940594069407940894099410941194129413941494159416941794189419942094219422942394249425942694279428942994309431943294339434943594369437943894399440944194429443944494459446944794489449945094519452945394549455945694579458945994609461946294639464946594669467946894699470947194729473947494759476947794789479948094819482948394849485948694879488948994909491949294939494949594969497949894999500950195029503950495059506950795089509951095119512951395149515951695179518951995209521952295239524952595269527952895299530953195329533953495359536953795389539954095419542954395449545954695479548954995509551955295539554955595569557955895599560956195629563956495659566956795689569957095719572957395749575957695779578957995809581958295839584958595869587958895899590959195929593959495959596959795989599960096019602960396049605960696079608960996109611961296139614961596169617961896199620962196229623962496259626962796289629963096319632963396349635963696379638963996409641964296439644964596469647964896499650965196529653965496559656965796589659966096619662966396649665966696679668966996709671967296739674967596769677967896799680968196829683968496859686968796889689969096919692969396949695969696979698969997009701970297039704970597069707970897099710971197129713971497159716971797189719972097219722972397249725972697279728972997309731973297339734973597369737973897399740974197429743974497459746974797489749975097519752975397549755975697579758975997609761976297639764976597669767976897699770977197729773977497759776977797789779978097819782978397849785978697879788978997909791979297939794979597969797979897999800980198029803980498059806980798089809981098119812981398149815981698179818981998209821982298239824982598269827982898299830983198329833983498359836983798389839984098419842984398449845984698479848984998509851985298539854985598569857985898599860986198629863986498659866986798689869987098719872987398749875987698779878987998809881988298839884988598869887988898899890989198929893989498959896989798989899990099019902990399049905990699079908990999109911991299139914991599169917991899199920992199229923992499259926992799289929993099319932993399349935993699379938993999409941994299439944994599469947994899499950995199529953995499559956995799589959996099619962996399649965996699679968996999709971997299739974997599769977997899799980998199829983998499859986998799889989999099919992999399949995999699979998999910000100011000210003100041000510006100071000810009100101001110012100131001410015100161001710018100191002010021100221002310024100251002610027100281002910030100311003210033100341003510036100371003810039100401004110042100431004410045100461004710048100491005010051100521005310054100551005610057100581005910060100611006210063100641006510066100671006810069100701007110072100731007410075100761007710078100791008010081100821008310084100851008610087100881008910090100911009210093100941009510096100971009810099101001010110102101031010410105101061010710108101091011010111101121011310114101151011610117101181011910120101211012210123101241012510126101271012810129101301013110132101331013410135101361013710138101391014010141101421014310144101451014610147101481014910150101511015210153101541015510156101571015810159101601016110162101631016410165101661016710168101691017010171101721017310174101751017610177101781017910180101811018210183101841018510186101871018810189101901019110192101931019410195101961019710198101991020010201102021020310204102051020610207102081020910210102111021210213102141021510216102171021810219102201022110222102231022410225102261022710228102291023010231102321023310234102351023610237102381023910240102411024210243102441024510246102471024810249102501025110252102531025410255102561025710258102591026010261102621026310264102651026610267102681026910270102711027210273102741027510276102771027810279102801028110282102831028410285102861028710288102891029010291102921029310294102951029610297102981029910300103011030210303103041030510306103071030810309103101031110312103131031410315103161031710318103191032010321103221032310324103251032610327103281032910330103311033210333103341033510336103371033810339103401034110342103431034410345103461034710348103491035010351103521035310354103551035610357103581035910360103611036210363103641036510366103671036810369103701037110372103731037410375103761037710378103791038010381103821038310384103851038610387103881038910390103911039210393103941039510396103971039810399104001040110402104031040410405104061040710408104091041010411104121041310414104151041610417104181041910420104211042210423104241042510426104271042810429104301043110432104331043410435104361043710438104391044010441104421044310444104451044610447104481044910450104511045210453104541045510456104571045810459104601046110462104631046410465104661046710468104691047010471104721047310474104751047610477104781047910480104811048210483104841048510486104871048810489104901049110492104931049410495104961049710498104991050010501105021050310504105051050610507105081050910510105111051210513105141051510516105171051810519105201052110522105231052410525105261052710528105291053010531105321053310534105351053610537105381053910540105411054210543105441054510546105471054810549105501055110552105531055410555105561055710558105591056010561105621056310564105651056610567105681056910570105711057210573105741057510576105771057810579105801058110582105831058410585105861058710588105891059010591105921059310594105951059610597105981059910600106011060210603106041060510606106071060810609106101061110612106131061410615106161061710618106191062010621106221062310624106251062610627106281062910630106311063210633106341063510636106371063810639106401064110642106431064410645106461064710648106491065010651106521065310654106551065610657106581065910660106611066210663106641066510666106671066810669106701067110672106731067410675106761067710678106791068010681106821068310684106851068610687106881068910690106911069210693106941069510696106971069810699107001070110702107031070410705107061070710708107091071010711107121071310714107151071610717107181071910720107211072210723107241072510726107271072810729107301073110732107331073410735107361073710738107391074010741107421074310744107451074610747107481074910750107511075210753107541075510756107571075810759107601076110762107631076410765107661076710768107691077010771107721077310774107751077610777107781077910780107811078210783107841078510786107871078810789107901079110792107931079410795107961079710798107991080010801108021080310804108051080610807108081080910810108111081210813108141081510816108171081810819108201082110822108231082410825108261082710828108291083010831108321083310834108351083610837108381083910840108411084210843108441084510846108471084810849108501085110852108531085410855108561085710858108591086010861108621086310864108651086610867108681086910870108711087210873108741087510876108771087810879108801088110882108831088410885108861088710888108891089010891108921089310894108951089610897108981089910900109011090210903109041090510906109071090810909109101091110912109131091410915109161091710918109191092010921109221092310924109251092610927109281092910930109311093210933109341093510936109371093810939109401094110942109431094410945109461094710948109491095010951109521095310954109551095610957109581095910960109611096210963109641096510966109671096810969109701097110972109731097410975109761097710978109791098010981109821098310984109851098610987109881098910990109911099210993109941099510996109971099810999110001100111002110031100411005110061100711008110091101011011110121101311014110151101611017110181101911020110211102211023110241102511026110271102811029110301103111032110331103411035110361103711038110391104011041110421104311044110451104611047110481104911050110511105211053110541105511056110571105811059110601106111062110631106411065110661106711068110691107011071110721107311074110751107611077110781107911080110811108211083110841108511086110871108811089110901109111092110931109411095110961109711098110991110011101111021110311104111051110611107111081110911110111111111211113111141111511116111171111811119111201112111122111231112411125111261112711128111291113011131111321113311134111351113611137111381113911140111411114211143111441114511146111471114811149111501115111152111531115411155111561115711158111591116011161111621116311164111651116611167111681116911170111711117211173111741117511176111771117811179111801118111182111831118411185111861118711188111891119011191111921119311194111951119611197111981119911200112011120211203112041120511206112071120811209112101121111212112131121411215112161121711218112191122011221112221122311224112251122611227112281122911230112311123211233112341123511236112371123811239112401124111242112431124411245112461124711248112491125011251112521125311254112551125611257112581125911260112611126211263112641126511266112671126811269112701127111272112731127411275112761127711278112791128011281112821128311284112851128611287112881128911290112911129211293112941129511296112971129811299113001130111302113031130411305113061130711308113091131011311113121131311314113151131611317113181131911320113211132211323113241132511326113271132811329113301133111332113331133411335113361133711338113391134011341113421134311344113451134611347113481134911350113511135211353113541135511356113571135811359113601136111362113631136411365113661136711368113691137011371113721137311374113751137611377113781137911380113811138211383113841138511386113871138811389113901139111392113931139411395113961139711398113991140011401114021140311404114051140611407114081140911410114111141211413114141141511416114171141811419114201142111422114231142411425114261142711428114291143011431114321143311434114351143611437114381143911440114411144211443114441144511446114471144811449114501145111452114531145411455114561145711458114591146011461114621146311464114651146611467114681146911470114711147211473114741147511476114771147811479114801148111482114831148411485114861148711488114891149011491114921149311494114951149611497114981149911500115011150211503115041150511506115071150811509115101151111512115131151411515115161151711518115191152011521115221152311524115251152611527115281152911530115311153211533115341153511536115371153811539115401154111542115431154411545115461154711548115491155011551115521155311554115551155611557115581155911560115611156211563115641156511566115671156811569115701157111572115731157411575115761157711578115791158011581115821158311584115851158611587115881158911590115911159211593115941159511596115971159811599116001160111602116031160411605116061160711608116091161011611116121161311614116151161611617116181161911620116211162211623116241162511626116271162811629116301163111632116331163411635116361163711638116391164011641116421164311644116451164611647116481164911650116511165211653116541165511656116571165811659116601166111662116631166411665116661166711668116691167011671116721167311674116751167611677116781167911680116811168211683116841168511686116871168811689116901169111692116931169411695116961169711698116991170011701117021170311704117051170611707117081170911710117111171211713117141171511716117171171811719117201172111722117231172411725117261172711728117291173011731117321173311734117351173611737117381173911740117411174211743117441174511746117471174811749117501175111752117531175411755117561175711758117591176011761117621176311764117651176611767117681176911770117711177211773117741177511776117771177811779117801178111782117831178411785117861178711788117891179011791117921179311794117951179611797117981179911800118011180211803118041180511806118071180811809118101181111812118131181411815118161181711818118191182011821118221182311824118251182611827118281182911830118311183211833118341183511836118371183811839118401184111842118431184411845118461184711848118491185011851118521185311854118551185611857118581185911860118611186211863118641186511866118671186811869118701187111872118731187411875118761187711878118791188011881118821188311884118851188611887118881188911890118911189211893118941189511896118971189811899119001190111902119031190411905119061190711908119091191011911119121191311914119151191611917119181191911920119211192211923119241192511926119271192811929119301193111932119331193411935119361193711938119391194011941119421194311944119451194611947119481194911950119511195211953119541195511956119571195811959119601196111962119631196411965119661196711968119691197011971119721197311974119751197611977119781197911980119811198211983119841198511986119871198811989119901199111992119931199411995119961199711998119991200012001120021200312004120051200612007120081200912010120111201212013120141201512016120171201812019120201202112022120231202412025120261202712028120291203012031120321203312034120351203612037120381203912040120411204212043120441204512046120471204812049120501205112052120531205412055120561205712058120591206012061120621206312064120651206612067120681206912070120711207212073120741207512076120771207812079120801208112082120831208412085120861208712088120891209012091120921209312094120951209612097120981209912100121011210212103121041210512106121071210812109121101211112112121131211412115121161211712118121191212012121121221212312124121251212612127121281212912130121311213212133121341213512136121371213812139121401214112142121431214412145121461214712148121491215012151121521215312154121551215612157121581215912160121611216212163121641216512166121671216812169121701217112172121731217412175121761217712178121791218012181121821218312184121851218612187121881218912190121911219212193121941219512196121971219812199122001220112202122031220412205122061220712208122091221012211122121221312214122151221612217122181221912220122211222212223122241222512226122271222812229122301223112232122331223412235122361223712238122391224012241122421224312244122451224612247122481224912250122511225212253122541225512256122571225812259122601226112262122631226412265122661226712268122691227012271122721227312274122751227612277122781227912280122811228212283122841228512286122871228812289122901229112292122931229412295122961229712298122991230012301123021230312304123051230612307123081230912310123111231212313123141231512316123171231812319123201232112322123231232412325123261232712328123291233012331123321233312334123351233612337123381233912340123411234212343123441234512346123471234812349123501235112352123531235412355123561235712358123591236012361123621236312364123651236612367123681236912370123711237212373123741237512376123771237812379123801238112382123831238412385123861238712388123891239012391123921239312394123951239612397123981239912400124011240212403124041240512406124071240812409124101241112412124131241412415124161241712418124191242012421124221242312424124251242612427124281242912430124311243212433124341243512436124371243812439124401244112442124431244412445124461244712448124491245012451124521245312454124551245612457124581245912460124611246212463124641246512466124671246812469124701247112472124731247412475124761247712478124791248012481124821248312484124851248612487124881248912490124911249212493124941249512496124971249812499125001250112502125031250412505125061250712508125091251012511125121251312514125151251612517125181251912520125211252212523125241252512526125271252812529125301253112532125331253412535125361253712538125391254012541125421254312544125451254612547125481254912550125511255212553125541255512556125571255812559125601256112562125631256412565125661256712568125691257012571125721257312574125751257612577125781257912580125811258212583125841258512586125871258812589125901259112592125931259412595125961259712598125991260012601126021260312604126051260612607126081260912610126111261212613126141261512616126171261812619126201262112622126231262412625126261262712628126291263012631126321263312634126351263612637126381263912640126411264212643126441264512646126471264812649126501265112652126531265412655126561265712658126591266012661126621266312664126651266612667126681266912670126711267212673126741267512676126771267812679126801268112682126831268412685126861268712688126891269012691126921269312694126951269612697126981269912700127011270212703127041270512706127071270812709127101271112712127131271412715127161271712718127191272012721127221272312724127251272612727127281272912730127311273212733127341273512736127371273812739127401274112742127431274412745127461274712748127491275012751127521275312754127551275612757127581275912760127611276212763127641276512766127671276812769127701277112772127731277412775127761277712778127791278012781127821278312784127851278612787127881278912790127911279212793127941279512796127971279812799128001280112802128031280412805128061280712808128091281012811128121281312814128151281612817128181281912820128211282212823128241282512826128271282812829128301283112832128331283412835128361283712838128391284012841128421284312844128451284612847128481284912850128511285212853128541285512856128571285812859128601286112862128631286412865128661286712868128691287012871128721287312874128751287612877128781287912880128811288212883128841288512886128871288812889128901289112892128931289412895128961289712898128991290012901129021290312904129051290612907129081290912910129111291212913129141291512916129171291812919129201292112922129231292412925129261292712928129291293012931129321293312934129351293612937129381293912940129411294212943129441294512946129471294812949129501295112952129531295412955129561295712958129591296012961129621296312964129651296612967129681296912970129711297212973129741297512976129771297812979129801298112982129831298412985129861298712988129891299012991129921299312994129951299612997129981299913000130011300213003130041300513006130071300813009130101301113012130131301413015130161301713018130191302013021130221302313024130251302613027130281302913030130311303213033130341303513036130371303813039130401304113042130431304413045130461304713048130491305013051130521305313054130551305613057130581305913060130611306213063130641306513066130671306813069130701307113072130731307413075130761307713078130791308013081130821308313084130851308613087130881308913090130911309213093130941309513096130971309813099131001310113102131031310413105131061310713108131091311013111131121311313114131151311613117131181311913120131211312213123131241312513126131271312813129131301313113132131331313413135131361313713138131391314013141131421314313144131451314613147131481314913150131511315213153131541315513156131571315813159131601316113162131631316413165131661316713168131691317013171131721317313174131751317613177131781317913180131811318213183131841318513186131871318813189131901319113192131931319413195131961319713198131991320013201132021320313204132051320613207132081320913210132111321213213132141321513216132171321813219132201322113222132231322413225132261322713228132291323013231132321323313234132351323613237132381323913240132411324213243132441324513246132471324813249132501325113252132531325413255132561325713258132591326013261132621326313264132651326613267132681326913270132711327213273132741327513276132771327813279132801328113282132831328413285132861328713288132891329013291132921329313294132951329613297132981329913300133011330213303133041330513306133071330813309133101331113312133131331413315133161331713318133191332013321133221332313324133251332613327133281332913330133311333213333133341333513336133371333813339133401334113342133431334413345133461334713348133491335013351133521335313354133551335613357133581335913360133611336213363133641336513366133671336813369133701337113372133731337413375133761337713378133791338013381133821338313384133851338613387133881338913390133911339213393133941339513396133971339813399134001340113402134031340413405134061340713408134091341013411134121341313414134151341613417134181341913420134211342213423134241342513426134271342813429134301343113432134331343413435134361343713438134391344013441134421344313444134451344613447134481344913450134511345213453134541345513456134571345813459134601346113462134631346413465134661346713468134691347013471134721347313474134751347613477134781347913480134811348213483134841348513486134871348813489134901349113492134931349413495134961349713498134991350013501135021350313504135051350613507135081350913510135111351213513135141351513516135171351813519135201352113522135231352413525135261352713528135291353013531135321353313534135351353613537135381353913540135411354213543135441354513546135471354813549135501355113552135531355413555135561355713558135591356013561135621356313564135651356613567135681356913570135711357213573135741357513576135771357813579135801358113582135831358413585135861358713588135891359013591135921359313594135951359613597135981359913600136011360213603136041360513606136071360813609136101361113612136131361413615136161361713618136191362013621136221362313624136251362613627136281362913630136311363213633136341363513636136371363813639136401364113642136431364413645136461364713648136491365013651136521365313654136551365613657136581365913660136611366213663136641366513666136671366813669136701367113672136731367413675136761367713678136791368013681136821368313684136851368613687136881368913690136911369213693136941369513696136971369813699137001370113702137031370413705137061370713708137091371013711137121371313714137151371613717137181371913720137211372213723137241372513726137271372813729137301373113732137331373413735137361373713738137391374013741137421374313744137451374613747137481374913750137511375213753137541375513756137571375813759137601376113762137631376413765137661376713768137691377013771137721377313774137751377613777137781377913780137811378213783137841378513786137871378813789137901379113792137931379413795137961379713798137991380013801138021380313804138051380613807138081380913810138111381213813138141381513816138171381813819138201382113822138231382413825138261382713828138291383013831138321383313834138351383613837138381383913840138411384213843138441384513846138471384813849138501385113852138531385413855138561385713858138591386013861138621386313864138651386613867138681386913870138711387213873138741387513876138771387813879138801388113882138831388413885138861388713888138891389013891138921389313894138951389613897138981389913900139011390213903139041390513906139071390813909139101391113912139131391413915139161391713918139191392013921139221392313924139251392613927139281392913930139311393213933139341393513936139371393813939139401394113942139431394413945139461394713948139491395013951139521395313954139551395613957139581395913960139611396213963139641396513966139671396813969139701397113972139731397413975139761397713978139791398013981139821398313984139851398613987139881398913990139911399213993139941399513996139971399813999140001400114002140031400414005140061400714008140091401014011140121401314014140151401614017140181401914020140211402214023140241402514026140271402814029140301403114032140331403414035140361403714038140391404014041140421404314044140451404614047140481404914050140511405214053140541405514056140571405814059140601406114062140631406414065140661406714068140691407014071140721407314074140751407614077140781407914080140811408214083140841408514086140871408814089140901409114092140931409414095140961409714098140991410014101141021410314104141051410614107141081410914110141111411214113141141411514116141171411814119141201412114122141231412414125141261412714128141291413014131141321413314134141351413614137141381413914140141411414214143141441414514146141471414814149141501415114152141531415414155141561415714158141591416014161141621416314164141651416614167141681416914170141711417214173141741417514176141771417814179141801418114182141831418414185141861418714188141891419014191141921419314194141951419614197141981419914200142011420214203142041420514206142071420814209142101421114212142131421414215142161421714218142191422014221142221422314224142251422614227142281422914230142311423214233142341423514236142371423814239142401424114242142431424414245142461424714248142491425014251142521425314254142551425614257142581425914260142611426214263142641426514266142671426814269142701427114272142731427414275142761427714278142791428014281142821428314284142851428614287142881428914290142911429214293142941429514296142971429814299143001430114302143031430414305143061430714308143091431014311143121431314314143151431614317143181431914320143211432214323143241432514326143271432814329143301433114332143331433414335143361433714338143391434014341143421434314344143451434614347143481434914350143511435214353143541435514356143571435814359143601436114362143631436414365143661436714368143691437014371143721437314374143751437614377143781437914380143811438214383143841438514386143871438814389143901439114392143931439414395143961439714398143991440014401144021440314404144051440614407144081440914410144111441214413144141441514416144171441814419144201442114422144231442414425144261442714428144291443014431144321443314434144351443614437144381443914440144411444214443144441444514446144471444814449144501445114452144531445414455144561445714458144591446014461144621446314464144651446614467144681446914470144711447214473144741447514476144771447814479144801448114482144831448414485144861448714488144891449014491144921449314494144951449614497144981449914500145011450214503145041450514506145071450814509145101451114512145131451414515145161451714518145191452014521145221452314524145251452614527145281452914530145311453214533145341453514536145371453814539145401454114542145431454414545145461454714548145491455014551145521455314554145551455614557145581455914560145611456214563145641456514566145671456814569145701457114572145731457414575145761457714578145791458014581145821458314584145851458614587145881458914590145911459214593145941459514596145971459814599146001460114602146031460414605146061460714608146091461014611146121461314614146151461614617146181461914620146211462214623146241462514626146271462814629146301463114632146331463414635146361463714638146391464014641146421464314644146451464614647146481464914650146511465214653146541465514656146571465814659146601466114662146631466414665146661466714668146691467014671146721467314674146751467614677146781467914680146811468214683146841468514686146871468814689146901469114692146931469414695146961469714698146991470014701147021470314704147051470614707147081470914710147111471214713147141471514716147171471814719147201472114722147231472414725147261472714728147291473014731147321473314734147351473614737147381473914740147411474214743147441474514746147471474814749147501475114752147531475414755147561475714758147591476014761147621476314764147651476614767147681476914770147711477214773147741477514776147771477814779147801478114782147831478414785147861478714788147891479014791147921479314794147951479614797147981479914800148011480214803148041480514806148071480814809148101481114812148131481414815148161481714818148191482014821148221482314824148251482614827148281482914830148311483214833148341483514836148371483814839148401484114842148431484414845148461484714848148491485014851148521485314854148551485614857148581485914860148611486214863148641486514866148671486814869148701487114872148731487414875148761487714878148791488014881148821488314884148851488614887148881488914890148911489214893148941489514896148971489814899149001490114902149031490414905149061490714908149091491014911149121491314914149151491614917149181491914920149211492214923149241492514926149271492814929149301493114932149331493414935149361493714938149391494014941149421494314944149451494614947149481494914950149511495214953149541495514956149571495814959149601496114962149631496414965149661496714968149691497014971149721497314974149751497614977149781497914980149811498214983149841498514986149871498814989149901499114992149931499414995149961499714998149991500015001150021500315004150051500615007
  1. /**
  2. * Copyright (c) 2006-2012, JGraph Ltd
  3. */
  4. // Workaround for handling named HTML entities in mxUtils.parseXml
  5. // LATER: How to configure DOMParser to just ignore all entities?
  6. (function()
  7. {
  8. var entities = [
  9. ['nbsp', '160'],
  10. ['shy', '173']
  11. ];
  12. var parseXml = mxUtils.parseXml;
  13. mxUtils.parseXml = function(text)
  14. {
  15. for (var i = 0; i < entities.length; i++)
  16. {
  17. text = text.replace(new RegExp(
  18. '&' + entities[i][0] + ';', 'g'),
  19. '&#' + entities[i][1] + ';');
  20. }
  21. return parseXml(text);
  22. };
  23. })();
  24. // Shim for missing toISOString in older versions of IE
  25. // See https://stackoverflow.com/questions/12907862
  26. if (!Date.prototype.toISOString)
  27. {
  28. (function()
  29. {
  30. function pad(number)
  31. {
  32. var r = String(number);
  33. if (r.length === 1)
  34. {
  35. r = '0' + r;
  36. }
  37. return r;
  38. };
  39. Date.prototype.toISOString = function()
  40. {
  41. return this.getUTCFullYear()
  42. + '-' + pad( this.getUTCMonth() + 1 )
  43. + '-' + pad( this.getUTCDate() )
  44. + 'T' + pad( this.getUTCHours() )
  45. + ':' + pad( this.getUTCMinutes() )
  46. + ':' + pad( this.getUTCSeconds() )
  47. + '.' + String( (this.getUTCMilliseconds()/1000).toFixed(3) ).slice( 2, 5 )
  48. + 'Z';
  49. };
  50. }());
  51. }
  52. // Shim for Date.now()
  53. if (!Date.now)
  54. {
  55. Date.now = function()
  56. {
  57. return new Date().getTime();
  58. };
  59. }
  60. // Polyfill for Uint8Array.from in IE11 used in Graph.decompress
  61. // See https://stackoverflow.com/questions/36810940/alternative-or-polyfill-for-array-from-on-the-internet-explorer
  62. if (!Uint8Array.from) {
  63. Uint8Array.from = (function () {
  64. var toStr = Object.prototype.toString;
  65. var isCallable = function (fn) {
  66. return typeof fn === 'function' || toStr.call(fn) === '[object Function]';
  67. };
  68. var toInteger = function (value) {
  69. var number = Number(value);
  70. if (isNaN(number)) { return 0; }
  71. if (number === 0 || !isFinite(number)) { return number; }
  72. return (number > 0 ? 1 : -1) * Math.floor(Math.abs(number));
  73. };
  74. var maxSafeInteger = Math.pow(2, 53) - 1;
  75. var toLength = function (value) {
  76. var len = toInteger(value);
  77. return Math.min(Math.max(len, 0), maxSafeInteger);
  78. };
  79. // The length property of the from method is 1.
  80. return function from(arrayLike/*, mapFn, thisArg */) {
  81. // 1. Let C be the this value.
  82. var C = this;
  83. // 2. Let items be ToObject(arrayLike).
  84. var items = Object(arrayLike);
  85. // 3. ReturnIfAbrupt(items).
  86. if (arrayLike == null) {
  87. throw new TypeError("Array.from requires an array-like object - not null or undefined");
  88. }
  89. // 4. If mapfn is undefined, then let mapping be false.
  90. var mapFn = arguments.length > 1 ? arguments[1] : void undefined;
  91. var T;
  92. if (typeof mapFn !== 'undefined') {
  93. // 5. else
  94. // 5. a If IsCallable(mapfn) is false, throw a TypeError exception.
  95. if (!isCallable(mapFn)) {
  96. throw new TypeError('Array.from: when provided, the second argument must be a function');
  97. }
  98. // 5. b. If thisArg was supplied, let T be thisArg; else let T be undefined.
  99. if (arguments.length > 2) {
  100. T = arguments[2];
  101. }
  102. }
  103. // 10. Let lenValue be Get(items, "length").
  104. // 11. Let len be ToLength(lenValue).
  105. var len = toLength(items.length);
  106. // 13. If IsConstructor(C) is true, then
  107. // 13. a. Let A be the result of calling the [[Construct]] internal method of C with an argument list containing the single item len.
  108. // 14. a. Else, Let A be ArrayCreate(len).
  109. var A = isCallable(C) ? Object(new C(len)) : new Array(len);
  110. // 16. Let k be 0.
  111. var k = 0;
  112. // 17. Repeat, while k < len… (also steps a - h)
  113. var kValue;
  114. while (k < len) {
  115. kValue = items[k];
  116. if (mapFn) {
  117. A[k] = typeof T === 'undefined' ? mapFn(kValue, k) : mapFn.call(T, kValue, k);
  118. } else {
  119. A[k] = kValue;
  120. }
  121. k += 1;
  122. }
  123. // 18. Let putStatus be Put(A, "length", len, true).
  124. A.length = len;
  125. // 20. Return A.
  126. return A;
  127. };
  128. }());
  129. }
  130. /**
  131. * Measurements Units
  132. */
  133. mxConstants.POINTS = 1;
  134. mxConstants.MILLIMETERS = 2;
  135. mxConstants.INCHES = 3;
  136. mxConstants.METERS = 4;
  137. /**
  138. * This ratio is with page scale 1
  139. */
  140. mxConstants.PIXELS_PER_MM = 3.937;
  141. mxConstants.PIXELS_PER_INCH = 100;
  142. mxConstants.SHADOW_OPACITY = 0.25;
  143. mxConstants.SHADOWCOLOR = '#000000';
  144. mxConstants.VML_SHADOWCOLOR = '#d0d0d0';
  145. mxCodec.allowlist = ['mxStylesheet', 'Array', 'mxGraphModel',
  146. 'mxCell', 'mxGeometry', 'mxRectangle', 'mxPoint',
  147. 'mxChildChange', 'mxRootChange', 'mxTerminalChange',
  148. 'mxValueChange', 'mxStyleChange', 'mxGeometryChange',
  149. 'mxCollapseChange', 'mxVisibleChange', 'mxCellAttributeChange'];
  150. mxGraph.prototype.pageBreakColor = '#c0c0c0';
  151. mxGraph.prototype.pageScale = 1;
  152. // Letter page format is default in US, Canada and Mexico
  153. (function()
  154. {
  155. try
  156. {
  157. if (navigator != null && navigator.language != null)
  158. {
  159. var lang = navigator.language.toLowerCase();
  160. mxGraph.prototype.pageFormat = (lang === 'en-us' || lang === 'en-ca' || lang === 'es-mx') ?
  161. mxConstants.PAGE_FORMAT_LETTER_PORTRAIT : mxConstants.PAGE_FORMAT_A4_PORTRAIT;
  162. }
  163. }
  164. catch (e)
  165. {
  166. // ignore
  167. }
  168. })();
  169. // Matches label positions of mxGraph 1.x
  170. mxText.prototype.baseSpacingTop = 5;
  171. mxText.prototype.baseSpacingBottom = 1;
  172. // Keeps edges between relative child cells inside parent
  173. mxGraphModel.prototype.ignoreRelativeEdgeParent = false;
  174. // Defines grid properties
  175. mxGraphView.prototype.gridImage = (mxClient.IS_SVG) ? 'data:image/gif;base64,R0lGODlhCgAKAJEAAAAAAP///8zMzP///yH5BAEAAAMALAAAAAAKAAoAAAIJ1I6py+0Po2wFADs=' :
  176. IMAGE_PATH + '/grid.gif';
  177. mxGraphView.prototype.gridSteps = 4;
  178. mxGraphView.prototype.minGridSize = 4;
  179. // UrlParams is null in embed mode
  180. mxGraphView.prototype.defaultGridColor = '#d0d0d0';
  181. mxGraphView.prototype.defaultDarkGridColor = '#424242';
  182. mxGraphView.prototype.gridColor = mxGraphView.prototype.defaultGridColor;
  183. // Units
  184. mxGraphView.prototype.unit = mxConstants.POINTS;
  185. mxGraphView.prototype.setUnit = function(unit)
  186. {
  187. if (this.unit != unit)
  188. {
  189. this.unit = unit;
  190. this.fireEvent(new mxEventObject('unitChanged', 'unit', unit));
  191. }
  192. };
  193. // Alternative text for unsupported foreignObjects
  194. mxSvgCanvas2D.prototype.foAltText = '[Not supported by viewer]';
  195. // Hook for custom constraints
  196. mxShape.prototype.getConstraints = function(style, w, h)
  197. {
  198. return null;
  199. };
  200. // Override for clipSvg style
  201. mxImageShape.prototype.getImageDataUri = function()
  202. {
  203. var src = this.image;
  204. if (src.substring(0, 26) == 'data:image/svg+xml;base64,' && this.style != null &&
  205. mxUtils.getValue(this.style, 'clipSvg', '0') == '1')
  206. {
  207. if (this.clippedSvg == null || this.clippedImage != src)
  208. {
  209. this.clippedSvg = Graph.clipSvgDataUri(src, true);
  210. this.clippedImage = src;
  211. }
  212. src = this.clippedSvg;
  213. }
  214. return src;
  215. };
  216. // Override to use key as fallback
  217. (function()
  218. {
  219. var mxResourcesGet = mxResources.get;
  220. mxResources.get = function(key, params, defaultValue)
  221. {
  222. if (defaultValue == null)
  223. {
  224. defaultValue = key;
  225. }
  226. return mxResourcesGet.apply(this, [key, params, defaultValue]);
  227. };
  228. })();
  229. /**
  230. * Constructs a new graph instance. Note that the constructor does not take a
  231. * container because the graph instance is needed for creating the UI, which
  232. * in turn will create the container for the graph. Hence, the container is
  233. * assigned later in EditorUi.
  234. */
  235. /**
  236. * Defines graph class.
  237. */
  238. Graph = function(container, model, renderHint, stylesheet, themes, standalone)
  239. {
  240. mxGraph.call(this, container, model, renderHint, stylesheet);
  241. this.themes = themes || this.defaultThemes;
  242. this.currentEdgeStyle = mxUtils.clone(this.defaultEdgeStyle);
  243. this.currentVertexStyle = mxUtils.clone(this.defaultVertexStyle);
  244. this.standalone = (standalone != null) ? standalone : false;
  245. // Sets the base domain URL and domain path URL for relative links.
  246. var b = this.baseUrl;
  247. var p = b.indexOf('//');
  248. this.domainUrl = '';
  249. this.domainPathUrl = '';
  250. if (p > 0)
  251. {
  252. var d = b.indexOf('/', p + 2);
  253. if (d > 0)
  254. {
  255. this.domainUrl = b.substring(0, d);
  256. }
  257. d = b.lastIndexOf('/');
  258. if (d > 0)
  259. {
  260. this.domainPathUrl = b.substring(0, d + 1);
  261. }
  262. }
  263. // Adds support for HTML labels via style. Note: Currently, only the Java
  264. // backend supports HTML labels but CSS support is limited to the following:
  265. // http://docs.oracle.com/javase/6/docs/api/index.html?javax/swing/text/html/CSS.html
  266. // TODO: Wrap should not affect isHtmlLabel output (should be handled later)
  267. this.isHtmlLabel = function(cell)
  268. {
  269. var style = this.getCurrentCellStyle(cell);
  270. return (style != null) ? (style['html'] == '1' || style[mxConstants.STYLE_WHITE_SPACE] == 'wrap') : false;
  271. };
  272. // Implements a listener for hover and click handling on edges and tables
  273. if (this.immediateHandling)
  274. {
  275. var start = {
  276. point: null,
  277. event: null,
  278. state: null,
  279. handle: null,
  280. selected: false
  281. };
  282. var initialSelected = false;
  283. // Uses this event to process mouseDown to check the selection state before it is changed
  284. this.addListener(mxEvent.FIRE_MOUSE_EVENT, mxUtils.bind(this, function(sender, evt)
  285. {
  286. if (evt.getProperty('eventName') == 'mouseDown' && this.isEnabled())
  287. {
  288. var me = evt.getProperty('event');
  289. var state = me.getState();
  290. var s = this.view.scale;
  291. if (!mxEvent.isAltDown(me.getEvent()) && state != null)
  292. {
  293. initialSelected = this.isCellSelected(state.cell);
  294. if (!this.panningHandler.isActive() && !mxEvent.isControlDown(me.getEvent()))
  295. {
  296. var handler = this.selectionCellsHandler.getHandler(state.cell);
  297. // Cell handles have precedence over row and col resize
  298. if (handler == null || handler.getHandleForEvent(me) == null)
  299. {
  300. var box = new mxRectangle(me.getGraphX() - 1, me.getGraphY() - 1);
  301. var tol = mxEvent.isTouchEvent(me.getEvent()) ?
  302. mxShape.prototype.svgStrokeTolerance - 1 :
  303. (mxShape.prototype.svgStrokeTolerance + 2) / 2;
  304. var t1 = tol + 2;
  305. box.grow(tol);
  306. // Ignores clicks inside cell to avoid delayed selection on
  307. // merged cells when clicking on invisible part of dividers
  308. if (this.isTableCell(state.cell) && this.isCellMovable(state.cell) &&
  309. !this.isCellSelected(state.cell) &&
  310. (!mxUtils.contains(state, me.getGraphX() - t1, me.getGraphY() - t1) ||
  311. !mxUtils.contains(state, me.getGraphX() - t1, me.getGraphY() + t1) ||
  312. !mxUtils.contains(state, me.getGraphX() + t1, me.getGraphY() + t1) ||
  313. !mxUtils.contains(state, me.getGraphX() + t1, me.getGraphY() - t1)))
  314. {
  315. var row = this.model.getParent(state.cell);
  316. var table = this.model.getParent(row);
  317. if (!this.isCellSelected(table))
  318. {
  319. var b = tol * s;
  320. var b2 = 2 * b;
  321. // Ignores events on top line of top row and left line of left column
  322. if ((this.model.getChildAt(table, 0) != row) && mxUtils.intersects(box,
  323. new mxRectangle(state.x, state.y - b, state.width, b2)) ||
  324. (this.model.getChildAt(row, 0) != state.cell) && mxUtils.intersects(box,
  325. new mxRectangle(state.x - b, state.y, b2, state.height)) ||
  326. mxUtils.intersects(box, new mxRectangle(state.x, state.y + state.height - b, state.width, b2)) ||
  327. mxUtils.intersects(box, new mxRectangle(state.x + state.width - b, state.y, b2, state.height)))
  328. {
  329. var wasSelected = this.selectionCellsHandler.isHandled(table);
  330. this.selectCellForEvent(table, me.getEvent());
  331. handler = this.selectionCellsHandler.getHandler(table);
  332. if (handler != null)
  333. {
  334. var handle = handler.getHandleForEvent(me);
  335. if (handle != null)
  336. {
  337. handler.start(me.getGraphX(), me.getGraphY(), handle);
  338. handler.blockDelayedSelection = !wasSelected;
  339. me.consume();
  340. }
  341. }
  342. }
  343. }
  344. }
  345. // Hover for swimlane start sizes inside tables
  346. var current = state;
  347. while (!me.isConsumed() && current != null && (this.isTableCell(current.cell) ||
  348. this.isTableRow(current.cell) || this.isTable(current.cell)))
  349. {
  350. if (this.isSwimlane(current.cell) && this.isCellMovable(current.cell))
  351. {
  352. var offset = this.getActualStartSize(current.cell);
  353. if (((offset.x > 0 || offset.width > 0) && mxUtils.intersects(box, new mxRectangle(
  354. current.x + (offset.x - offset.width - 1) * s + ((offset.x == 0) ? current.width : 0),
  355. current.y, 1, current.height))) || ((offset.y > 0 || offset.height > 0) &&
  356. mxUtils.intersects(box, new mxRectangle(current.x, current.y + (offset.y -
  357. offset.height - 1) * s + ((offset.y == 0) ? current.height : 0), current.width, 1))))
  358. {
  359. this.selectCellForEvent(current.cell, me.getEvent());
  360. handler = this.selectionCellsHandler.getHandler(current.cell);
  361. if (handler != null && handler.customHandles != null)
  362. {
  363. // Swimlane start size handle is last custom handle
  364. var handle = mxEvent.CUSTOM_HANDLE - handler.customHandles.length + 1;
  365. handler.start(me.getGraphX(), me.getGraphY(), handle);
  366. me.consume();
  367. }
  368. }
  369. }
  370. current = this.view.getState(this.model.getParent(current.cell));
  371. }
  372. }
  373. }
  374. }
  375. }
  376. }));
  377. // Uses this event to process mouseDown to check the selection state before it is changed
  378. this.addListener(mxEvent.CONSUME_MOUSE_EVENT, mxUtils.bind(this, function(sender, evt)
  379. {
  380. if (evt.getProperty('eventName') == 'mouseDown' && this.isEnabled())
  381. {
  382. var me = evt.getProperty('event');
  383. var state = me.getState();
  384. if (!mxEvent.isAltDown(me.getEvent()) && !mxEvent.isControlDown(evt) &&
  385. !mxEvent.isShiftDown(evt) && !initialSelected &&
  386. state != null && this.model.isEdge(state.cell))
  387. {
  388. start.point = new mxPoint(me.getGraphX(), me.getGraphY());
  389. start.selected = this.isCellSelected(state.cell);
  390. start.state = state;
  391. start.event = me;
  392. if (state.text != null && state.text.boundingBox != null &&
  393. mxUtils.contains(state.text.boundingBox, me.getGraphX(), me.getGraphY()))
  394. {
  395. start.handle = mxEvent.LABEL_HANDLE;
  396. }
  397. else
  398. {
  399. var handler = this.selectionCellsHandler.getHandler(state.cell);
  400. if (handler != null && handler.bends != null && handler.bends.length > 0)
  401. {
  402. start.handle = handler.getHandleForEvent(me);
  403. }
  404. }
  405. }
  406. }
  407. }));
  408. this.addMouseListener(
  409. {
  410. mouseDown: function(sender, me) {},
  411. mouseMove: mxUtils.bind(this, function(sender, me)
  412. {
  413. // Checks if any other handler is active
  414. var handlerMap = this.selectionCellsHandler.handlers.map;
  415. for (var key in handlerMap)
  416. {
  417. if (handlerMap[key].index != null)
  418. {
  419. return;
  420. }
  421. }
  422. if (this.isEnabled() && !this.panningHandler.isActive() && !mxEvent.isAltDown(me.getEvent()))
  423. {
  424. var tol = this.tolerance;
  425. if (start.point != null && start.state != null && start.event != null)
  426. {
  427. var state = start.state;
  428. if (start.handle != null || Math.abs(start.point.x - me.getGraphX()) > tol ||
  429. Math.abs(start.point.y - me.getGraphY()) > tol)
  430. {
  431. var handler = null;
  432. if (!mxEvent.isControlDown(me.getEvent()) &&
  433. !mxEvent.isShiftDown(me.getEvent()))
  434. {
  435. handler = this.selectionCellsHandler.getHandler(state.cell);
  436. }
  437. if (handler != null && handler.bends != null && handler.bends.length > 0)
  438. {
  439. handler.redrawHandles();
  440. var handle = (start.handle != null) ? start.handle :
  441. handler.getHandleForEvent(start.event);
  442. var edgeStyle = this.view.getEdgeStyle(state);
  443. var entity = edgeStyle == mxEdgeStyle.EntityRelation;
  444. // Handles special case where label was clicked on unselected edge in which
  445. // case the label will be moved regardless of the handle that is returned
  446. if (!start.selected && start.handle == mxEvent.LABEL_HANDLE)
  447. {
  448. handle = start.handle;
  449. }
  450. if (!entity || handle == 0 || handle == handler.bends.length - 1 || handle == mxEvent.LABEL_HANDLE)
  451. {
  452. // Source or target handle or connected for direct handle access or orthogonal line
  453. // with just two points where the central handle is moved regardless of mouse position
  454. if (handle == mxEvent.LABEL_HANDLE || handle == 0 || state.visibleSourceState != null ||
  455. handle == handler.bends.length - 1 || state.visibleTargetState != null)
  456. {
  457. if (!entity && handle != mxEvent.LABEL_HANDLE)
  458. {
  459. var pts = state.absolutePoints;
  460. // Default case where handles are at corner points handles
  461. // drag of corner as drag of existing point
  462. if (pts != null && ((edgeStyle == null && handle == null) ||
  463. edgeStyle == mxEdgeStyle.SegmentConnector ||
  464. edgeStyle == mxEdgeStyle.OrthConnector))
  465. {
  466. // Does not use handles if they were not initially visible
  467. handle = start.handle;
  468. if (handle == null)
  469. {
  470. var box = new mxRectangle(start.point.x, start.point.y);
  471. box.grow(mxEdgeHandler.prototype.handleImage.width / 2);
  472. if (mxUtils.contains(box, pts[0].x, pts[0].y))
  473. {
  474. // Moves source terminal handle
  475. handle = 0;
  476. }
  477. else if (mxUtils.contains(box, pts[pts.length - 1].x, pts[pts.length - 1].y))
  478. {
  479. // Moves target terminal handle
  480. handle = handler.bends.length - 1;
  481. }
  482. else
  483. {
  484. // Checks if edge has no bends
  485. var nobends = edgeStyle != null && (pts.length == 2 || (pts.length == 3 &&
  486. ((Math.round(pts[0].x - pts[1].x) == 0 && Math.round(pts[1].x - pts[2].x) == 0) ||
  487. (Math.round(pts[0].y - pts[1].y) == 0 && Math.round(pts[1].y - pts[2].y) == 0))));
  488. if (nobends)
  489. {
  490. // Moves central handle for straight orthogonal edges
  491. handle = 2;
  492. }
  493. else
  494. {
  495. // Finds and moves vertical or horizontal segment
  496. handle = mxUtils.findNearestSegment(state, start.point.x, start.point.y);
  497. // Converts segment to virtual handle index
  498. if (edgeStyle == null)
  499. {
  500. handle = mxEvent.VIRTUAL_HANDLE - handle;
  501. }
  502. // Maps segment to handle
  503. else
  504. {
  505. handle += 1;
  506. }
  507. }
  508. }
  509. }
  510. }
  511. // Creates a new waypoint and starts moving it
  512. if (handle == null)
  513. {
  514. handle = mxEvent.VIRTUAL_HANDLE;
  515. }
  516. }
  517. handler.start(me.getGraphX(), me.getGraphX(), handle);
  518. me.consume();
  519. // Removes preview rectangle in graph handler
  520. this.graphHandler.reset();
  521. }
  522. }
  523. else if (entity && (state.visibleSourceState != null || state.visibleTargetState != null))
  524. {
  525. // Disables moves on entity to make it consistent
  526. this.graphHandler.reset();
  527. me.consume();
  528. }
  529. }
  530. if (handler != null)
  531. {
  532. // Lazy selection for edges inside groups
  533. if (this.selectionCellsHandler.isHandlerActive(handler))
  534. {
  535. if (!this.isCellSelected(state.cell))
  536. {
  537. this.selectionCellsHandler.handlers.put(state.cell, handler);
  538. this.selectCellForEvent(state.cell, me.getEvent());
  539. }
  540. }
  541. else if (!this.isCellSelected(state.cell))
  542. {
  543. // Destroy temporary handler
  544. handler.destroy();
  545. }
  546. }
  547. // Reset start state
  548. start.selected = false;
  549. start.handle = null;
  550. start.state = null;
  551. start.event = null;
  552. start.point = null;
  553. }
  554. }
  555. else
  556. {
  557. // Updates cursor for unselected edges under the mouse
  558. var state = me.getState();
  559. if (state != null && this.isCellEditable(state.cell))
  560. {
  561. var cursor = null;
  562. // Checks if state was removed in call to stopEditing above
  563. if (this.model.isEdge(state.cell) &&
  564. !this.isCellSelected(state.cell) &&
  565. !mxEvent.isAltDown(me.getEvent()) &&
  566. !mxEvent.isControlDown(me.getEvent()) &&
  567. !mxEvent.isShiftDown(me.getEvent()))
  568. {
  569. var box = new mxRectangle(me.getGraphX(), me.getGraphY());
  570. box.grow(mxEdgeHandler.prototype.handleImage.width / 2);
  571. var pts = state.absolutePoints;
  572. if (pts != null)
  573. {
  574. if (state.text != null && state.text.boundingBox != null &&
  575. mxUtils.contains(state.text.boundingBox, me.getGraphX(), me.getGraphY()))
  576. {
  577. cursor = 'move';
  578. }
  579. else if (mxUtils.contains(box, pts[0].x, pts[0].y) ||
  580. mxUtils.contains(box, pts[pts.length - 1].x, pts[pts.length - 1].y))
  581. {
  582. cursor = 'pointer';
  583. }
  584. else if (state.visibleSourceState != null || state.visibleTargetState != null)
  585. {
  586. // Moving is not allowed for entity relation but still indicate hover state
  587. var tmp = this.view.getEdgeStyle(state);
  588. cursor = 'crosshair';
  589. if (tmp != mxEdgeStyle.EntityRelation && this.isOrthogonal(state))
  590. {
  591. var idx = mxUtils.findNearestSegment(state, me.getGraphX(), me.getGraphY());
  592. if (idx < pts.length - 1 && idx >= 0)
  593. {
  594. cursor = (Math.round(pts[idx].x - pts[idx + 1].x) == 0) ?
  595. 'col-resize' : 'row-resize';
  596. }
  597. }
  598. }
  599. }
  600. }
  601. else if (!mxEvent.isControlDown(me.getEvent()))
  602. {
  603. var tol = mxShape.prototype.svgStrokeTolerance / 2;
  604. var box = new mxRectangle(me.getGraphX(), me.getGraphY());
  605. box.grow(tol);
  606. if (this.isTableCell(state.cell) && this.isCellMovable(state.cell))
  607. {
  608. var row = this.model.getParent(state.cell);
  609. var table = this.model.getParent(row);
  610. if (!this.isCellSelected(table))
  611. {
  612. if ((mxUtils.intersects(box, new mxRectangle(state.x, state.y - 2, state.width, 4)) &&
  613. this.model.getChildAt(table, 0) != row) || mxUtils.intersects(box,
  614. new mxRectangle(state.x, state.y + state.height - 2, state.width, 4)))
  615. {
  616. cursor ='row-resize';
  617. }
  618. else if ((mxUtils.intersects(box, new mxRectangle(state.x - 2, state.y, 4, state.height)) &&
  619. this.model.getChildAt(row, 0) != state.cell) || mxUtils.intersects(box,
  620. new mxRectangle(state.x + state.width - 2, state.y, 4, state.height)))
  621. {
  622. cursor ='col-resize';
  623. }
  624. }
  625. }
  626. // Hover for swimlane start sizes inside tables
  627. var current = state;
  628. while (cursor == null && current != null && (this.isTableCell(current.cell) ||
  629. this.isTableRow(current.cell) || this.isTable(current.cell)))
  630. {
  631. if (this.isSwimlane(current.cell) && this.isCellMovable(current.cell))
  632. {
  633. var offset = this.getActualStartSize(current.cell);
  634. var s = this.view.scale;
  635. if ((offset.x > 0 || offset.width > 0) && mxUtils.intersects(box, new mxRectangle(
  636. current.x + (offset.x - offset.width - 1) * s + ((offset.x == 0) ? current.width * s : 0),
  637. current.y, 1, current.height)))
  638. {
  639. cursor ='col-resize';
  640. }
  641. else if ((offset.y > 0 || offset.height > 0) && mxUtils.intersects(box, new mxRectangle(
  642. current.x, current.y + (offset.y - offset.height - 1) * s + ((offset.y == 0) ? current.height : 0),
  643. current.width, 1)))
  644. {
  645. cursor ='row-resize';
  646. }
  647. }
  648. current = this.view.getState(this.model.getParent(current.cell));
  649. }
  650. }
  651. if (cursor != null)
  652. {
  653. state.setCursor(cursor);
  654. }
  655. }
  656. }
  657. }
  658. }),
  659. mouseUp: mxUtils.bind(this, function(sender, me)
  660. {
  661. start.state = null;
  662. start.event = null;
  663. start.point = null;
  664. start.handle = null;
  665. })
  666. });
  667. }
  668. this.cellRenderer.minSvgStrokeWidth = 0.1;
  669. // HTML entities are displayed as plain text in wrapped plain text labels
  670. this.cellRenderer.getLabelValue = function(state)
  671. {
  672. var result = mxCellRenderer.prototype.getLabelValue.apply(this, arguments);
  673. if (state.view.graph.isHtmlLabel(state.cell))
  674. {
  675. if (state.style['html'] != 1)
  676. {
  677. result = mxUtils.htmlEntities(result, false);
  678. }
  679. else
  680. {
  681. // Skips sanitizeHtml for unchanged labels
  682. if (state.lastLabelValue != result)
  683. {
  684. state.lastLabelValue = result;
  685. state.lastSanitizedLabelValue = Graph.sanitizeHtml(result);
  686. }
  687. result = state.lastSanitizedLabelValue;
  688. }
  689. }
  690. return result;
  691. };
  692. // All code below not available and not needed in embed mode
  693. if (typeof mxVertexHandler !== 'undefined')
  694. {
  695. this.setConnectable(true);
  696. this.setDropEnabled(true);
  697. this.setPanning(true);
  698. this.setTooltips(true);
  699. this.setAllowLoops(true);
  700. this.allowAutoPanning = true;
  701. this.resetEdgesOnConnect = false;
  702. this.constrainChildren = false;
  703. this.constrainRelativeChildren = true;
  704. // Do not scroll after moving cells
  705. this.graphHandler.scrollOnMove = false;
  706. this.graphHandler.scaleGrid = true;
  707. // Disables cloning of connection sources by default
  708. this.connectionHandler.setCreateTarget(false);
  709. this.connectionHandler.insertBeforeSource = true;
  710. // Disables built-in connection starts
  711. this.connectionHandler.isValidSource = function(cell, me)
  712. {
  713. return false;
  714. };
  715. // Sets the style to be used when an elbow edge is double clicked
  716. this.alternateEdgeStyle = 'vertical';
  717. if (stylesheet == null)
  718. {
  719. this.loadStylesheet();
  720. }
  721. // Adds page centers to the guides for moving cells
  722. var graphHandlerGetGuideStates = this.graphHandler.getGuideStates;
  723. this.graphHandler.getGuideStates = function()
  724. {
  725. var result = graphHandlerGetGuideStates.apply(this, arguments);
  726. // Create virtual cell state for page centers
  727. if (this.graph.pageVisible)
  728. {
  729. var guides = [];
  730. var pf = this.graph.pageFormat;
  731. var ps = this.graph.pageScale;
  732. var pw = pf.width * ps;
  733. var ph = pf.height * ps;
  734. var t = this.graph.view.translate;
  735. var s = this.graph.view.scale;
  736. var layout = this.graph.getPageLayout();
  737. for (var i = 0; i < layout.width; i++)
  738. {
  739. guides.push(new mxRectangle(((layout.x + i) * pw + t.x) * s,
  740. (layout.y * ph + t.y) * s, pw * s, ph * s));
  741. }
  742. for (var j = 1; j < layout.height; j++)
  743. {
  744. guides.push(new mxRectangle((layout.x * pw + t.x) * s,
  745. ((layout.y + j) * ph + t.y) * s, pw * s, ph * s));
  746. }
  747. // Page center guides have precedence over normal guides
  748. result = guides.concat(result);
  749. }
  750. return result;
  751. };
  752. // Overrides zIndex for dragElement
  753. mxDragSource.prototype.dragElementZIndex = mxPopupMenu.prototype.zIndex;
  754. // Overrides color for virtual guides for page centers
  755. mxGuide.prototype.getGuideColor = function(state, horizontal)
  756. {
  757. return (state.cell == null) ? '#ffa500' /* orange */ : mxConstants.GUIDE_COLOR;
  758. };
  759. // Changes color of move preview for black backgrounds
  760. this.graphHandler.createPreviewShape = function(bounds)
  761. {
  762. this.previewColor = (this.graph.background == '#000000') ? '#ffffff' : mxGraphHandler.prototype.previewColor;
  763. return mxGraphHandler.prototype.createPreviewShape.apply(this, arguments);
  764. };
  765. // Handles parts of cells by checking if part=1 is in the style and returning the parent
  766. // if the parent is not already in the list of cells. container style is used to disable
  767. // step into swimlanes and dropTarget style is used to disable acting as a drop target.
  768. // LATER: Handle recursive parts
  769. var graphHandlerGetCells = this.graphHandler.getCells;
  770. this.graphHandler.getCells = function(initialCell)
  771. {
  772. var cells = graphHandlerGetCells.apply(this, arguments);
  773. var lookup = new mxDictionary();
  774. var newCells = [];
  775. for (var i = 0; i < cells.length; i++)
  776. {
  777. // Propagates to composite parents or moves selected table rows
  778. var cell = (this.graph.isTableCell(initialCell) &&
  779. this.graph.isTableCell(cells[i]) &&
  780. this.graph.isCellSelected(cells[i])) ?
  781. this.graph.model.getParent(cells[i]) :
  782. ((this.graph.isTableRow(initialCell) &&
  783. this.graph.isTableRow(cells[i]) &&
  784. this.graph.isCellSelected(cells[i])) ?
  785. cells[i] : this.graph.getCompositeParent(cells[i]));
  786. if (cell != null && !lookup.get(cell))
  787. {
  788. lookup.put(cell, true);
  789. newCells.push(cell);
  790. }
  791. }
  792. return newCells;
  793. };
  794. // Handles parts and selected rows in tables of cells for drag and drop
  795. var graphHandlerStart = this.graphHandler.start;
  796. this.graphHandler.start = function(cell, x, y, cells)
  797. {
  798. // Propagates to selected table row to start move
  799. var ignoreParent = false;
  800. if (this.graph.isTableCell(cell))
  801. {
  802. if (!this.graph.isCellSelected(cell))
  803. {
  804. cell = this.graph.model.getParent(cell);
  805. }
  806. else
  807. {
  808. ignoreParent = true;
  809. }
  810. }
  811. if (!ignoreParent && (!this.graph.isTableRow(cell) || !this.graph.isCellSelected(cell)))
  812. {
  813. cell = this.graph.getCompositeParent(cell);
  814. }
  815. graphHandlerStart.apply(this, arguments);
  816. };
  817. // Handles parts of cells when cloning the source for new connections
  818. this.connectionHandler.createTargetVertex = function(evt, source)
  819. {
  820. source = this.graph.getCompositeParent(source);
  821. return mxConnectionHandler.prototype.createTargetVertex.apply(this, arguments);
  822. };
  823. // Applies newEdgeStyle
  824. this.connectionHandler.insertEdge = function(parent, id, value, source, target, style)
  825. {
  826. var edge = mxConnectionHandler.prototype.insertEdge.apply(this, arguments);
  827. if (source != null)
  828. {
  829. this.graph.applyNewEdgeStyle(source, [edge]);
  830. }
  831. return edge
  832. };
  833. // Creates rubberband selection and associates with graph instance
  834. var rubberband = new mxRubberband(this);
  835. this.getRubberband = function()
  836. {
  837. return rubberband;
  838. };
  839. // Timer-based activation of outline connect in connection handler
  840. var startTime = new Date().getTime();
  841. var timeOnTarget = 0;
  842. var connectionHandlerMouseMove = this.connectionHandler.mouseMove;
  843. this.connectionHandler.mouseMove = function()
  844. {
  845. var prev = this.currentState;
  846. connectionHandlerMouseMove.apply(this, arguments);
  847. if (prev != this.currentState)
  848. {
  849. startTime = new Date().getTime();
  850. timeOnTarget = 0;
  851. }
  852. else
  853. {
  854. timeOnTarget = new Date().getTime() - startTime;
  855. }
  856. };
  857. // Activates outline connect after 1500ms with touch event or if alt is pressed inside the shape
  858. // outlineConnect=0 is a custom style that means do not connect to strokes inside the shape,
  859. // or in other words, connect to the shape's perimeter if the highlight is under the mouse
  860. // (the name is because the highlight, including all strokes, is called outline in the code)
  861. var connectionHandleIsOutlineConnectEvent = this.connectionHandler.isOutlineConnectEvent;
  862. this.connectionHandler.isOutlineConnectEvent = function(me)
  863. {
  864. if (mxEvent.isShiftDown(me.getEvent()) && mxEvent.isAltDown(me.getEvent()))
  865. {
  866. return false;
  867. }
  868. else
  869. {
  870. return (this.currentState != null && me.getState() == this.currentState && timeOnTarget > 2000) ||
  871. ((this.currentState == null || mxUtils.getValue(this.currentState.style, 'outlineConnect', '1') != '0') &&
  872. connectionHandleIsOutlineConnectEvent.apply(this, arguments));
  873. }
  874. };
  875. // Adds shift+click to toggle selection state
  876. var isToggleEvent = this.isToggleEvent;
  877. this.isToggleEvent = function(evt)
  878. {
  879. return isToggleEvent.apply(this, arguments) || (!mxClient.IS_CHROMEOS && mxEvent.isShiftDown(evt));
  880. };
  881. // Workaround for Firefox where first mouse down is received
  882. // after tap and hold if scrollbars are visible, which means
  883. // start rubberband immediately if no cell is under mouse.
  884. var isForceRubberBandEvent = rubberband.isForceRubberbandEvent;
  885. rubberband.isForceRubberbandEvent = function(me)
  886. {
  887. return isForceRubberBandEvent.apply(this, arguments) ||
  888. (mxClient.IS_CHROMEOS && mxEvent.isShiftDown(me.getEvent())) ||
  889. (mxUtils.hasScrollbars(this.graph.container) && mxClient.IS_FF &&
  890. mxClient.IS_WIN && me.getState() == null && mxEvent.isTouchEvent(me.getEvent()));
  891. };
  892. // Shows hand cursor while panning
  893. var prevCursor = null;
  894. this.panningHandler.addListener(mxEvent.PAN_START, mxUtils.bind(this, function()
  895. {
  896. if (this.isEnabled())
  897. {
  898. prevCursor = this.container.style.cursor;
  899. this.container.style.cursor = 'move';
  900. }
  901. }));
  902. this.panningHandler.addListener(mxEvent.PAN_END, mxUtils.bind(this, function()
  903. {
  904. if (this.isEnabled())
  905. {
  906. this.container.style.cursor = prevCursor;
  907. }
  908. }));
  909. this.popupMenuHandler.autoExpand = true;
  910. this.popupMenuHandler.isSelectOnPopup = function(me)
  911. {
  912. return mxEvent.isMouseEvent(me.getEvent());
  913. };
  914. // Handles links in read-only graphs
  915. // and cells in locked layers
  916. var click = this.click;
  917. this.click = function(me)
  918. {
  919. var locked = me.state == null && me.sourceState != null &&
  920. this.isCellLocked(this.getLayerForCell(
  921. me.sourceState.cell));
  922. if ((!this.isEnabled() || locked) && !me.isConsumed())
  923. {
  924. var cell = (locked) ? me.sourceState.cell : me.getCell();
  925. if (cell != null)
  926. {
  927. var link = this.getClickableLinkForCell(cell);
  928. if (link != null)
  929. {
  930. if (this.isCustomLink(link))
  931. {
  932. this.customLinkClicked(link);
  933. }
  934. else
  935. {
  936. this.openLink(link);
  937. }
  938. }
  939. }
  940. }
  941. else
  942. {
  943. return click.apply(this, arguments);
  944. }
  945. };
  946. // Redirects tooltips for locked cells
  947. this.tooltipHandler.getStateForEvent = function(me)
  948. {
  949. return me.sourceState;
  950. };
  951. // Opens links in tooltips in new windows
  952. var tooltipHandlerShow = this.tooltipHandler.show;
  953. this.tooltipHandler.show = function()
  954. {
  955. tooltipHandlerShow.apply(this, arguments);
  956. if (this.div != null)
  957. {
  958. var links = this.div.getElementsByTagName('a');
  959. for (var i = 0; i < links.length; i++)
  960. {
  961. if (links[i].getAttribute('href') != null &&
  962. links[i].getAttribute('target') == null)
  963. {
  964. links[i].setAttribute('target', '_blank');
  965. }
  966. }
  967. }
  968. };
  969. // Redirects tooltips for locked cells
  970. this.tooltipHandler.getStateForEvent = function(me)
  971. {
  972. return me.sourceState;
  973. };
  974. // Redirects cursor for locked cells
  975. var getCursorForMouseEvent = this.getCursorForMouseEvent;
  976. this.getCursorForMouseEvent = function(me)
  977. {
  978. var locked = me.state == null && me.sourceState != null && this.isCellLocked(me.sourceState.cell);
  979. return this.getCursorForCell((locked) ? me.sourceState.cell : me.getCell());
  980. };
  981. // Shows pointer cursor for clickable cells with links
  982. // ie. if the graph is disabled and cells cannot be selected
  983. var getCursorForCell = this.getCursorForCell;
  984. this.getCursorForCell = function(cell)
  985. {
  986. if (!this.isEnabled() || this.isCellLocked(cell))
  987. {
  988. var link = this.getClickableLinkForCell(cell);
  989. if (link != null)
  990. {
  991. return 'pointer';
  992. }
  993. else if (this.isCellLocked(cell))
  994. {
  995. return 'default';
  996. }
  997. }
  998. return getCursorForCell.apply(this, arguments);
  999. };
  1000. // Changes rubberband selection ignore locked cells
  1001. this.selectRegion = function(rect, evt)
  1002. {
  1003. var isect = (mxEvent.isAltDown(evt)) ? rect : null;
  1004. var cells = this.getCells(rect.x, rect.y,
  1005. rect.width, rect.height, null, null,
  1006. isect, null, true);
  1007. if (this.isToggleEvent(evt))
  1008. {
  1009. for (var i = 0; i < cells.length; i++)
  1010. {
  1011. this.selectCellForEvent(cells[i], evt);
  1012. }
  1013. }
  1014. else
  1015. {
  1016. this.selectCellsForEvent(cells, evt);
  1017. }
  1018. return cells;
  1019. };
  1020. // Never removes cells from parents that are being moved
  1021. var graphHandlerShouldRemoveCellsFromParent = this.graphHandler.shouldRemoveCellsFromParent;
  1022. this.graphHandler.shouldRemoveCellsFromParent = function(parent, cells, evt)
  1023. {
  1024. if (this.graph.isCellSelected(parent))
  1025. {
  1026. return false;
  1027. }
  1028. return graphHandlerShouldRemoveCellsFromParent.apply(this, arguments);
  1029. };
  1030. // Enables rubberband selection on cells in locked layers
  1031. var graphUpdateMouseEvent = this.updateMouseEvent;
  1032. this.updateMouseEvent = function(me)
  1033. {
  1034. me = graphUpdateMouseEvent.apply(this, arguments);
  1035. if (me.state != null && this.isCellLocked(this.getLayerForCell(me.getCell())))
  1036. {
  1037. me.state = null;
  1038. }
  1039. return me;
  1040. };
  1041. // Cells in locked layers are not selectable
  1042. var graphIsCellSelectable = this.isCellSelectable;
  1043. this.isCellSelectable = function(cell)
  1044. {
  1045. return graphIsCellSelectable.apply(this, arguments) &&
  1046. !this.isCellLocked(this.getLayerForCell(cell));
  1047. };
  1048. // Returns true if the given cell is locked
  1049. this.isCellLocked = function(cell)
  1050. {
  1051. while (cell != null)
  1052. {
  1053. if (mxUtils.getValue(this.getCurrentCellStyle(cell), 'locked', '0') == '1')
  1054. {
  1055. return true;
  1056. }
  1057. cell = this.model.getParent(cell);
  1058. }
  1059. return false;
  1060. };
  1061. var tapAndHoldSelection = null;
  1062. // Uses this event to process mouseDown to check the selection state before it is changed
  1063. this.addListener(mxEvent.FIRE_MOUSE_EVENT, mxUtils.bind(this, function(sender, evt)
  1064. {
  1065. if (evt.getProperty('eventName') == 'mouseDown')
  1066. {
  1067. var me = evt.getProperty('event');
  1068. var state = me.getState();
  1069. if (state != null && !this.isSelectionEmpty() && !this.isCellSelected(state.cell))
  1070. {
  1071. tapAndHoldSelection = this.getSelectionCells();
  1072. }
  1073. else
  1074. {
  1075. tapAndHoldSelection = null;
  1076. }
  1077. }
  1078. }));
  1079. // Tap and hold on background starts rubberband for multiple selected
  1080. // cells the cell associated with the event is deselected
  1081. this.addListener(mxEvent.TAP_AND_HOLD, mxUtils.bind(this, function(sender, evt)
  1082. {
  1083. if (!mxEvent.isMultiTouchEvent(evt))
  1084. {
  1085. var me = evt.getProperty('event');
  1086. var cell = evt.getProperty('cell');
  1087. if (cell == null)
  1088. {
  1089. var pt = mxUtils.convertPoint(this.container,
  1090. mxEvent.getClientX(me), mxEvent.getClientY(me));
  1091. rubberband.start(pt.x, pt.y);
  1092. }
  1093. else if (tapAndHoldSelection != null)
  1094. {
  1095. this.addSelectionCells(tapAndHoldSelection);
  1096. }
  1097. else if (this.getSelectionCount() > 1 && this.isCellSelected(cell))
  1098. {
  1099. this.removeSelectionCell(cell);
  1100. }
  1101. // Blocks further processing of the event
  1102. tapAndHoldSelection = null;
  1103. evt.consume();
  1104. }
  1105. }));
  1106. // On connect the target is selected and we clone the cell of the preview edge for insert
  1107. this.connectionHandler.selectCells = function(edge, target)
  1108. {
  1109. this.graph.setSelectionCell(target || edge);
  1110. };
  1111. // Shows connection points only if cell not selected and parent table not handled
  1112. this.connectionHandler.constraintHandler.isStateIgnored = function(state, source)
  1113. {
  1114. var graph = state.view.graph;
  1115. return source && (graph.isCellSelected(state.cell) || (graph.isTableRow(state.cell) &&
  1116. graph.selectionCellsHandler.isHandled(graph.model.getParent(state.cell))));
  1117. };
  1118. // Updates constraint handler if the selection changes
  1119. this.selectionModel.addListener(mxEvent.CHANGE, mxUtils.bind(this, function()
  1120. {
  1121. var ch = this.connectionHandler.constraintHandler;
  1122. if (ch.currentFocus != null && ch.isStateIgnored(ch.currentFocus, true))
  1123. {
  1124. ch.currentFocus = null;
  1125. ch.constraints = null;
  1126. ch.destroyIcons();
  1127. }
  1128. ch.destroyFocusHighlight();
  1129. }));
  1130. // Initializes touch interface
  1131. if (Graph.touchStyle)
  1132. {
  1133. this.initTouch();
  1134. }
  1135. }
  1136. //Create a unique offset object for each graph instance.
  1137. this.currentTranslate = new mxPoint(0, 0);
  1138. };
  1139. /**
  1140. * Specifies if the touch UI should be used (cannot detect touch in FF so always on for Windows/Linux)
  1141. */
  1142. Graph.touchStyle = mxClient.IS_TOUCH || (mxClient.IS_FF && mxClient.IS_WIN) || navigator.maxTouchPoints > 0 ||
  1143. navigator.msMaxTouchPoints > 0 || window.urlParams == null || urlParams['touch'] == '1';
  1144. /**
  1145. * Shortcut for capability check.
  1146. */
  1147. Graph.fileSupport = window.File != null && window.FileReader != null && window.FileList != null &&
  1148. (window.urlParams == null || urlParams['filesupport'] != '0');
  1149. /**
  1150. * Shortcut for capability check.
  1151. */
  1152. Graph.translateDiagram = urlParams['translate-diagram'] == '1';
  1153. /**
  1154. * Shortcut for capability check.
  1155. */
  1156. Graph.diagramLanguage = (urlParams['diagram-language'] != null) ? urlParams['diagram-language'] : mxClient.language;
  1157. /**
  1158. * Default size for line jumps.
  1159. */
  1160. Graph.lineJumpsEnabled = true;
  1161. /**
  1162. * Default size for line jumps.
  1163. */
  1164. Graph.defaultJumpSize = 6;
  1165. /**
  1166. * Specifies if the mouse wheel is used for zoom without any modifiers.
  1167. */
  1168. Graph.zoomWheel = false;
  1169. /**
  1170. * Minimum width for table columns.
  1171. */
  1172. Graph.minTableColumnWidth = 20;
  1173. /**
  1174. * Minimum height for table rows.
  1175. */
  1176. Graph.minTableRowHeight = 20;
  1177. /**
  1178. * Text for foreign object warning.
  1179. */
  1180. Graph.foreignObjectWarningText = 'Text is not SVG - cannot display';
  1181. /**
  1182. * Link for foreign object warning.
  1183. */
  1184. Graph.foreignObjectWarningLink = 'https://www.drawio.com/doc/faq/svg-export-text-problems';
  1185. /**
  1186. *
  1187. */
  1188. Graph.xmlDeclaration = '<?xml version="1.0" encoding="UTF-8"?>';
  1189. /**
  1190. *
  1191. */
  1192. Graph.svgDoctype = '<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" ' +
  1193. '"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">';
  1194. /**
  1195. *
  1196. */
  1197. Graph.svgFileComment = '<!-- Do not edit this file with editors other than draw.io -->'
  1198. /**
  1199. * Minimum height for table rows.
  1200. */
  1201. Graph.pasteStyles = ['rounded', 'shadow', 'dashed', 'dashPattern', 'fontFamily', 'fontSource', 'fontSize', 'fontColor', 'fontStyle',
  1202. 'align', 'verticalAlign', 'strokeColor', 'strokeWidth', 'fillColor', 'gradientColor', 'swimlaneFillColor',
  1203. 'textOpacity', 'gradientDirection', 'glass', 'labelBackgroundColor', 'labelBorderColor', 'opacity',
  1204. 'spacing', 'spacingTop', 'spacingLeft', 'spacingBottom', 'spacingRight', 'endFill', 'endArrow',
  1205. 'endSize', 'targetPerimeterSpacing', 'startFill', 'startArrow', 'startSize', 'sourcePerimeterSpacing',
  1206. 'arcSize', 'comic', 'sketch', 'fillWeight', 'hachureGap', 'hachureAngle', 'jiggle', 'disableMultiStroke',
  1207. 'disableMultiStrokeFill', 'fillStyle', 'curveFitting', 'simplification', 'comicStyle'];
  1208. /**
  1209. * Whitelist for known layout names.
  1210. */
  1211. Graph.layoutNames = ['mxHierarchicalLayout', 'mxCircleLayout', 'mxCompactTreeLayout',
  1212. 'mxEdgeLabelLayout', 'mxFastOrganicLayout', 'mxParallelEdgeLayout',
  1213. 'mxPartitionLayout', 'mxRadialTreeLayout', 'mxStackLayout'];
  1214. /**
  1215. * Creates a temporary graph instance for rendering off-screen content.
  1216. */
  1217. Graph.createOffscreenGraph = function(stylesheet)
  1218. {
  1219. var graph = new Graph(document.createElement('div'));
  1220. graph.stylesheet.styles = mxUtils.clone(stylesheet.styles);
  1221. graph.resetViewOnRootChange = false;
  1222. graph.setConnectable(false);
  1223. graph.gridEnabled = false;
  1224. graph.autoScroll = false;
  1225. graph.setTooltips(false);
  1226. graph.setEnabled(false);
  1227. // Container must be in the DOM for correct HTML rendering
  1228. graph.container.style.visibility = 'hidden';
  1229. graph.container.style.position = 'absolute';
  1230. graph.container.style.overflow = 'hidden';
  1231. graph.container.style.height = '1px';
  1232. graph.container.style.width = '1px';
  1233. return graph;
  1234. };
  1235. /**
  1236. * Helper function for creating SVG data URI.
  1237. */
  1238. Graph.createSvgImage = function(w, h, data, coordWidth, coordHeight)
  1239. {
  1240. var tmp = unescape(encodeURIComponent(Graph.svgDoctype +
  1241. '<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="' + w + 'px" height="' + h + 'px" ' +
  1242. ((coordWidth != null && coordHeight != null) ? 'viewBox="0 0 ' + coordWidth + ' ' + coordHeight + '" ' : '') +
  1243. 'version="1.1">' + data + '</svg>'));
  1244. return new mxImage('data:image/svg+xml;base64,' + ((window.btoa) ? btoa(tmp) : Base64.encode(tmp, true)), w, h)
  1245. };
  1246. /**
  1247. * Helper function for creating an SVG node.
  1248. */
  1249. Graph.createSvgNode = function(x, y, w, h, background)
  1250. {
  1251. var svgDoc = mxUtils.createXmlDocument();
  1252. var root = (svgDoc.createElementNS != null) ?
  1253. svgDoc.createElementNS(mxConstants.NS_SVG, 'svg') :
  1254. svgDoc.createElement('svg');
  1255. if (background != null)
  1256. {
  1257. if (root.style != null)
  1258. {
  1259. root.style.backgroundColor = background;
  1260. }
  1261. else
  1262. {
  1263. root.setAttribute('style', 'background-color:' + background);
  1264. }
  1265. }
  1266. if (svgDoc.createElementNS == null)
  1267. {
  1268. root.setAttribute('xmlns', mxConstants.NS_SVG);
  1269. root.setAttribute('xmlns:xlink', mxConstants.NS_XLINK);
  1270. }
  1271. else
  1272. {
  1273. // KNOWN: Ignored in IE9-11, adds namespace for each image element instead. No workaround.
  1274. root.setAttributeNS('http://www.w3.org/2000/xmlns/', 'xmlns:xlink', mxConstants.NS_XLINK);
  1275. }
  1276. root.setAttribute('version', '1.1');
  1277. root.setAttribute('width', w + 'px');
  1278. root.setAttribute('height', h + 'px');
  1279. root.setAttribute('viewBox', x + ' ' + y + ' ' + w + ' ' + h);
  1280. svgDoc.appendChild(root);
  1281. return root;
  1282. };
  1283. /**
  1284. * Helper function for creating an SVG node.
  1285. */
  1286. Graph.htmlToPng = function(html, w, h, fn)
  1287. {
  1288. var canvas = document.createElement('canvas');
  1289. canvas.width = w;
  1290. canvas.height = h;
  1291. var img = document.createElement('img');
  1292. img.onload = mxUtils.bind(this, function()
  1293. {
  1294. var ctx = canvas.getContext('2d');
  1295. ctx.drawImage(img, 0, 0)
  1296. fn(canvas.toDataURL());
  1297. });
  1298. img.src = 'data:image/svg+xml,' + encodeURIComponent('<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100">' +
  1299. '<foreignObject width="100%" height="100%"><div xmlns="http://www.w3.org/1999/xhtml"><style>em{color:red;}</style><em>I</em> lick <span>cheese</span></div></foreignObject></svg>');
  1300. };
  1301. /**
  1302. * Removes all illegal control characters with ASCII code <32 except TAB, LF
  1303. * and CR.
  1304. */
  1305. Graph.zapGremlins = function(text)
  1306. {
  1307. var lastIndex = 0;
  1308. var checked = [];
  1309. for (var i = 0; i < text.length; i++)
  1310. {
  1311. var code = text.charCodeAt(i);
  1312. // Removes all control chars except TAB, LF and CR
  1313. if (!((code >= 32 || code == 9 || code == 10 || code == 13) &&
  1314. code != 0xFFFF && code != 0xFFFE))
  1315. {
  1316. checked.push(text.substring(lastIndex, i));
  1317. lastIndex = i + 1;
  1318. }
  1319. }
  1320. if (lastIndex > 0 && lastIndex < text.length)
  1321. {
  1322. checked.push(text.substring(lastIndex));
  1323. }
  1324. return (checked.length == 0) ? text : checked.join('');
  1325. };
  1326. /**
  1327. * Turns the given string into an array.
  1328. */
  1329. Graph.stringToBytes = function(str)
  1330. {
  1331. var arr = new Array(str.length);
  1332. for (var i = 0; i < str.length; i++)
  1333. {
  1334. arr[i] = str.charCodeAt(i);
  1335. }
  1336. return arr;
  1337. };
  1338. /**
  1339. * Turns the given array into a string.
  1340. */
  1341. Graph.bytesToString = function(arr)
  1342. {
  1343. var result = new Array(arr.length);
  1344. for (var i = 0; i < arr.length; i++)
  1345. {
  1346. result[i] = String.fromCharCode(arr[i]);
  1347. }
  1348. return result.join('');
  1349. };
  1350. /**
  1351. * Turns the given array into a string.
  1352. */
  1353. Graph.base64EncodeUnicode = function(str)
  1354. {
  1355. return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, function(match, p1) {
  1356. return String.fromCharCode(parseInt(p1, 16))
  1357. }));
  1358. };
  1359. /**
  1360. * Turns the given array into a string.
  1361. */
  1362. Graph.base64DecodeUnicode = function(str)
  1363. {
  1364. return decodeURIComponent(Array.prototype.map.call(atob(str), function(c) {
  1365. return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2)
  1366. }).join(''));
  1367. };
  1368. /**
  1369. * Returns a base64 encoded version of the compressed outer XML of the given node.
  1370. */
  1371. Graph.compressNode = function(node, checked)
  1372. {
  1373. var xml = mxUtils.getXml(node);
  1374. return Graph.compress((checked) ? xml : Graph.zapGremlins(xml));
  1375. };
  1376. /**
  1377. * Returns a string for the given array buffer.
  1378. */
  1379. Graph.arrayBufferToString = function(buffer)
  1380. {
  1381. var binary = '';
  1382. var bytes = new Uint8Array(buffer);
  1383. var len = bytes.byteLength;
  1384. for (var i = 0; i < len; i++)
  1385. {
  1386. binary += String.fromCharCode(bytes[i]);
  1387. }
  1388. return binary;
  1389. };
  1390. /**
  1391. * Returns an array buffer for the given string.
  1392. */
  1393. Graph.stringToArrayBuffer = function(data)
  1394. {
  1395. return Uint8Array.from(data, function (c)
  1396. {
  1397. return c.charCodeAt(0);
  1398. });
  1399. };
  1400. /**
  1401. * Returns index of a string in an array buffer (UInt8Array)
  1402. */
  1403. Graph.arrayBufferIndexOfString = function (uint8Array, str, start)
  1404. {
  1405. var c0 = str.charCodeAt(0), j = 1, p = -1;
  1406. //Index of first char
  1407. for (var i = start || 0; i < uint8Array.byteLength; i++)
  1408. {
  1409. if (uint8Array[i] == c0)
  1410. {
  1411. p = i;
  1412. break;
  1413. }
  1414. }
  1415. for (var i = p + 1; p > -1 && i < uint8Array.byteLength && i < p + str.length - 1; i++)
  1416. {
  1417. if (uint8Array[i] != str.charCodeAt(j))
  1418. {
  1419. return Graph.arrayBufferIndexOfString(uint8Array, str, p + 1);
  1420. }
  1421. j++;
  1422. }
  1423. return j == str.length - 1? p : -1;
  1424. };
  1425. /**
  1426. * Returns a base64 encoded version of the compressed string.
  1427. */
  1428. Graph.compress = function(data, deflate)
  1429. {
  1430. if (data == null || data.length == 0 || typeof(pako) === 'undefined')
  1431. {
  1432. return data;
  1433. }
  1434. else
  1435. {
  1436. var tmp = (deflate) ? pako.deflate(encodeURIComponent(data)) :
  1437. pako.deflateRaw(encodeURIComponent(data));
  1438. return btoa(Graph.arrayBufferToString(new Uint8Array(tmp)));
  1439. }
  1440. };
  1441. /**
  1442. * Returns a decompressed version of the base64 encoded string.
  1443. */
  1444. Graph.decompress = function(data, inflate, checked)
  1445. {
  1446. if (data == null || data.length == 0 || typeof(pako) === 'undefined')
  1447. {
  1448. return data;
  1449. }
  1450. else
  1451. {
  1452. var tmp = Graph.stringToArrayBuffer(atob(data));
  1453. var inflated = decodeURIComponent((inflate) ?
  1454. pako.inflate(tmp, {to: 'string'}) :
  1455. pako.inflateRaw(tmp, {to: 'string'}));
  1456. return (checked) ? inflated : Graph.zapGremlins(inflated);
  1457. }
  1458. };
  1459. /**
  1460. * Fades the given nodes in or out.
  1461. */
  1462. Graph.fadeNodes = function(nodes, start, end, done, delay)
  1463. {
  1464. delay = (delay != null) ? delay : 1000;
  1465. Graph.setTransitionForNodes(nodes, null);
  1466. Graph.setOpacityForNodes(nodes, start);
  1467. window.setTimeout(function()
  1468. {
  1469. Graph.setTransitionForNodes(nodes,
  1470. 'all ' + delay + 'ms ease-in-out');
  1471. Graph.setOpacityForNodes(nodes, end);
  1472. window.setTimeout(function()
  1473. {
  1474. Graph.setTransitionForNodes(nodes, null);
  1475. if (done != null)
  1476. {
  1477. done();
  1478. }
  1479. }, delay);
  1480. }, 0);
  1481. };
  1482. /**
  1483. * Removes the elements from the map where the given function returns true.
  1484. */
  1485. Graph.removeKeys = function(map, ignoreFn)
  1486. {
  1487. for (var key in map)
  1488. {
  1489. if (ignoreFn(key))
  1490. {
  1491. delete map[key];
  1492. }
  1493. }
  1494. };
  1495. /**
  1496. * Sets the transition for the given nodes.
  1497. */
  1498. Graph.setTransitionForNodes = function(nodes, transition)
  1499. {
  1500. for (var i = 0; i < nodes.length; i++)
  1501. {
  1502. mxUtils.setPrefixedStyle(nodes[i].style, 'transition', transition);
  1503. }
  1504. };
  1505. /**
  1506. * Sets the opacity for the given nodes.
  1507. */
  1508. Graph.setOpacityForNodes = function(nodes, opacity)
  1509. {
  1510. for (var i = 0; i < nodes.length; i++)
  1511. {
  1512. nodes[i].style.opacity = opacity;
  1513. }
  1514. };
  1515. /**
  1516. * Removes formatting from pasted HTML.
  1517. */
  1518. Graph.removePasteFormatting = function(elt, ignoreTabs)
  1519. {
  1520. while (elt != null)
  1521. {
  1522. if (elt.firstChild != null)
  1523. {
  1524. Graph.removePasteFormatting(elt.firstChild, true);
  1525. }
  1526. var next = elt.nextSibling;
  1527. if (elt.nodeType == mxConstants.NODETYPE_ELEMENT && elt.style != null)
  1528. {
  1529. elt.style.whiteSpace = '';
  1530. if (elt.style.color == '#000000')
  1531. {
  1532. elt.style.color = '';
  1533. }
  1534. // Replaces tabs from macOS TextEdit
  1535. if (elt.nodeName == 'SPAN' && elt.className == 'Apple-tab-span')
  1536. {
  1537. var temp = Graph.createTabNode(4);
  1538. elt.parentNode.replaceChild(temp, elt);
  1539. elt = temp;
  1540. }
  1541. // Replaces paragraphs from macOS TextEdit
  1542. if (elt.nodeName == 'P' && elt.className == 'p1')
  1543. {
  1544. while (elt.firstChild != null)
  1545. {
  1546. elt.parentNode.insertBefore(elt.firstChild, elt);
  1547. }
  1548. if (next != null && next.nodeName == 'P' &&
  1549. next.className == 'p1')
  1550. {
  1551. elt.parentNode.insertBefore(elt.ownerDocument.
  1552. createElement('br'), elt);
  1553. }
  1554. elt.parentNode.removeChild(elt);
  1555. }
  1556. // Replaces tabs
  1557. if (!ignoreTabs && elt.innerHTML != null)
  1558. {
  1559. var tabNode = Graph.createTabNode(4);
  1560. elt.innerHTML = elt.innerHTML.replace(/\t/g,
  1561. tabNode.outerHTML);
  1562. }
  1563. }
  1564. elt = next;
  1565. }
  1566. };
  1567. /**
  1568. * Removes formatting from pasted HTML.
  1569. */
  1570. Graph.createTabNode = function(spaces)
  1571. {
  1572. var str = '\t';
  1573. if (spaces != null)
  1574. {
  1575. str = '';
  1576. while (spaces > 0)
  1577. {
  1578. str += '\xa0';
  1579. spaces--;
  1580. }
  1581. }
  1582. // LATER: Fix normalized tab after editing plain text labels
  1583. var tabNode = document.createElement('span');
  1584. tabNode.style.whiteSpace = 'pre';
  1585. tabNode.appendChild(document.createTextNode(str));
  1586. return tabNode;
  1587. };
  1588. /**
  1589. * Sanitizes the given HTML markup, allowing target attributes and
  1590. * data: protocol links to pages and custom actions.
  1591. */
  1592. Graph.sanitizeHtml = function(value, editing)
  1593. {
  1594. return Graph.domPurify(value, false);
  1595. };
  1596. /**
  1597. * Returns the size of the page format scaled with the page size.
  1598. */
  1599. Graph.sanitizeLink = function(href)
  1600. {
  1601. if (href == null)
  1602. {
  1603. return null;
  1604. }
  1605. else
  1606. {
  1607. var a = document.createElement('a');
  1608. a.setAttribute('href', href);
  1609. Graph.sanitizeNode(a);
  1610. return a.getAttribute('href');
  1611. }
  1612. };
  1613. /**
  1614. * Sanitizes the given DOM node in-place.
  1615. */
  1616. Graph.sanitizeNode = function(value)
  1617. {
  1618. return Graph.domPurify(value, true);
  1619. };
  1620. // Allows use tag in SVG with local references only
  1621. DOMPurify.addHook('afterSanitizeAttributes', function(node)
  1622. {
  1623. if (node.nodeName == 'use' && ((node.getAttribute('xlink:href') != null &&
  1624. !node.getAttribute('xlink:href').startsWith('#')) ||
  1625. (node.getAttribute('href') != null && !node.getAttribute('href').startsWith('#'))))
  1626. {
  1627. node.remove();
  1628. }
  1629. });
  1630. // Workaround for removed content with empty nodes
  1631. DOMPurify.addHook('uponSanitizeAttribute', function (node, evt)
  1632. {
  1633. if (node.nodeName == 'svg' && evt.attrName == 'content')
  1634. {
  1635. evt.forceKeepAttr = true;
  1636. }
  1637. return node;
  1638. });
  1639. /**
  1640. * Sanitizes the given value.
  1641. */
  1642. Graph.domPurify = function(value, inPlace)
  1643. {
  1644. window.DOM_PURIFY_CONFIG.IN_PLACE = inPlace;
  1645. return DOMPurify.sanitize(value, window.DOM_PURIFY_CONFIG);
  1646. };
  1647. /**
  1648. * Updates the viewbox, width and height in the given SVG data URI
  1649. * and returns the updated data URI with all script tags and event
  1650. * handlers removed.
  1651. */
  1652. Graph.clipSvgDataUri = function(dataUri, ignorePreserveAspect)
  1653. {
  1654. // LATER Add workaround for non-default NS declarations with empty URI not allowed in IE11
  1655. if (!mxClient.IS_IE && !mxClient.IS_IE11 && dataUri != null &&
  1656. dataUri.substring(0, 26) == 'data:image/svg+xml;base64,')
  1657. {
  1658. try
  1659. {
  1660. var div = document.createElement('div');
  1661. div.style.position = 'absolute';
  1662. div.style.visibility = 'hidden';
  1663. // Adds the text and inserts into DOM for updating of size
  1664. var data = decodeURIComponent(escape(atob(dataUri.substring(26))));
  1665. var idx = data.indexOf('<svg');
  1666. if (idx >= 0)
  1667. {
  1668. // Strips leading XML declaration and doctypes
  1669. div.innerHTML = Graph.sanitizeHtml(data.substring(idx));
  1670. // Gets the size and removes from DOM
  1671. var svgs = div.getElementsByTagName('svg');
  1672. if (svgs.length > 0)
  1673. {
  1674. // Avoids getBBox as it ignores stroke option
  1675. if (ignorePreserveAspect || svgs[0].getAttribute('preserveAspectRatio') != null)
  1676. {
  1677. document.body.appendChild(div);
  1678. try
  1679. {
  1680. var fx = 1;
  1681. var fy = 1;
  1682. var w = svgs[0].getAttribute('width');
  1683. var h = svgs[0].getAttribute('height');
  1684. if (w != null && w.charAt(w.length - 1) != '%')
  1685. {
  1686. w = parseFloat(w);
  1687. }
  1688. else
  1689. {
  1690. w = NaN;
  1691. }
  1692. if (h != null && h.charAt(h.length - 1) != '%')
  1693. {
  1694. h = parseFloat(h);
  1695. }
  1696. else
  1697. {
  1698. h = NaN;
  1699. }
  1700. var vb = svgs[0].getAttribute('viewBox');
  1701. if (vb != null && !isNaN(w) && !isNaN(h))
  1702. {
  1703. var tokens = vb.split(' ');
  1704. if (vb.length >= 4)
  1705. {
  1706. fx = parseFloat(tokens[2]) / w;
  1707. fy = parseFloat(tokens[3]) / h;
  1708. }
  1709. }
  1710. var size = svgs[0].getBBox();
  1711. if (size.width > 0 && size.height > 0)
  1712. {
  1713. div.getElementsByTagName('svg')[0].setAttribute('viewBox', size.x +
  1714. ' ' + size.y + ' ' + size.width + ' ' + size.height);
  1715. div.getElementsByTagName('svg')[0].setAttribute('width', size.width / fx);
  1716. div.getElementsByTagName('svg')[0].setAttribute('height', size.height / fy);
  1717. }
  1718. }
  1719. catch (e)
  1720. {
  1721. // ignore
  1722. }
  1723. finally
  1724. {
  1725. document.body.removeChild(div);
  1726. }
  1727. }
  1728. dataUri = Editor.createSvgDataUri(mxUtils.getXml(svgs[0]));
  1729. }
  1730. }
  1731. }
  1732. catch (e)
  1733. {
  1734. // ignore
  1735. }
  1736. }
  1737. return dataUri;
  1738. };
  1739. /**
  1740. * Returns the CSS font family from the given computed style.
  1741. */
  1742. Graph.stripQuotes = function(text)
  1743. {
  1744. if (text != null)
  1745. {
  1746. if (text.charAt(0) == '\'')
  1747. {
  1748. text = text.substring(1);
  1749. }
  1750. if (text.charAt(text.length - 1) == '\'')
  1751. {
  1752. text = text.substring(0, text.length - 1);
  1753. }
  1754. if (text.charAt(0) == '"')
  1755. {
  1756. text = text.substring(1);
  1757. }
  1758. if (text.charAt(text.length - 1) == '"')
  1759. {
  1760. text = text.substring(0, text.length - 1);
  1761. }
  1762. }
  1763. return text;
  1764. };
  1765. /**
  1766. * Create remove icon.
  1767. */
  1768. Graph.createRemoveIcon = function(title, onclick)
  1769. {
  1770. var removeLink = document.createElement('img');
  1771. removeLink.setAttribute('src', Dialog.prototype.clearImage);
  1772. removeLink.setAttribute('title', title);
  1773. removeLink.setAttribute('width', '13');
  1774. removeLink.setAttribute('height', '10');
  1775. removeLink.style.marginLeft = '4px';
  1776. removeLink.style.marginBottom = '-1px';
  1777. removeLink.style.cursor = 'pointer';
  1778. mxEvent.addListener(removeLink, 'click', onclick);
  1779. return removeLink;
  1780. };
  1781. /**
  1782. * Returns true if the given string is a page link.
  1783. */
  1784. Graph.isPageLink = function(text)
  1785. {
  1786. return text != null && text.substring(0, 13) == 'data:page/id,';
  1787. };
  1788. /**
  1789. * Returns true if the given string is a page link.
  1790. */
  1791. Graph.rewritePageLinks = function(doc)
  1792. {
  1793. var links = doc.getElementsByTagName('a');
  1794. function rewriteLink(link, attrib)
  1795. {
  1796. var href = link.getAttribute(attrib);
  1797. if (href != null && Graph.isPageLink(href))
  1798. {
  1799. link.setAttribute(attrib, '#' + href.substring(href.indexOf(':') + 1));
  1800. }
  1801. };
  1802. for (var i = 0; i < links.length; i++)
  1803. {
  1804. rewriteLink(links[i], 'href');
  1805. rewriteLink(links[i], 'xlink:href');
  1806. }
  1807. };
  1808. /**
  1809. * Returns true if the given string is a link.
  1810. *
  1811. * See https://stackoverflow.com/questions/5717093/check-if-a-javascript-string-is-a-url
  1812. */
  1813. Graph.isLink = function(text)
  1814. {
  1815. return text != null && Graph.linkPattern.test(text);
  1816. };
  1817. /**
  1818. * Regular expression for links.
  1819. */
  1820. Graph.linkPattern = new RegExp('^(https?:\\/\\/)?'+ // protocol
  1821. '((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|'+ // domain name
  1822. '((\\d{1,3}\\.){3}\\d{1,3}))'+ // OR ip (v4) address
  1823. '(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*'+ // port and path
  1824. '(\\?[;&a-z\\d%_.~+=-]*)?'+ // query string
  1825. '(\\#[-a-z\\d_]*)?$','i'); // fragment locator
  1826. /**
  1827. * Graph inherits from mxGraph.
  1828. */
  1829. mxUtils.extend(Graph, mxGraph);
  1830. /**
  1831. * Allows all values in fit.
  1832. */
  1833. Graph.prototype.minFitScale = null;
  1834. /**
  1835. * Allows all values in fit.
  1836. */
  1837. Graph.prototype.maxFitScale = null;
  1838. /**
  1839. * Sets the policy for links. Possible values are "self" to replace any framesets,
  1840. * "blank" to load the URL in <linkTarget> and "auto" (default).
  1841. */
  1842. Graph.prototype.linkPolicy = (urlParams['target'] == 'frame') ? 'blank' : (urlParams['target'] || 'auto');
  1843. /**
  1844. * Target for links that open in a new window. Default is _blank.
  1845. */
  1846. Graph.prototype.linkTarget = (urlParams['target'] == 'frame') ? '_self' : '_blank';
  1847. /**
  1848. * Value to the rel attribute of links. Default is 'nofollow noopener noreferrer'.
  1849. * NOTE: There are security implications when this is changed and if noopener is removed,
  1850. * then <openLink> must be overridden to allow for the opener to be set by default.
  1851. */
  1852. Graph.prototype.linkRelation = 'nofollow noopener noreferrer';
  1853. /**
  1854. * Scrollbars setting is overriden in the editor, but not in the viewer.
  1855. */
  1856. Graph.prototype.defaultScrollbars = true;
  1857. /**
  1858. * Specifies if the page should be visible for new files. Default is true.
  1859. */
  1860. Graph.prototype.defaultPageVisible = true;
  1861. /**
  1862. * Specifies if the page should be visible for new files. Default is true.
  1863. */
  1864. Graph.prototype.defaultGridEnabled = urlParams['grid'] != '0';
  1865. /**
  1866. * Specifies if the app should run in chromeless mode. Default is false.
  1867. * This default is only used if the contructor argument is null.
  1868. */
  1869. Graph.prototype.lightbox = false;
  1870. /**
  1871. *
  1872. */
  1873. Graph.prototype.defaultPageBackgroundColor = '#ffffff';
  1874. /**
  1875. *
  1876. */
  1877. Graph.prototype.diagramBackgroundColor = '#f0f0f0';
  1878. /**
  1879. * Whether to use diagramBackgroundColor for no page views.
  1880. */
  1881. Graph.prototype.enableDiagramBackground = false;
  1882. /**
  1883. *
  1884. */
  1885. Graph.prototype.defaultPageBorderColor = '#ffffff';
  1886. /**
  1887. *
  1888. */
  1889. Graph.prototype.shapeForegroundColor = '#000000';
  1890. /**
  1891. *
  1892. */
  1893. Graph.prototype.shapeBackgroundColor = '#ffffff';
  1894. /**
  1895. * Specifies the size of the size for "tiles" to be used for a graph with
  1896. * scrollbars but no visible background page. A good value is large
  1897. * enough to reduce the number of repaints that is caused for auto-
  1898. * translation, which depends on this value, and small enough to give
  1899. * a small empty buffer around the graph. Default is 400x400.
  1900. */
  1901. Graph.prototype.scrollTileSize = new mxRectangle(0, 0, 400, 400);
  1902. /**
  1903. * Overrides the background color and paints a transparent background.
  1904. */
  1905. Graph.prototype.transparentBackground = true;
  1906. /**
  1907. * Sets global constants.
  1908. */
  1909. Graph.prototype.selectParentAfterDelete = false;
  1910. /**
  1911. * Sets the default target for all links in cells.
  1912. */
  1913. Graph.prototype.defaultEdgeLength = 80;
  1914. /**
  1915. * Enables activation of special handles on unselected cells.
  1916. */
  1917. Graph.prototype.immediateHandling = true;
  1918. /**
  1919. * Allows all values in fit.
  1920. */
  1921. Graph.prototype.connectionArrowsEnabled = true;
  1922. /**
  1923. * Specifies the regular expression for matching placeholders.
  1924. */
  1925. Graph.prototype.placeholderPattern = new RegExp('%(date\{.*\}|[^%^\{^\}^ ^"^ \'^=^;]+)%', 'g');
  1926. /**
  1927. * Specifies the regular expression for matching placeholders.
  1928. */
  1929. Graph.prototype.absoluteUrlPattern = new RegExp('^(?:[a-z]+:)?//', 'i');
  1930. /**
  1931. * Specifies the default name for the theme. Default is 'default'.
  1932. */
  1933. Graph.prototype.defaultThemeName = 'default';
  1934. /**
  1935. * Specifies the default name for the theme. Default is 'default'.
  1936. */
  1937. Graph.prototype.defaultThemes = {};
  1938. /**
  1939. * Base URL for relative links.
  1940. */
  1941. Graph.prototype.baseUrl = (urlParams['base'] != null) ?
  1942. decodeURIComponent(urlParams['base']) :
  1943. (((window != window.top) ? document.referrer :
  1944. document.location.toString()).split('#')[0]);
  1945. /**
  1946. * Specifies if the label should be edited after an insert.
  1947. */
  1948. Graph.prototype.editAfterInsert = false;
  1949. /**
  1950. * Defines the built-in properties to be ignored in tooltips.
  1951. */
  1952. Graph.prototype.builtInProperties = ['label', 'tooltip', 'placeholders', 'placeholder'];
  1953. /**
  1954. * Defines if the graph is part of an EditorUi. If this is false the graph can
  1955. * be used in an EditorUi instance but will not have a UI added, functions
  1956. * overridden or event handlers added.
  1957. */
  1958. Graph.prototype.standalone = false;
  1959. /**
  1960. * Enables move of bends/segments without selecting.
  1961. */
  1962. Graph.prototype.enableFlowAnimation = false;
  1963. /**
  1964. * Background color for inactive tabs.
  1965. */
  1966. Graph.prototype.roundableShapes = ['label', 'rectangle', 'internalStorage', 'corner',
  1967. 'parallelogram', 'swimlane', 'triangle', 'trapezoid', 'ext', 'step', 'tee', 'process',
  1968. 'link', 'rhombus', 'offPageConnector', 'loopLimit', 'hexagon', 'manualInput', 'card',
  1969. 'curlyBracket', 'singleArrow', 'callout', 'doubleArrow', 'flexArrow', 'umlLifeline'];
  1970. /**
  1971. * Installs child layout styles.
  1972. */
  1973. Graph.prototype.init = function(container)
  1974. {
  1975. mxGraph.prototype.init.apply(this, arguments);
  1976. // Intercepts links with no target attribute and opens in new window
  1977. this.cellRenderer.initializeLabel = function(state, shape)
  1978. {
  1979. mxCellRenderer.prototype.initializeLabel.apply(this, arguments);
  1980. // Checks tolerance for clicks on links
  1981. var tol = state.view.graph.tolerance;
  1982. var handleClick = true;
  1983. var first = null;
  1984. var down = mxUtils.bind(this, function(evt)
  1985. {
  1986. handleClick = true;
  1987. first = new mxPoint(mxEvent.getClientX(evt), mxEvent.getClientY(evt));
  1988. });
  1989. var move = mxUtils.bind(this, function(evt)
  1990. {
  1991. handleClick = handleClick && first != null &&
  1992. Math.abs(first.x - mxEvent.getClientX(evt)) < tol &&
  1993. Math.abs(first.y - mxEvent.getClientY(evt)) < tol;
  1994. });
  1995. var up = mxUtils.bind(this, function(evt)
  1996. {
  1997. if (handleClick)
  1998. {
  1999. var elt = mxEvent.getSource(evt)
  2000. while (elt != null && elt != shape.node)
  2001. {
  2002. if (elt.nodeName.toLowerCase() == 'a')
  2003. {
  2004. state.view.graph.labelLinkClicked(state, elt, evt);
  2005. break;
  2006. }
  2007. elt = elt.parentNode;
  2008. }
  2009. }
  2010. });
  2011. mxEvent.addGestureListeners(shape.node, down, move, up);
  2012. mxEvent.addListener(shape.node, 'click', function(evt)
  2013. {
  2014. mxEvent.consume(evt);
  2015. });
  2016. };
  2017. // Handles custom links in tooltips
  2018. if (this.tooltipHandler != null)
  2019. {
  2020. var tooltipHandlerInit = this.tooltipHandler.init;
  2021. this.tooltipHandler.init = function()
  2022. {
  2023. tooltipHandlerInit.apply(this, arguments);
  2024. if (this.div != null)
  2025. {
  2026. mxEvent.addListener(this.div, 'click', mxUtils.bind(this, function(evt)
  2027. {
  2028. var source = mxEvent.getSource(evt);
  2029. if (source.nodeName == 'A')
  2030. {
  2031. var href = source.getAttribute('href');
  2032. if (href != null && this.graph.isCustomLink(href) &&
  2033. (mxEvent.isTouchEvent(evt) || !mxEvent.isPopupTrigger(evt)) &&
  2034. this.graph.customLinkClicked(href))
  2035. {
  2036. mxEvent.consume(evt);
  2037. }
  2038. }
  2039. }));
  2040. }
  2041. };
  2042. }
  2043. // Adds or updates CSS for flowAnimation style
  2044. this.addListener(mxEvent.SIZE, mxUtils.bind(this, function(sender, evt)
  2045. {
  2046. if (this.container != null && this.flowAnimationStyle)
  2047. {
  2048. var id = this.flowAnimationStyle.getAttribute('id');
  2049. this.flowAnimationStyle.innerHTML = this.getFlowAnimationStyleCss(id);
  2050. }
  2051. }));
  2052. this.initLayoutManager();
  2053. };
  2054. /**
  2055. * Implements zoom and offset via CSS transforms. This is currently only used
  2056. * in read-only as there are fewer issues with the mxCellState not being scaled
  2057. * and translated.
  2058. *
  2059. * KNOWN ISSUES TO FIX:
  2060. * - Apply CSS transforms to HTML labels in IE11
  2061. */
  2062. (function()
  2063. {
  2064. /**
  2065. * Uses CSS transforms for scale and translate.
  2066. */
  2067. Graph.prototype.useCssTransforms = false;
  2068. /**
  2069. * Contains the scale.
  2070. */
  2071. Graph.prototype.currentScale = 1;
  2072. /**
  2073. * Contains the offset.
  2074. */
  2075. Graph.prototype.currentTranslate = new mxPoint(0, 0);
  2076. /**
  2077. * Returns information about the current selection.
  2078. */
  2079. Graph.prototype.isFillState = function(state)
  2080. {
  2081. return !this.isSpecialColor(state.style[mxConstants.STYLE_FILLCOLOR]) &&
  2082. mxUtils.getValue(state.style, 'lineShape', null) != '1' &&
  2083. (this.model.isVertex(state.cell) ||
  2084. mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null) == 'arrow' ||
  2085. mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null) == 'wire' ||
  2086. mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null) == 'filledEdge' ||
  2087. mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null) == 'flexArrow' ||
  2088. mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null) == 'mxgraph.arrows2.wedgeArrow');
  2089. };
  2090. /**
  2091. * Returns information about the current selection.
  2092. */
  2093. Graph.prototype.isGradientState = function(state)
  2094. {
  2095. return this.isFillState(state) && mxUtils.getValue(state.style,
  2096. mxConstants.STYLE_SHAPE, null) != 'wire';
  2097. };
  2098. /**
  2099. * Returns information about the current selection.
  2100. */
  2101. Graph.prototype.isStrokeState = function(state)
  2102. {
  2103. return true;
  2104. };
  2105. /**
  2106. * Returns information about the current selection.
  2107. */
  2108. Graph.prototype.isSpecialColor = function(color)
  2109. {
  2110. return mxUtils.indexOf([mxConstants.STYLE_STROKECOLOR,
  2111. mxConstants.STYLE_FILLCOLOR, 'inherit', 'swimlane',
  2112. 'indicated'], color) >= 0;
  2113. };
  2114. /**
  2115. * Returns information about the current selection.
  2116. */
  2117. Graph.prototype.isGlassState = function(state)
  2118. {
  2119. var shape = mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null);
  2120. return (shape == 'label' || shape == 'rectangle' || shape == 'internalStorage' ||
  2121. shape == 'ext' || shape == 'umlLifeline' || shape == 'swimlane' ||
  2122. shape == 'process');
  2123. };
  2124. /**
  2125. * Returns information about the current selection.
  2126. */
  2127. Graph.prototype.isRoundedState = function(state)
  2128. {
  2129. return (state.shape != null) ? state.shape.isRoundable() :
  2130. mxUtils.indexOf(this.roundableShapes, mxUtils.getValue(state.style,
  2131. mxConstants.STYLE_SHAPE, null)) >= 0;
  2132. };
  2133. /**
  2134. * Returns information about the current selection.
  2135. */
  2136. Graph.prototype.isLineJumpState = function(state)
  2137. {
  2138. var shape = mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null);
  2139. var curved = mxUtils.getValue(state.style, mxConstants.STYLE_CURVED, false);
  2140. return !curved && (shape == 'connector' || shape == 'filledEdge' || shape == 'wire');
  2141. };
  2142. /**
  2143. * Returns information about the current selection.
  2144. */
  2145. Graph.prototype.isAutoSizeState = function(state)
  2146. {
  2147. return mxUtils.getValue(state.style, mxConstants.STYLE_AUTOSIZE, null) == '1';
  2148. };
  2149. /**
  2150. * Returns information about the current selection.
  2151. */
  2152. Graph.prototype.isImageState = function(state)
  2153. {
  2154. return mxUtils.getValue(state.style, mxConstants.STYLE_IMAGE, null) != null;
  2155. };
  2156. /**
  2157. * Returns information about the current selection.
  2158. */
  2159. Graph.prototype.isShadowState = function(state)
  2160. {
  2161. var shape = mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null);
  2162. return (shape != 'image');
  2163. };
  2164. /**
  2165. *
  2166. */
  2167. Graph.prototype.getVerticesAndEdges = function(vertices, edges)
  2168. {
  2169. vertices = (vertices != null) ? vertices : true;
  2170. edges = (edges != null) ? edges : true;
  2171. var model = this.model;
  2172. return model.filterDescendants(function(cell)
  2173. {
  2174. return (vertices && model.isVertex(cell)) || (edges && model.isEdge(cell));
  2175. }, model.getRoot());
  2176. };
  2177. /**
  2178. * Returns information about the current selection.
  2179. */
  2180. Graph.prototype.applyNewEdgeStyle = function(source, edges, dir)
  2181. {
  2182. var style = this.getCellStyle(source);
  2183. var temp = style['newEdgeStyle'];
  2184. if (temp != null)
  2185. {
  2186. this.model.beginUpdate();
  2187. try
  2188. {
  2189. var styles = JSON.parse(temp);
  2190. for (var key in styles)
  2191. {
  2192. this.setCellStyles(key, styles[key], edges);
  2193. // Sets elbow direction
  2194. if (key == 'edgeStyle' && styles[key] == 'elbowEdgeStyle' && dir != null)
  2195. {
  2196. this.setCellStyles('elbow', (dir == mxConstants.DIRECTION_SOUTH ||
  2197. dir == mxConstants.DIRECTION_NOTH) ? 'vertical' : 'horizontal',
  2198. edges);
  2199. }
  2200. }
  2201. }
  2202. finally
  2203. {
  2204. this.model.endUpdate();
  2205. }
  2206. }
  2207. };
  2208. /**
  2209. * Returns information about the current selection.
  2210. */
  2211. Graph.prototype.getCommonStyle = function(cells)
  2212. {
  2213. var style = {};
  2214. for (var i = 0; i < cells.length; i++)
  2215. {
  2216. var state = this.view.getState(cells[i]);
  2217. if (state != null)
  2218. {
  2219. this.mergeStyle(state.style, style, i == 0);
  2220. }
  2221. }
  2222. return style;
  2223. };
  2224. /**
  2225. * Returns information about the current selection.
  2226. */
  2227. Graph.prototype.mergeStyle = function(style, into, initial)
  2228. {
  2229. if (style != null)
  2230. {
  2231. var keys = {};
  2232. for (var key in style)
  2233. {
  2234. var value = style[key];
  2235. if (value != null)
  2236. {
  2237. keys[key] = true;
  2238. if (into[key] == null && initial)
  2239. {
  2240. into[key] = value;
  2241. }
  2242. else if (into[key] != value)
  2243. {
  2244. delete into[key];
  2245. }
  2246. }
  2247. }
  2248. for (var key in into)
  2249. {
  2250. if (!keys[key])
  2251. {
  2252. delete into[key];
  2253. }
  2254. }
  2255. }
  2256. };
  2257. /**
  2258. * Returns the cell for editing the given cell.
  2259. */
  2260. Graph.prototype.getStartEditingCell = function(cell, trigger)
  2261. {
  2262. // Redirect editing for tables
  2263. var style = this.getCellStyle(cell);
  2264. var size = parseInt(mxUtils.getValue(style, mxConstants.STYLE_STARTSIZE, 0));
  2265. if (this.isTable(cell) && (!this.isSwimlane(cell) ||
  2266. size == 0) && this.getLabel(cell) == '' &&
  2267. this.model.getChildCount(cell) > 0)
  2268. {
  2269. cell = this.model.getChildAt(cell, 0);
  2270. style = this.getCellStyle(cell);
  2271. size = parseInt(mxUtils.getValue(style, mxConstants.STYLE_STARTSIZE, 0));
  2272. }
  2273. // Redirect editing for table rows
  2274. if (this.isTableRow(cell) && (!this.isSwimlane(cell) ||
  2275. size == 0) && this.getLabel(cell) == '' &&
  2276. this.model.getChildCount(cell) > 0)
  2277. {
  2278. for (var i = 0; i < this.model.getChildCount(cell); i++)
  2279. {
  2280. var temp = this.model.getChildAt(cell, i);
  2281. if (this.isCellEditable(temp))
  2282. {
  2283. cell = temp;
  2284. break;
  2285. }
  2286. }
  2287. }
  2288. return cell;
  2289. };
  2290. /**
  2291. * Returns the style of the given cell as an object.
  2292. */
  2293. Graph.prototype.copyStyle = function(cell)
  2294. {
  2295. return this.getCellStyle(cell, false);
  2296. };
  2297. /**
  2298. * Returns true if fast zoom preview should be used.
  2299. */
  2300. Graph.prototype.pasteStyle = function(style, cells, keys)
  2301. {
  2302. keys = (keys != null) ? keys : Graph.pasteStyles;
  2303. Graph.removeKeys(style, function(key)
  2304. {
  2305. return mxUtils.indexOf(keys, key) < 0;
  2306. });
  2307. this.updateCellStyles(style, cells);
  2308. };
  2309. /**
  2310. * Removes implicit styles from cell styles so that dark mode works using the
  2311. * default values from the stylesheet.
  2312. */
  2313. Graph.prototype.updateCellStyles = function(style, cells)
  2314. {
  2315. this.model.beginUpdate();
  2316. try
  2317. {
  2318. for (var i = 0; i < cells.length; i++)
  2319. {
  2320. if (this.model.isVertex(cells[i]) || this.model.isEdge(cells[i]))
  2321. {
  2322. var cellStyle = this.getCellStyle(cells[i], false);
  2323. var perimeter = cellStyle[mxConstants.STYLE_PERIMETER];
  2324. var restorePerimeter = false;
  2325. for (var key in style)
  2326. {
  2327. var value = style[key];
  2328. if (cellStyle[key] != value)
  2329. {
  2330. // Handles paste of shape to UML lifeline
  2331. if (key == mxConstants.STYLE_SHAPE &&
  2332. cellStyle[key] == 'umlLifeline' &&
  2333. value != 'umlLifeline')
  2334. {
  2335. restorePerimeter = true;
  2336. key = 'participant';
  2337. }
  2338. this.setCellStyles(key, value, [cells[i]]);
  2339. }
  2340. }
  2341. if (restorePerimeter)
  2342. {
  2343. this.setCellStyles(mxConstants.STYLE_PERIMETER, perimeter, [cells[i]]);
  2344. }
  2345. }
  2346. }
  2347. }
  2348. finally
  2349. {
  2350. this.model.endUpdate();
  2351. }
  2352. };
  2353. /**
  2354. * Returns true if fast zoom preview should be used.
  2355. */
  2356. Graph.prototype.isFastZoomEnabled = function()
  2357. {
  2358. return urlParams['zoom'] != 'nocss' && !mxClient.NO_FO && !mxClient.IS_EDGE &&
  2359. !this.useCssTransforms && (this.isCssTransformsSupported() || mxClient.IS_IOS);
  2360. };
  2361. /**
  2362. * Only foreignObject supported for now (no IE11). Safari disabled as it ignores
  2363. * overflow visible on foreignObject in negative space (lightbox and viewer).
  2364. * Check the following test case on page 1 before enabling this in production:
  2365. * https://devhost.jgraph.com/git/drawio/etc/embed/sf-math-fo-clipping.html?dev=1
  2366. */
  2367. Graph.prototype.isCssTransformsSupported = function()
  2368. {
  2369. return this.dialect == mxConstants.DIALECT_SVG && !mxClient.NO_FO &&
  2370. (!this.lightbox || !mxClient.IS_SF);
  2371. };
  2372. /**
  2373. * Function: getCellAt
  2374. *
  2375. * Needs to modify original method for recursive call.
  2376. */
  2377. Graph.prototype.getCellAt = function(x, y, parent, vertices, edges, ignoreFn)
  2378. {
  2379. if (this.useCssTransforms)
  2380. {
  2381. x = x / this.currentScale - this.currentTranslate.x;
  2382. y = y / this.currentScale - this.currentTranslate.y;
  2383. }
  2384. return this.getScaledCellAt.apply(this, arguments);
  2385. };
  2386. /**
  2387. * Function: getScaledCellAt
  2388. *
  2389. * Overridden for recursion.
  2390. */
  2391. Graph.prototype.getScaledCellAt = function(x, y, parent, vertices, edges, ignoreFn)
  2392. {
  2393. vertices = (vertices != null) ? vertices : true;
  2394. edges = (edges != null) ? edges : true;
  2395. if (parent == null)
  2396. {
  2397. parent = this.getCurrentRoot();
  2398. if (parent == null)
  2399. {
  2400. parent = this.getModel().getRoot();
  2401. }
  2402. }
  2403. if (parent != null)
  2404. {
  2405. var childCount = this.model.getChildCount(parent);
  2406. for (var i = childCount - 1; i >= 0; i--)
  2407. {
  2408. var cell = this.model.getChildAt(parent, i);
  2409. var result = this.getScaledCellAt(x, y, cell, vertices, edges, ignoreFn);
  2410. if (result != null)
  2411. {
  2412. return result;
  2413. }
  2414. else if (this.isCellVisible(cell) && (edges && this.model.isEdge(cell) ||
  2415. vertices && this.model.isVertex(cell)))
  2416. {
  2417. var state = this.view.getState(cell);
  2418. if (state != null && (ignoreFn == null || !ignoreFn(state, x, y)) &&
  2419. this.intersects(state, x, y))
  2420. {
  2421. return cell;
  2422. }
  2423. }
  2424. }
  2425. }
  2426. return null;
  2427. };
  2428. /**
  2429. * Returns if the child cells of the given vertex cell state should be resized.
  2430. */
  2431. Graph.prototype.isRecursiveVertexResize = function(state)
  2432. {
  2433. return !this.isSwimlane(state.cell) && this.model.getChildCount(state.cell) > 0 &&
  2434. !this.isCellCollapsed(state.cell) && mxUtils.getValue(state.style, 'recursiveResize', '1') == '1' &&
  2435. mxUtils.getValue(state.style, 'childLayout', null) == null;
  2436. }
  2437. /**
  2438. * Returns the first parent with an absolute or no geometry.
  2439. */
  2440. Graph.prototype.getAbsoluteParent = function(cell)
  2441. {
  2442. var result = cell;
  2443. var geo = this.getCellGeometry(result);
  2444. while (geo != null && geo.relative)
  2445. {
  2446. result = this.getModel().getParent(result);
  2447. geo = this.getCellGeometry(result);
  2448. }
  2449. return result;
  2450. };
  2451. /**
  2452. * Returns the first parent that is not a part.
  2453. */
  2454. Graph.prototype.isPart = function(cell)
  2455. {
  2456. return mxUtils.getValue(this.getCurrentCellStyle(cell), 'part', '0') == '1' ||
  2457. this.isTableCell(cell) || this.isTableRow(cell);
  2458. };
  2459. /**
  2460. * Returns the first parent that is not a part.
  2461. */
  2462. Graph.prototype.getCompositeParents = function(cells)
  2463. {
  2464. var lookup = new mxDictionary();
  2465. var newCells = [];
  2466. for (var i = 0; i < cells.length; i++)
  2467. {
  2468. var cell = this.getCompositeParent(cells[i]);
  2469. if (this.isTableCell(cell))
  2470. {
  2471. cell = this.graph.model.getParent(cell);
  2472. }
  2473. if (this.isTableRow(cell))
  2474. {
  2475. cell = this.graph.model.getParent(cell);
  2476. }
  2477. if (cell != null && !lookup.get(cell))
  2478. {
  2479. lookup.put(cell, true);
  2480. newCells.push(cell);
  2481. }
  2482. }
  2483. return newCells;
  2484. };
  2485. /**
  2486. * Returns the given terminal that is not relative, an edge or a part.
  2487. */
  2488. Graph.prototype.getReferenceTerminal = function(terminal)
  2489. {
  2490. if (terminal != null)
  2491. {
  2492. var geo = this.getCellGeometry(terminal);
  2493. if (geo != null && geo.relative)
  2494. {
  2495. terminal = this.model.getParent(terminal);
  2496. }
  2497. }
  2498. if (terminal != null && this.model.isEdge(terminal))
  2499. {
  2500. terminal = this.model.getParent(terminal);
  2501. }
  2502. if (terminal != null)
  2503. {
  2504. terminal = this.getCompositeParent(terminal);
  2505. }
  2506. return terminal;
  2507. };
  2508. /**
  2509. * Returns the first parent that is not a part.
  2510. */
  2511. Graph.prototype.getCompositeParent = function(cell)
  2512. {
  2513. while (this.isPart(cell))
  2514. {
  2515. var temp = this.model.getParent(cell);
  2516. if (!this.model.isVertex(temp))
  2517. {
  2518. break;
  2519. }
  2520. cell = temp;
  2521. }
  2522. return cell;
  2523. };
  2524. /**
  2525. * Returns the selection cells where the given function returns false.
  2526. */
  2527. Graph.prototype.filterSelectionCells = function(ignoreFn)
  2528. {
  2529. var cells = this.getSelectionCells();
  2530. if (ignoreFn != null)
  2531. {
  2532. var temp = [];
  2533. for (var i = 0; i < cells.length; i++)
  2534. {
  2535. if (!ignoreFn(cells[i]))
  2536. {
  2537. temp.push(cells[i]);
  2538. }
  2539. }
  2540. cells = temp;
  2541. }
  2542. return cells;
  2543. };
  2544. /**
  2545. * Overrides scrollRectToVisible to fix ignored transform.
  2546. */
  2547. var graphScrollRectToVisible = mxGraph.prototype.scrollRectToVisible;
  2548. Graph.prototype.scrollRectToVisible = function(r)
  2549. {
  2550. if (this.useCssTransforms)
  2551. {
  2552. var s = this.currentScale;
  2553. var t = this.currentTranslate;
  2554. r = new mxRectangle((r.x + 2 * t.x) * s - t.x,
  2555. (r.y + 2 * t.y) * s - t.y,
  2556. r.width * s, r.height * s);
  2557. }
  2558. graphScrollRectToVisible.apply(this, arguments);
  2559. };
  2560. /**
  2561. * Function: repaint
  2562. *
  2563. * Updates the highlight after a change of the model or view.
  2564. */
  2565. mxCellHighlight.prototype.getStrokeWidth = function(state)
  2566. {
  2567. var s = this.strokeWidth;
  2568. if (this.graph.useCssTransforms)
  2569. {
  2570. s /= this.graph.currentScale;
  2571. }
  2572. return s;
  2573. };
  2574. /**
  2575. * Function: getGraphBounds
  2576. *
  2577. * Overrides getGraphBounds to use bounding box from SVG.
  2578. */
  2579. mxGraphView.prototype.getGraphBounds = function()
  2580. {
  2581. var b = this.graphBounds;
  2582. if (this.graph.useCssTransforms)
  2583. {
  2584. var t = this.graph.currentTranslate;
  2585. var s = this.graph.currentScale;
  2586. b = new mxRectangle(
  2587. (b.x + t.x) * s, (b.y + t.y) * s,
  2588. b.width * s, b.height * s);
  2589. }
  2590. return b;
  2591. };
  2592. /**
  2593. * Overrides to bypass full cell tree validation.
  2594. * TODO: Check if this improves performance
  2595. */
  2596. mxGraphView.prototype.viewStateChanged = function()
  2597. {
  2598. if (this.graph.useCssTransforms)
  2599. {
  2600. this.validate();
  2601. this.graph.sizeDidChange();
  2602. }
  2603. else
  2604. {
  2605. this.revalidate();
  2606. this.graph.sizeDidChange();
  2607. }
  2608. };
  2609. /**
  2610. * Overrides validate to normalize validation view state and pass
  2611. * current state to CSS transform.
  2612. */
  2613. var graphViewValidate = mxGraphView.prototype.validate;
  2614. mxGraphView.prototype.validate = function(cell)
  2615. {
  2616. if (this.graph.useCssTransforms)
  2617. {
  2618. this.graph.currentScale = this.scale;
  2619. this.graph.currentTranslate.x = this.translate.x;
  2620. this.graph.currentTranslate.y = this.translate.y;
  2621. this.scale = 1;
  2622. this.translate.x = 0;
  2623. this.translate.y = 0;
  2624. }
  2625. graphViewValidate.apply(this, arguments);
  2626. if (this.graph.useCssTransforms)
  2627. {
  2628. this.graph.updateCssTransform();
  2629. this.scale = this.graph.currentScale;
  2630. this.translate.x = this.graph.currentTranslate.x;
  2631. this.translate.y = this.graph.currentTranslate.y;
  2632. }
  2633. };
  2634. /**
  2635. * Overrides function to exclude table cells and rows from groups.
  2636. */
  2637. var graphGetCellsForGroup = mxGraph.prototype.getCellsForGroup;
  2638. Graph.prototype.getCellsForGroup = function(cells)
  2639. {
  2640. cells = graphGetCellsForGroup.apply(this, arguments);
  2641. var result = [];
  2642. // Filters selection cells with the same parent
  2643. for (var i = 0; i < cells.length; i++)
  2644. {
  2645. if (!this.isTableRow(cells[i]) &&
  2646. !this.isTableCell(cells[i]))
  2647. {
  2648. result.push(cells[i]);
  2649. }
  2650. }
  2651. return result;
  2652. };
  2653. /**
  2654. * Overrides function to exclude tables, rows and cells from ungrouping.
  2655. */
  2656. var graphGetCellsForUngroup = mxGraph.prototype.getCellsForUngroup;
  2657. Graph.prototype.getCellsForUngroup = function(cells)
  2658. {
  2659. cells = graphGetCellsForUngroup.apply(this, arguments);
  2660. var result = [];
  2661. // Filters selection cells with the same parent
  2662. for (var i = 0; i < cells.length; i++)
  2663. {
  2664. if (!this.isTable(cells[i]) &&
  2665. !this.isTableRow(cells[i]) &&
  2666. !this.isTableCell(cells[i]))
  2667. {
  2668. result.push(cells[i]);
  2669. }
  2670. }
  2671. return result;
  2672. };
  2673. /**
  2674. * Function: updateCssTransform
  2675. *
  2676. * Zooms out of the graph by <zoomFactor>.
  2677. */
  2678. Graph.prototype.updateCssTransform = function()
  2679. {
  2680. var temp = this.view.getDrawPane();
  2681. if (temp != null)
  2682. {
  2683. var g = temp.parentNode;
  2684. if (!this.useCssTransforms)
  2685. {
  2686. g.removeAttribute('transformOrigin');
  2687. g.removeAttribute('transform');
  2688. }
  2689. else
  2690. {
  2691. var prev = g.getAttribute('transform');
  2692. g.setAttribute('transformOrigin', '0 0');
  2693. var s = Math.round(this.currentScale * 100) / 100;
  2694. var dx = Math.round(this.currentTranslate.x * 100) / 100;
  2695. var dy = Math.round(this.currentTranslate.y * 100) / 100;
  2696. g.setAttribute('transform', 'scale(' + s + ',' + s + ')' +
  2697. 'translate(' + dx + ',' + dy + ')');
  2698. // Applies workarounds only if translate has changed
  2699. if (prev != g.getAttribute('transform'))
  2700. {
  2701. this.fireEvent(new mxEventObject('cssTransformChanged'),
  2702. 'transform', g.getAttribute('transform'));
  2703. }
  2704. }
  2705. }
  2706. };
  2707. var graphViewValidateBackgroundPage = mxGraphView.prototype.validateBackgroundPage;
  2708. mxGraphView.prototype.validateBackgroundPage = function()
  2709. {
  2710. var useCssTranforms = this.graph.useCssTransforms, scale = this.scale,
  2711. translate = this.translate;
  2712. if (useCssTranforms)
  2713. {
  2714. this.scale = this.graph.currentScale;
  2715. this.translate = this.graph.currentTranslate;
  2716. }
  2717. graphViewValidateBackgroundPage.apply(this, arguments);
  2718. if (useCssTranforms)
  2719. {
  2720. this.scale = scale;
  2721. this.translate = translate;
  2722. }
  2723. };
  2724. var graphUpdatePageBreaks = mxGraph.prototype.updatePageBreaks;
  2725. mxGraph.prototype.updatePageBreaks = function(visible, width, height)
  2726. {
  2727. var useCssTranforms = this.useCssTransforms, scale = this.view.scale,
  2728. translate = this.view.translate;
  2729. if (useCssTranforms)
  2730. {
  2731. this.view.scale = 1;
  2732. this.view.translate = new mxPoint(0, 0);
  2733. this.useCssTransforms = false;
  2734. }
  2735. graphUpdatePageBreaks.apply(this, arguments);
  2736. if (useCssTranforms)
  2737. {
  2738. this.view.scale = scale;
  2739. this.view.translate = translate;
  2740. this.useCssTransforms = true;
  2741. }
  2742. };
  2743. })();
  2744. /**
  2745. * Sets the XML node for the current diagram.
  2746. */
  2747. Graph.prototype.isLightboxView = function()
  2748. {
  2749. return this.lightbox;
  2750. };
  2751. /**
  2752. * Sets the XML node for the current diagram.
  2753. */
  2754. Graph.prototype.isViewer = function()
  2755. {
  2756. return false;
  2757. };
  2758. /**
  2759. * Installs automatic layout via styles
  2760. */
  2761. Graph.prototype.labelLinkClicked = function(state, elt, evt)
  2762. {
  2763. var href = elt.getAttribute('href');
  2764. // Blocks and removes unsafe links in labels
  2765. if (href != Graph.sanitizeLink(href))
  2766. {
  2767. Graph.sanitizeNode(elt);
  2768. }
  2769. if (href != null && !this.isCustomLink(href) && ((mxEvent.isLeftMouseButton(evt) &&
  2770. !mxEvent.isPopupTrigger(evt)) || mxEvent.isTouchEvent(evt)))
  2771. {
  2772. if (!this.isEnabled() || this.isCellLocked(state.cell))
  2773. {
  2774. var target = this.isBlankLink(href) ? this.linkTarget : '_top';
  2775. this.openLink(this.getAbsoluteUrl(href), target);
  2776. }
  2777. mxEvent.consume(evt);
  2778. }
  2779. };
  2780. /**
  2781. * Returns the size of the page format scaled with the page size.
  2782. */
  2783. Graph.prototype.openLink = function(href, target, allowOpener)
  2784. {
  2785. var result = window;
  2786. try
  2787. {
  2788. href = Graph.sanitizeLink(href);
  2789. if (href != null)
  2790. {
  2791. // Workaround for blocking in same iframe
  2792. if (target == '_self' && window != window.top)
  2793. {
  2794. window.location.href = href;
  2795. }
  2796. else
  2797. {
  2798. // Avoids page reload for anchors (workaround for IE but used everywhere)
  2799. if (href.substring(0, this.baseUrl.length) == this.baseUrl &&
  2800. href.charAt(this.baseUrl.length) == '#' &&
  2801. target == '_top' && window == window.top)
  2802. {
  2803. var hash = href.split('#')[1];
  2804. // Forces navigation if on same hash
  2805. if (window.location.hash == '#' + hash)
  2806. {
  2807. window.location.hash = '';
  2808. }
  2809. window.location.hash = hash;
  2810. }
  2811. else
  2812. {
  2813. result = window.open(href, (target != null) ?
  2814. target : '_blank', (!allowOpener) ?
  2815. 'noopener,noreferrer' : null);
  2816. if (result != null && !allowOpener)
  2817. {
  2818. result.opener = null;
  2819. }
  2820. }
  2821. }
  2822. }
  2823. }
  2824. catch (e)
  2825. {
  2826. // ignores permission denied
  2827. }
  2828. return result;
  2829. };
  2830. /**
  2831. * Adds support for page links.
  2832. */
  2833. Graph.prototype.getLinkTitle = function(href)
  2834. {
  2835. return href.substring(href.lastIndexOf('/') + 1);
  2836. };
  2837. /**
  2838. * Adds support for page links.
  2839. */
  2840. Graph.prototype.isCustomLink = function(href)
  2841. {
  2842. return href.substring(0, 5) == 'data:';
  2843. };
  2844. /**
  2845. * Adds support for page links.
  2846. */
  2847. Graph.prototype.customLinkClicked = function(link)
  2848. {
  2849. return false;
  2850. };
  2851. /**
  2852. * Returns true if the given href references an external protocol that
  2853. * should never open in a new window. Default returns true for mailto.
  2854. */
  2855. Graph.prototype.isExternalProtocol = function(href)
  2856. {
  2857. return href.substring(0, 7) === 'mailto:';
  2858. };
  2859. /**
  2860. * Hook for links to open in same window. Default returns true for anchors,
  2861. * links to same domain or if target == 'self' in the config.
  2862. */
  2863. Graph.prototype.isBlankLink = function(href)
  2864. {
  2865. return !this.isExternalProtocol(href) &&
  2866. (this.linkPolicy === 'blank' ||
  2867. (this.linkPolicy !== 'self' &&
  2868. !this.isRelativeUrl(href) &&
  2869. href.substring(0, this.domainUrl.length) !== this.domainUrl));
  2870. };
  2871. /**
  2872. *
  2873. */
  2874. Graph.prototype.isRelativeUrl = function(url)
  2875. {
  2876. return url != null && !this.absoluteUrlPattern.test(url) &&
  2877. url.substring(0, 5) !== 'data:' &&
  2878. !this.isExternalProtocol(url);
  2879. };
  2880. /**
  2881. *
  2882. */
  2883. Graph.prototype.getAbsoluteUrl = function(url)
  2884. {
  2885. if (url != null && this.isRelativeUrl(url))
  2886. {
  2887. if (url.charAt(0) == '#')
  2888. {
  2889. url = this.baseUrl + url;
  2890. }
  2891. else if (url.charAt(0) == '/')
  2892. {
  2893. url = this.domainUrl + url;
  2894. }
  2895. else
  2896. {
  2897. url = this.domainPathUrl + url;
  2898. }
  2899. }
  2900. return url;
  2901. };
  2902. /**
  2903. * Installs automatic layout via styles
  2904. */
  2905. Graph.prototype.initLayoutManager = function()
  2906. {
  2907. this.layoutManager = new mxLayoutManager(this);
  2908. this.layoutManager.hasLayout = function(cell)
  2909. {
  2910. return this.graph.getCellStyle(cell)['childLayout'] != null;
  2911. };
  2912. this.layoutManager.getLayout = function(cell, eventName)
  2913. {
  2914. var parent = this.graph.model.getParent(cell);
  2915. // Executes layouts from top to bottom except for nested layouts where
  2916. // child layouts are executed before and after the parent layout runs
  2917. // in case the layout changes the size of the child cell
  2918. if (!this.graph.isCellCollapsed(cell) && (eventName != mxEvent.BEGIN_UPDATE ||
  2919. this.hasLayout(parent, eventName)))
  2920. {
  2921. var style = this.graph.getCellStyle(cell);
  2922. if (style['childLayout'] == 'stackLayout')
  2923. {
  2924. var stackLayout = new mxStackLayout(this.graph, true);
  2925. stackLayout.resizeParentMax = mxUtils.getValue(style, 'resizeParentMax', '1') == '1';
  2926. stackLayout.horizontal = mxUtils.getValue(style, 'horizontalStack', '1') == '1';
  2927. stackLayout.resizeParent = mxUtils.getValue(style, 'resizeParent', '1') == '1';
  2928. stackLayout.resizeLast = mxUtils.getValue(style, 'resizeLast', '0') == '1';
  2929. stackLayout.spacing = style['stackSpacing'] || stackLayout.spacing;
  2930. stackLayout.border = style['stackBorder'] || stackLayout.border;
  2931. stackLayout.marginLeft = style['marginLeft'] || 0;
  2932. stackLayout.marginRight = style['marginRight'] || 0;
  2933. stackLayout.marginTop = style['marginTop'] || 0;
  2934. stackLayout.marginBottom = style['marginBottom'] || 0;
  2935. stackLayout.allowGaps = style['allowGaps'] || 0;
  2936. stackLayout.fill = true;
  2937. if (stackLayout.allowGaps)
  2938. {
  2939. stackLayout.gridSize = parseFloat(mxUtils.getValue(style, 'stackUnitSize', 20));
  2940. }
  2941. return stackLayout;
  2942. }
  2943. else if (style['childLayout'] == 'treeLayout')
  2944. {
  2945. var treeLayout = new mxCompactTreeLayout(this.graph);
  2946. treeLayout.horizontal = mxUtils.getValue(style, 'horizontalTree', '1') == '1';
  2947. treeLayout.resizeParent = mxUtils.getValue(style, 'resizeParent', '1') == '1';
  2948. treeLayout.groupPadding = mxUtils.getValue(style, 'parentPadding', 20);
  2949. treeLayout.levelDistance = mxUtils.getValue(style, 'treeLevelDistance', 30);
  2950. treeLayout.maintainParentLocation = true;
  2951. treeLayout.edgeRouting = false;
  2952. treeLayout.resetEdges = false;
  2953. return treeLayout;
  2954. }
  2955. else if (style['childLayout'] == 'flowLayout')
  2956. {
  2957. var flowLayout = new mxHierarchicalLayout(this.graph, mxUtils.getValue(style,
  2958. 'flowOrientation', mxConstants.DIRECTION_EAST));
  2959. flowLayout.resizeParent = mxUtils.getValue(style, 'resizeParent', '1') == '1';
  2960. flowLayout.parentBorder = mxUtils.getValue(style, 'parentPadding', 20);
  2961. flowLayout.maintainParentLocation = true;
  2962. // Special undocumented styles for changing the hierarchical
  2963. flowLayout.intraCellSpacing = mxUtils.getValue(style, 'intraCellSpacing',
  2964. mxHierarchicalLayout.prototype.intraCellSpacing);
  2965. flowLayout.interRankCellSpacing = mxUtils.getValue(style, 'interRankCellSpacing',
  2966. mxHierarchicalLayout.prototype.interRankCellSpacing);
  2967. flowLayout.interHierarchySpacing = mxUtils.getValue(style, 'interHierarchySpacing',
  2968. mxHierarchicalLayout.prototype.interHierarchySpacing);
  2969. flowLayout.parallelEdgeSpacing = mxUtils.getValue(style, 'parallelEdgeSpacing',
  2970. mxHierarchicalLayout.prototype.parallelEdgeSpacing);
  2971. return flowLayout;
  2972. }
  2973. else if (style['childLayout'] == 'circleLayout')
  2974. {
  2975. return new mxCircleLayout(this.graph);
  2976. }
  2977. else if (style['childLayout'] == 'organicLayout')
  2978. {
  2979. return new mxFastOrganicLayout(this.graph);
  2980. }
  2981. else if (style['childLayout'] == 'tableLayout')
  2982. {
  2983. return new TableLayout(this.graph);
  2984. }
  2985. else if (style['childLayout'] != null && style['childLayout'].charAt(0) == '[')
  2986. {
  2987. try
  2988. {
  2989. return new mxCompositeLayout(this.graph,
  2990. this.graph.createLayouts(JSON.parse(
  2991. style['childLayout'])));
  2992. }
  2993. catch (e)
  2994. {
  2995. if (window.console != null)
  2996. {
  2997. console.error(e);
  2998. }
  2999. }
  3000. }
  3001. }
  3002. return null;
  3003. };
  3004. };
  3005. /**
  3006. * Creates an array of graph layouts from the given array of the form [{layout: name, config: obj}, ...]
  3007. * where name is the layout constructor name and config contains the properties of the layout instance.
  3008. */
  3009. Graph.prototype.createLayouts = function(list)
  3010. {
  3011. var layouts = [];
  3012. for (var i = 0; i < list.length; i++)
  3013. {
  3014. if (mxUtils.indexOf(Graph.layoutNames, list[i].layout) >= 0)
  3015. {
  3016. // Handles special case of branch optimizer in orgchart
  3017. var layout = (list[i].layout == 'mxOrgChartLayout' && list[i].config != null) ?
  3018. new window[list[i].layout](this, list[i].config['branchOptimizer']) :
  3019. new window[list[i].layout](this);
  3020. if (list[i].config != null)
  3021. {
  3022. for (var key in list[i].config)
  3023. {
  3024. // Ignores branch optimizer in orgchart (handled above)
  3025. if (list[i].layout != 'mxOrgChartLayout' ||
  3026. key != 'branchOptimizer')
  3027. {
  3028. layout[key] = list[i].config[key];
  3029. }
  3030. }
  3031. }
  3032. layouts.push(layout);
  3033. }
  3034. else
  3035. {
  3036. throw Error(mxResources.get('invalidCallFnNotFound', [list[i].layout]));
  3037. }
  3038. }
  3039. return layouts;
  3040. };
  3041. /**
  3042. * Returns the metadata of the given cells as a JSON object.
  3043. */
  3044. Graph.prototype.getDataForCells = function(cells)
  3045. {
  3046. var result = [];
  3047. for (var i = 0; i < cells.length; i++)
  3048. {
  3049. var attrs = (cells[i].value != null) ? cells[i].value.attributes : null;
  3050. var row = {};
  3051. row.id = cells[i].id;
  3052. if (attrs != null)
  3053. {
  3054. for (var j = 0; j < attrs.length; j++)
  3055. {
  3056. row[attrs[j].nodeName] = attrs[j].nodeValue;
  3057. }
  3058. }
  3059. else
  3060. {
  3061. row.label = this.convertValueToString(cells[i]);
  3062. }
  3063. result.push(row);
  3064. }
  3065. return result;
  3066. };
  3067. /**
  3068. * Returns the DOM nodes for the given cells.
  3069. */
  3070. Graph.prototype.getNodesForCells = function(cells)
  3071. {
  3072. var nodes = [];
  3073. for (var i = 0; i < cells.length; i++)
  3074. {
  3075. var state = this.view.getState(cells[i]);
  3076. if (state != null)
  3077. {
  3078. var shapes = this.cellRenderer.getShapesForState(state);
  3079. for (var j = 0; j < shapes.length; j++)
  3080. {
  3081. if (shapes[j] != null && shapes[j].node != null)
  3082. {
  3083. nodes.push(shapes[j].node);
  3084. }
  3085. }
  3086. // Adds folding icon
  3087. if (state.control != null && state.control.node != null)
  3088. {
  3089. nodes.push(state.control.node);
  3090. }
  3091. }
  3092. }
  3093. return nodes;
  3094. };
  3095. /**
  3096. * Creates animations for the given cells.
  3097. */
  3098. Graph.prototype.createWipeAnimations = function(cells, wipeIn)
  3099. {
  3100. var animations = [];
  3101. for (var i = 0; i < cells.length; i++)
  3102. {
  3103. var state = this.view.getState(cells[i]);
  3104. if (state != null && state.shape != null)
  3105. {
  3106. // TODO: include descendants
  3107. if (this.model.isEdge(state.cell) &&
  3108. state.absolutePoints != null &&
  3109. state.absolutePoints.length > 1)
  3110. {
  3111. animations.push(this.createEdgeWipeAnimation(state, wipeIn));
  3112. }
  3113. else if (this.model.isVertex(state.cell) &&
  3114. state.shape.bounds != null)
  3115. {
  3116. animations.push(this.createVertexWipeAnimation(state, wipeIn));
  3117. }
  3118. }
  3119. }
  3120. return animations;
  3121. };
  3122. /**
  3123. * Creates an object to show the given edge cell state.
  3124. */
  3125. Graph.prototype.createEdgeWipeAnimation = function(state, wipeIn)
  3126. {
  3127. var pts = state.absolutePoints.slice();
  3128. var segs = state.segments;
  3129. var total = state.length;
  3130. var n = pts.length;
  3131. return {
  3132. execute: mxUtils.bind(this, function(step, steps)
  3133. {
  3134. if (state.shape != null)
  3135. {
  3136. var pts2 = [pts[0]];
  3137. var f = step / steps;
  3138. if (!wipeIn)
  3139. {
  3140. f = 1 - f;
  3141. }
  3142. var dist = total * f;
  3143. for (var i = 1; i < n; i++)
  3144. {
  3145. if (dist <= segs[i - 1])
  3146. {
  3147. pts2.push(new mxPoint(pts[i - 1].x + (pts[i].x - pts[i - 1].x) * dist / segs[i - 1],
  3148. pts[i - 1].y + (pts[i].y - pts[i - 1].y) * dist / segs[i - 1]));
  3149. break;
  3150. }
  3151. else
  3152. {
  3153. dist -= segs[i - 1];
  3154. pts2.push(pts[i]);
  3155. }
  3156. }
  3157. state.shape.points = pts2;
  3158. state.shape.redraw();
  3159. if (step == 0)
  3160. {
  3161. Graph.setOpacityForNodes(this.getNodesForCells([state.cell]), 1);
  3162. }
  3163. if (state.text != null && state.text.node != null)
  3164. {
  3165. state.text.node.style.opacity = f;
  3166. }
  3167. }
  3168. }),
  3169. stop: mxUtils.bind(this, function()
  3170. {
  3171. if (state.shape != null)
  3172. {
  3173. state.shape.points = pts;
  3174. state.shape.redraw();
  3175. if (state.text != null && state.text.node != null)
  3176. {
  3177. state.text.node.style.opacity = ''
  3178. }
  3179. Graph.setOpacityForNodes(this.getNodesForCells([state.cell]), (wipeIn) ? 1 : 0);
  3180. }
  3181. })
  3182. };
  3183. };
  3184. /**
  3185. * Creates an object to show the given vertex cell state.
  3186. */
  3187. Graph.prototype.createVertexWipeAnimation = function(state, wipeIn)
  3188. {
  3189. var bds = new mxRectangle.fromRectangle(state.shape.bounds);
  3190. return {
  3191. execute: mxUtils.bind(this, function(step, steps)
  3192. {
  3193. if (state.shape != null)
  3194. {
  3195. var f = step / steps;
  3196. if (!wipeIn)
  3197. {
  3198. f = 1 - f;
  3199. }
  3200. state.shape.bounds = new mxRectangle(bds.x, bds.y, bds.width * f, bds.height);
  3201. state.shape.redraw();
  3202. if (step == 0)
  3203. {
  3204. Graph.setOpacityForNodes(this.getNodesForCells([state.cell]), 1);
  3205. }
  3206. if (state.text != null && state.text.node != null)
  3207. {
  3208. state.text.node.style.opacity = f;
  3209. }
  3210. }
  3211. }),
  3212. stop: mxUtils.bind(this, function()
  3213. {
  3214. if (state.shape != null)
  3215. {
  3216. state.shape.bounds = bds;
  3217. state.shape.redraw();
  3218. if (state.text != null && state.text.node != null)
  3219. {
  3220. state.text.node.style.opacity = ''
  3221. }
  3222. Graph.setOpacityForNodes(this.getNodesForCells([state.cell]), (wipeIn) ? 1 : 0);
  3223. }
  3224. })
  3225. };
  3226. };
  3227. /**
  3228. * Runs the animations for the given cells.
  3229. */
  3230. Graph.prototype.executeAnimations = function(animations, done, steps, delay)
  3231. {
  3232. steps = (steps != null) ? steps : 30;
  3233. delay = (delay != null) ? delay : 30;
  3234. var thread = null;
  3235. var step = 0;
  3236. var animate = mxUtils.bind(this, function()
  3237. {
  3238. if (step == steps || this.stoppingCustomActions)
  3239. {
  3240. window.clearInterval(thread);
  3241. for (var i = 0; i < animations.length; i++)
  3242. {
  3243. animations[i].stop();
  3244. }
  3245. if (done != null)
  3246. {
  3247. done();
  3248. }
  3249. }
  3250. else
  3251. {
  3252. for (var i = 0; i < animations.length; i++)
  3253. {
  3254. animations[i].execute(step, steps);
  3255. }
  3256. }
  3257. step++;
  3258. });
  3259. thread = window.setInterval(animate, delay);
  3260. animate();
  3261. };
  3262. /**
  3263. * Returns the size of the page format scaled with the page size.
  3264. */
  3265. Graph.prototype.getPageSize = function()
  3266. {
  3267. return (this.pageVisible) ? new mxRectangle(0, 0, this.pageFormat.width * this.pageScale,
  3268. this.pageFormat.height * this.pageScale) : this.scrollTileSize;
  3269. };
  3270. /**
  3271. * Returns a rectangle describing the position and count of the
  3272. * background pages, where x and y are the position of the top,
  3273. * left page and width and height are the vertical and horizontal
  3274. * page count.
  3275. */
  3276. Graph.prototype.getPageLayout = function(bounds, tr, s)
  3277. {
  3278. bounds = (bounds != null) ? bounds : this.getGraphBounds();
  3279. tr = (tr != null) ? tr : this.view.translate;
  3280. s = (s != null) ? s : this.view.scale;
  3281. var size = this.getPageSize();
  3282. if (bounds.width == 0 || bounds.height == 0)
  3283. {
  3284. return new mxRectangle(0, 0, 1, 1);
  3285. }
  3286. else
  3287. {
  3288. var x0 = Math.floor(Math.ceil(bounds.x / s - tr.x) / size.width);
  3289. var y0 = Math.floor(Math.ceil(bounds.y / s - tr.y) / size.height);
  3290. var w0 = Math.ceil((Math.floor((bounds.x + bounds.width) /
  3291. s) - tr.x) / size.width) - x0;
  3292. var h0 = Math.ceil((Math.floor((bounds.y + bounds.height) /
  3293. s) - tr.y) / size.height) - y0;
  3294. return new mxRectangle(x0, y0, w0, h0);
  3295. }
  3296. };
  3297. /**
  3298. * Returns the default view translation for the given page layout.
  3299. */
  3300. Graph.prototype.getDefaultTranslate = function(pageLayout)
  3301. {
  3302. var pad = this.getPagePadding();
  3303. var size = this.getPageSize();
  3304. return new mxPoint(pad.x - pageLayout.x * size.width,
  3305. pad.y - pageLayout.y * size.height);
  3306. };
  3307. /**
  3308. * Updates the minimum graph size
  3309. */
  3310. Graph.prototype.updateMinimumSize = function()
  3311. {
  3312. var pageLayout = this.getPageLayout();
  3313. var pad = this.getPagePadding();
  3314. var size = this.getPageSize();
  3315. var minw = Math.ceil(2 * pad.x + pageLayout.width * size.width);
  3316. var minh = Math.ceil(2 * pad.y + pageLayout.height * size.height);
  3317. if (this.minimumGraphSize == null ||
  3318. this.minimumGraphSize.width != minw ||
  3319. this.minimumGraphSize.height != minh)
  3320. {
  3321. this.minimumGraphSize = new mxRectangle(0, 0, minw, minh);
  3322. }
  3323. };
  3324. /**
  3325. * Sanitizes the given HTML markup.
  3326. */
  3327. Graph.prototype.sanitizeHtml = function(value, editing)
  3328. {
  3329. return Graph.sanitizeHtml(value, editing);
  3330. };
  3331. /**
  3332. * Revalidates all cells with placeholders in the current graph model.
  3333. */
  3334. Graph.prototype.updatePlaceholders = function()
  3335. {
  3336. var model = this.model;
  3337. var validate = false;
  3338. for (var key in this.model.cells)
  3339. {
  3340. var cell = this.model.cells[key];
  3341. if (this.isReplacePlaceholders(cell))
  3342. {
  3343. this.view.invalidate(cell, false, false);
  3344. validate = true;
  3345. }
  3346. }
  3347. if (validate)
  3348. {
  3349. this.view.validate();
  3350. }
  3351. };
  3352. /**
  3353. * Adds support for placeholders in labels.
  3354. */
  3355. Graph.prototype.isReplacePlaceholders = function(cell)
  3356. {
  3357. return cell.value != null && typeof(cell.value) == 'object' &&
  3358. cell.value.getAttribute('placeholders') == '1';
  3359. };
  3360. /**
  3361. * Returns true if the given mouse wheel event should be used for zooming. This
  3362. * is invoked if no dialogs are showing and returns true with Alt or Control
  3363. * (or cmd in macOS only) is pressed.
  3364. */
  3365. Graph.prototype.isZoomWheelEvent = function(evt)
  3366. {
  3367. return (Graph.zoomWheel && !mxEvent.isShiftDown(evt) && !mxEvent.isMetaDown(evt) &&
  3368. !mxEvent.isAltDown(evt) && (!mxEvent.isControlDown(evt) || mxClient.IS_MAC)) ||
  3369. (!Graph.zoomWheel && (mxEvent.isAltDown(evt) || mxEvent.isControlDown(evt)));
  3370. };
  3371. /**
  3372. * Returns true if the given scroll wheel event should be used for scrolling.
  3373. */
  3374. Graph.prototype.isScrollWheelEvent = function(evt)
  3375. {
  3376. return !this.isZoomWheelEvent(evt);
  3377. };
  3378. /**
  3379. * Adds Alt+click to select cells behind cells (Shift+Click on Chrome OS).
  3380. */
  3381. Graph.prototype.isTransparentClickEvent = function(evt)
  3382. {
  3383. return mxEvent.isAltDown(evt) || (mxClient.IS_CHROMEOS && mxEvent.isShiftDown(evt));
  3384. };
  3385. /**
  3386. * Adds ctrl+shift+connect to disable connections.
  3387. */
  3388. Graph.prototype.isIgnoreTerminalEvent = function(evt)
  3389. {
  3390. return mxEvent.isAltDown(evt) && !mxEvent.isShiftDown(evt) &&
  3391. !mxEvent.isControlDown(evt) && !mxEvent.isMetaDown(evt);
  3392. };
  3393. /**
  3394. * Returns true if the given edge should be ignored.
  3395. */
  3396. Graph.prototype.isEdgeIgnored = function(cell)
  3397. {
  3398. var result = false;
  3399. if (cell != null)
  3400. {
  3401. var style = this.getCurrentCellStyle(cell);
  3402. result = mxUtils.getValue(style, 'ignoreEdge', '0') == '1';
  3403. }
  3404. return result;
  3405. };
  3406. /**
  3407. * Adds support for placeholders in labels.
  3408. */
  3409. Graph.prototype.isSplitTarget = function(target, cells, evt)
  3410. {
  3411. return !this.model.isEdge(cells[0]) &&
  3412. !mxEvent.isAltDown(evt) && !mxEvent.isShiftDown(evt) &&
  3413. mxGraph.prototype.isSplitTarget.apply(this, arguments);
  3414. };
  3415. /**
  3416. * Adds support for placeholders in labels.
  3417. */
  3418. Graph.prototype.getLabel = function(cell)
  3419. {
  3420. var result = mxGraph.prototype.getLabel.apply(this, arguments);
  3421. if (result != null && this.isReplacePlaceholders(cell) && cell.getAttribute('placeholder') == null)
  3422. {
  3423. result = this.replacePlaceholders(cell, result);
  3424. }
  3425. return result;
  3426. };
  3427. /**
  3428. * Adds labelMovable style.
  3429. */
  3430. Graph.prototype.isLabelMovable = function(cell)
  3431. {
  3432. var style = this.getCurrentCellStyle(cell);
  3433. return !this.isCellLocked(cell) &&
  3434. ((this.model.isEdge(cell) && this.edgeLabelsMovable) ||
  3435. (this.model.isVertex(cell) && (this.vertexLabelsMovable ||
  3436. mxUtils.getValue(style, 'labelMovable', '0') == '1')));
  3437. };
  3438. /**
  3439. * Adds event if grid size is changed.
  3440. */
  3441. Graph.prototype.setGridSize = function(value)
  3442. {
  3443. this.gridSize = value;
  3444. this.fireEvent(new mxEventObject('gridSizeChanged'));
  3445. };
  3446. /**
  3447. * Adds event if default parent is changed.
  3448. */
  3449. Graph.prototype.setDefaultParent = function(cell)
  3450. {
  3451. this.defaultParent = cell;
  3452. this.fireEvent(new mxEventObject('defaultParentChanged'));
  3453. };
  3454. /**
  3455. * Function: getClickableLinkForCell
  3456. *
  3457. * Returns the first non-null link for the cell or its ancestors.
  3458. *
  3459. * Parameters:
  3460. *
  3461. * cell - <mxCell> whose link should be returned.
  3462. */
  3463. Graph.prototype.getClickableLinkForCell = function(cell)
  3464. {
  3465. do
  3466. {
  3467. var link = this.getLinkForCell(cell);
  3468. if (link != null)
  3469. {
  3470. return link;
  3471. }
  3472. cell = this.model.getParent(cell);
  3473. } while (cell != null);
  3474. return null;
  3475. };
  3476. /**
  3477. * Private helper method.
  3478. */
  3479. Graph.prototype.getGlobalVariable = function(name)
  3480. {
  3481. var val = null;
  3482. if (name == 'date')
  3483. {
  3484. val = new Date().toLocaleDateString();
  3485. }
  3486. else if (name == 'time')
  3487. {
  3488. val = new Date().toLocaleTimeString();
  3489. }
  3490. else if (name == 'timestamp')
  3491. {
  3492. val = new Date().toLocaleString();
  3493. }
  3494. else if (name.substring(0, 5) == 'date{')
  3495. {
  3496. var fmt = name.substring(5, name.length - 1);
  3497. val = this.formatDate(new Date(), fmt);
  3498. }
  3499. return val;
  3500. };
  3501. /**
  3502. * Formats a date, see http://blog.stevenlevithan.com/archives/date-time-format
  3503. */
  3504. Graph.prototype.formatDate = function(date, mask, utc)
  3505. {
  3506. // LATER: Cache regexs
  3507. if (this.dateFormatCache == null)
  3508. {
  3509. this.dateFormatCache = {
  3510. i18n: {
  3511. dayNames: [
  3512. "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat",
  3513. "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"
  3514. ],
  3515. monthNames: [
  3516. "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec",
  3517. "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"
  3518. ]
  3519. },
  3520. masks: {
  3521. "default": "ddd mmm dd yyyy HH:MM:ss",
  3522. shortDate: "m/d/yy",
  3523. mediumDate: "mmm d, yyyy",
  3524. longDate: "mmmm d, yyyy",
  3525. fullDate: "dddd, mmmm d, yyyy",
  3526. shortTime: "h:MM TT",
  3527. mediumTime: "h:MM:ss TT",
  3528. longTime: "h:MM:ss TT Z",
  3529. isoDate: "yyyy-mm-dd",
  3530. isoTime: "HH:MM:ss",
  3531. isoDateTime: "yyyy-mm-dd'T'HH:MM:ss",
  3532. isoUtcDateTime: "UTC:yyyy-mm-dd'T'HH:MM:ss'Z'"
  3533. }
  3534. };
  3535. }
  3536. var dF = this.dateFormatCache;
  3537. var token = /d{1,4}|m{1,4}|yy(?:yy)?|([HhMsTt])\1?|[LloSZ]|"[^"]*"|'[^']*'/g,
  3538. timezone = /\b(?:[PMCEA][SDP]T|(?:Pacific|Mountain|Central|Eastern|Atlantic) (?:Standard|Daylight|Prevailing) Time|(?:GMT|UTC)(?:[-+]\d{4})?)\b/g,
  3539. timezoneClip = /[^-+\dA-Z]/g,
  3540. pad = function (val, len) {
  3541. val = String(val);
  3542. len = len || 2;
  3543. while (val.length < len) val = "0" + val;
  3544. return val;
  3545. };
  3546. // You can't provide utc if you skip other args (use the "UTC:" mask prefix)
  3547. if (arguments.length == 1 && Object.prototype.toString.call(date) == "[object String]" && !/\d/.test(date)) {
  3548. mask = date;
  3549. date = undefined;
  3550. }
  3551. // Passing date through Date applies Date.parse, if necessary
  3552. date = date ? new Date(date) : new Date;
  3553. if (isNaN(date)) throw SyntaxError("invalid date");
  3554. mask = String(dF.masks[mask] || mask || dF.masks["default"]);
  3555. // Allow setting the utc argument via the mask
  3556. if (mask.slice(0, 4) == "UTC:") {
  3557. mask = mask.slice(4);
  3558. utc = true;
  3559. }
  3560. var _ = utc ? "getUTC" : "get",
  3561. d = date[_ + "Date"](),
  3562. D = date[_ + "Day"](),
  3563. m = date[_ + "Month"](),
  3564. y = date[_ + "FullYear"](),
  3565. H = date[_ + "Hours"](),
  3566. M = date[_ + "Minutes"](),
  3567. s = date[_ + "Seconds"](),
  3568. L = date[_ + "Milliseconds"](),
  3569. o = utc ? 0 : date.getTimezoneOffset(),
  3570. flags = {
  3571. d: d,
  3572. dd: pad(d),
  3573. ddd: dF.i18n.dayNames[D],
  3574. dddd: dF.i18n.dayNames[D + 7],
  3575. m: m + 1,
  3576. mm: pad(m + 1),
  3577. mmm: dF.i18n.monthNames[m],
  3578. mmmm: dF.i18n.monthNames[m + 12],
  3579. yy: String(y).slice(2),
  3580. yyyy: y,
  3581. h: H % 12 || 12,
  3582. hh: pad(H % 12 || 12),
  3583. H: H,
  3584. HH: pad(H),
  3585. M: M,
  3586. MM: pad(M),
  3587. s: s,
  3588. ss: pad(s),
  3589. l: pad(L, 3),
  3590. L: pad(L > 99 ? Math.round(L / 10) : L),
  3591. t: H < 12 ? "a" : "p",
  3592. tt: H < 12 ? "am" : "pm",
  3593. T: H < 12 ? "A" : "P",
  3594. TT: H < 12 ? "AM" : "PM",
  3595. Z: utc ? "UTC" : (String(date).match(timezone) || [""]).pop().replace(timezoneClip, ""),
  3596. o: (o > 0 ? "-" : "+") + pad(Math.floor(Math.abs(o) / 60) * 100 + Math.abs(o) % 60, 4),
  3597. S: ["th", "st", "nd", "rd"][d % 10 > 3 ? 0 : (d % 100 - d % 10 != 10) * d % 10]
  3598. };
  3599. return mask.replace(token, function ($0)
  3600. {
  3601. return $0 in flags ? flags[$0] : $0.slice(1, $0.length - 1);
  3602. });
  3603. };
  3604. /**
  3605. *
  3606. */
  3607. Graph.prototype.getLayerForCell = function(cell)
  3608. {
  3609. while (cell != null && !this.model.isLayer(cell))
  3610. {
  3611. cell = this.model.getParent(cell);
  3612. }
  3613. return cell;
  3614. };
  3615. /**
  3616. *
  3617. */
  3618. Graph.prototype.getLayerForCells = function(cells)
  3619. {
  3620. var result = null;
  3621. if (cells.length > 0)
  3622. {
  3623. result = this.getLayerForCell(cells[0]);
  3624. for (var i = 1; i < cells.length; i++)
  3625. {
  3626. if (!this.model.isAncestor(result, cells[i]))
  3627. {
  3628. result = null;
  3629. break;
  3630. }
  3631. }
  3632. }
  3633. return result;
  3634. };
  3635. /**
  3636. *
  3637. */
  3638. Graph.prototype.createLayersDialog = function(onchange, inverted)
  3639. {
  3640. var div = document.createElement('div');
  3641. div.style.position = 'absolute';
  3642. var model = this.getModel();
  3643. var childCount = model.getChildCount(model.root);
  3644. for (var i = 0; i < childCount; i++)
  3645. {
  3646. (mxUtils.bind(this, function(layer)
  3647. {
  3648. var title = this.convertValueToString(layer) ||
  3649. (mxResources.get('background') || 'Background');
  3650. var span = document.createElement('div');
  3651. span.style.overflow = 'hidden';
  3652. span.style.textOverflow = 'ellipsis';
  3653. span.style.padding = '2px';
  3654. span.style.whiteSpace = 'nowrap';
  3655. span.style.cursor = 'pointer';
  3656. span.setAttribute('title', mxResources.get(
  3657. model.isVisible(layer) ?
  3658. 'hideIt' : 'show', [title]));
  3659. var inp = document.createElement('img');
  3660. inp.setAttribute('draggable', 'false');
  3661. inp.setAttribute('align', 'absmiddle');
  3662. inp.setAttribute('border', '0');
  3663. inp.style.position = 'relative';
  3664. inp.style.width = '16px';
  3665. inp.style.padding = '0px 6px 0 4px';
  3666. if (inverted)
  3667. {
  3668. inp.style.filter = 'invert(100%)';
  3669. inp.style.top = '-2px';
  3670. }
  3671. span.appendChild(inp);
  3672. mxUtils.write(span, title);
  3673. div.appendChild(span);
  3674. function update()
  3675. {
  3676. if (model.isVisible(layer))
  3677. {
  3678. inp.setAttribute('src', Editor.visibleImage);
  3679. mxUtils.setOpacity(span, 75);
  3680. }
  3681. else
  3682. {
  3683. inp.setAttribute('src', Editor.hiddenImage);
  3684. mxUtils.setOpacity(span, 25);
  3685. }
  3686. };
  3687. mxEvent.addListener(span, 'click', function()
  3688. {
  3689. model.setVisible(layer, !model.isVisible(layer));
  3690. update();
  3691. if (onchange != null)
  3692. {
  3693. onchange(layer);
  3694. }
  3695. });
  3696. update();
  3697. })(model.getChildAt(model.root, i)));
  3698. }
  3699. return div;
  3700. };
  3701. /**
  3702. * Private helper method.
  3703. */
  3704. Graph.prototype.replacePlaceholders = function(cell, str, vars, translate)
  3705. {
  3706. var result = [];
  3707. if (str != null)
  3708. {
  3709. var last = 0;
  3710. while (match = this.placeholderPattern.exec(str))
  3711. {
  3712. var val = match[0];
  3713. if (val.length > 2 && val != '%label%' && val != '%tooltip%')
  3714. {
  3715. var tmp = null;
  3716. if (match.index > last && str.charAt(match.index - 1) == '%')
  3717. {
  3718. tmp = val.substring(1);
  3719. }
  3720. else
  3721. {
  3722. var name = val.substring(1, val.length - 1);
  3723. // Workaround for invalid char for getting attribute in older versions of IE
  3724. if (name == 'id')
  3725. {
  3726. tmp = cell.id;
  3727. }
  3728. else if (name.indexOf('{') < 0)
  3729. {
  3730. var current = cell;
  3731. while (tmp == null && current != null)
  3732. {
  3733. if (current.value != null && typeof(current.value) == 'object')
  3734. {
  3735. if (Graph.translateDiagram && Graph.diagramLanguage != null)
  3736. {
  3737. tmp = current.getAttribute(name + '_' + Graph.diagramLanguage);
  3738. }
  3739. if (tmp == null)
  3740. {
  3741. tmp = (current.hasAttribute(name)) ? ((current.getAttribute(name) != null) ?
  3742. current.getAttribute(name) : '') : null;
  3743. }
  3744. }
  3745. current = this.model.getParent(current);
  3746. }
  3747. }
  3748. if (tmp == null)
  3749. {
  3750. tmp = this.getGlobalVariable(name);
  3751. }
  3752. if (tmp == null && vars != null)
  3753. {
  3754. tmp = vars[name];
  3755. }
  3756. }
  3757. result.push(str.substring(last, match.index) + ((tmp != null) ? tmp : val));
  3758. last = match.index + val.length;
  3759. }
  3760. }
  3761. result.push(str.substring(last));
  3762. }
  3763. return result.join('');
  3764. };
  3765. /**
  3766. * Resolves the given cells in the model and selects them.
  3767. */
  3768. Graph.prototype.restoreSelection = function(cells)
  3769. {
  3770. if (cells != null && cells.length > 0)
  3771. {
  3772. var temp = [];
  3773. for (var i = 0; i < cells.length; i++)
  3774. {
  3775. var newCell = this.model.getCell(cells[i].id);
  3776. if (newCell != null)
  3777. {
  3778. temp.push(newCell);
  3779. }
  3780. }
  3781. this.setSelectionCells(temp);
  3782. }
  3783. else
  3784. {
  3785. this.clearSelection();
  3786. }
  3787. };
  3788. /**
  3789. * Adds table range selection with Shift+Click.
  3790. */
  3791. Graph.prototype.selectCellForEvent = function(cell, evt)
  3792. {
  3793. if (!mxEvent.isShiftDown(evt) || this.isSelectionEmpty() ||
  3794. !this.selectTableRange(this.getSelectionCell(), cell))
  3795. {
  3796. mxGraph.prototype.selectCellForEvent.apply(this, arguments);
  3797. }
  3798. };
  3799. /**
  3800. * Returns true if
  3801. */
  3802. Graph.prototype.selectTableRange = function(startCell, endCell)
  3803. {
  3804. var result = false;
  3805. if (this.isTableCell(startCell) && this.isTableCell(endCell))
  3806. {
  3807. var startRow = this.model.getParent(startCell);
  3808. var table = this.model.getParent(startRow);
  3809. var endRow = this.model.getParent(endCell);
  3810. if (table == this.model.getParent(endRow))
  3811. {
  3812. var startCellIndex = startRow.getIndex(startCell);
  3813. var startRowIndex = table.getIndex(startRow);
  3814. var endCellIndex = endRow.getIndex(endCell);
  3815. var endRowIndex = table.getIndex(endRow);
  3816. var fromRow = Math.min(startRowIndex, endRowIndex);
  3817. var toRow = Math.max(startRowIndex, endRowIndex);
  3818. var fromCell = Math.min(startCellIndex, endCellIndex);
  3819. var toCell = Math.max(startCellIndex, endCellIndex);
  3820. var cells = [];
  3821. for (var row = fromRow; row <= toRow; row++)
  3822. {
  3823. var currentRow = this.model.getChildAt(table, row);
  3824. for (var col = fromCell; col <= toCell; col++)
  3825. {
  3826. cells.push(this.model.getChildAt(currentRow, col));
  3827. }
  3828. }
  3829. if (cells.length > 0 && (cells.length > 1 ||
  3830. this.getSelectionCount() > 1 ||
  3831. !this.isCellSelected(cells[0])))
  3832. {
  3833. this.setSelectionCells(cells);
  3834. result = true;
  3835. }
  3836. }
  3837. }
  3838. return result;
  3839. };
  3840. /**
  3841. * Returns the cells for the given table range.
  3842. */
  3843. Graph.prototype.snapCellsToGrid = function(cells, gridSize)
  3844. {
  3845. this.getModel().beginUpdate();
  3846. try
  3847. {
  3848. for (var i = 0; i < cells.length; i++)
  3849. {
  3850. var cell = cells[i];
  3851. var geo = this.getCellGeometry(cell);
  3852. if (geo != null)
  3853. {
  3854. geo = geo.clone();
  3855. if (this.getModel().isVertex(cell))
  3856. {
  3857. geo.x = Math.round(geo.x / gridSize) * gridSize;
  3858. geo.y = Math.round(geo.y / gridSize) * gridSize;
  3859. geo.width = Math.round(geo.width / gridSize) * gridSize;
  3860. geo.height = Math.round(geo.height / gridSize) * gridSize;
  3861. }
  3862. else if (this.getModel().isEdge(cell) && geo.points != null)
  3863. {
  3864. for (var j = 0; j < geo.points.length; j++)
  3865. {
  3866. geo.points[j].x = Math.round(geo.points[j].x / gridSize) * gridSize;
  3867. geo.points[j].y = Math.round(geo.points[j].y / gridSize) * gridSize;
  3868. }
  3869. }
  3870. this.getModel().setGeometry(cell, geo);
  3871. }
  3872. }
  3873. }
  3874. finally
  3875. {
  3876. this.getModel().endUpdate();
  3877. }
  3878. };
  3879. /**
  3880. * Creates a drop handler for inserting the given cells.
  3881. */
  3882. Graph.prototype.removeChildCells = function(cell)
  3883. {
  3884. this.model.beginUpdate();
  3885. try
  3886. {
  3887. var childCount = this.model.getChildCount(cell);
  3888. for (var j = childCount; j >= 0; j--)
  3889. {
  3890. this.model.remove(this.model.getChildAt(cell, j));
  3891. }
  3892. }
  3893. finally
  3894. {
  3895. this.model.endUpdate();
  3896. }
  3897. };
  3898. /**
  3899. * Creates a drop handler for inserting the given cells.
  3900. */
  3901. Graph.prototype.updateShapes = function(source, targets)
  3902. {
  3903. this.model.beginUpdate();
  3904. try
  3905. {
  3906. // Replaces target styles and removes composite childs
  3907. for (var i = 0; i < targets.length; i++)
  3908. {
  3909. if ((this.model.isVertex(source) && this.model.isVertex(targets[i])) ||
  3910. this.model.isEdge(source) && this.model.isEdge(targets[i]))
  3911. {
  3912. var style = this.copyStyle(targets[i]);
  3913. this.model.setStyle(targets[i], this.model.getStyle(source));
  3914. this.pasteStyle(style, [targets[i]]);
  3915. }
  3916. if (mxUtils.getValue(this.getCellStyle(targets[i],
  3917. false), 'composite', '0') == '1')
  3918. {
  3919. this.removeChildCells(targets[i]);
  3920. }
  3921. }
  3922. }
  3923. finally
  3924. {
  3925. this.model.endUpdate();
  3926. }
  3927. };
  3928. /**
  3929. * Selects cells for connect vertex return value.
  3930. */
  3931. Graph.prototype.selectCellsForConnectVertex = function(cells, evt, hoverIcons)
  3932. {
  3933. // Selects only target vertex if one exists
  3934. if (cells.length == 2 && this.model.isVertex(cells[1]))
  3935. {
  3936. this.setSelectionCell(cells[1]);
  3937. this.scrollCellToVisible(cells[1]);
  3938. if (hoverIcons != null)
  3939. {
  3940. // Adds hover icons for cloned vertex or hides icons
  3941. if (mxEvent.isTouchEvent(evt))
  3942. {
  3943. hoverIcons.update(hoverIcons.getState(this.view.getState(cells[1])));
  3944. }
  3945. else
  3946. {
  3947. hoverIcons.reset();
  3948. }
  3949. }
  3950. }
  3951. else
  3952. {
  3953. this.setSelectionCells(cells);
  3954. }
  3955. };
  3956. /**
  3957. * Never connects children in stack layouts or tables.
  3958. */
  3959. Graph.prototype.isCloneConnectSource = function(source)
  3960. {
  3961. var layout = null;
  3962. if (this.layoutManager != null)
  3963. {
  3964. layout = this.layoutManager.getLayout(this.model.getParent(source));
  3965. }
  3966. return this.isTableRow(source) || this.isTableCell(source) ||
  3967. (layout != null && layout.constructor == mxStackLayout);
  3968. };
  3969. /**
  3970. * Inserts the given edge before the given cell.
  3971. */
  3972. Graph.prototype.insertEdgeBeforeCell = function(edge, cell)
  3973. {
  3974. var index = null;
  3975. var tmp = cell;
  3976. while (tmp.parent != null && tmp.geometry != null &&
  3977. tmp.geometry.relative && tmp.parent != edge.parent)
  3978. {
  3979. tmp = this.model.getParent(tmp);
  3980. }
  3981. if (tmp != null && tmp.parent != null && tmp.parent == edge.parent)
  3982. {
  3983. var index = tmp.parent.getIndex(tmp);
  3984. this.model.add(tmp.parent, edge, index);
  3985. }
  3986. };
  3987. /**
  3988. * Adds a connection to the given vertex or clones the vertex in special layout
  3989. * containers without creating a connection.
  3990. */
  3991. Graph.prototype.connectVertex = function(source, direction, length, evt, forceClone, ignoreCellAt, createTarget, done)
  3992. {
  3993. ignoreCellAt = (ignoreCellAt) ? ignoreCellAt : false;
  3994. // Ignores relative edge labels
  3995. if (source.geometry.relative && this.model.isEdge(source.parent))
  3996. {
  3997. return [];
  3998. }
  3999. // Uses parent for relative child cells
  4000. while (source.geometry.relative && this.model.isVertex(source.parent))
  4001. {
  4002. source = source.parent;
  4003. }
  4004. // Handles clone connect sources
  4005. var cloneSource = this.isCloneConnectSource(source);
  4006. var composite = (cloneSource) ? source : this.getCompositeParent(source);
  4007. var pt = (source.geometry.relative && source.parent.geometry != null) ?
  4008. new mxPoint(source.parent.geometry.width * source.geometry.x,
  4009. source.parent.geometry.height * source.geometry.y) :
  4010. new mxPoint(composite.geometry.x, composite.geometry.y);
  4011. if (direction == mxConstants.DIRECTION_NORTH)
  4012. {
  4013. pt.x += composite.geometry.width / 2;
  4014. pt.y -= length ;
  4015. }
  4016. else if (direction == mxConstants.DIRECTION_SOUTH)
  4017. {
  4018. pt.x += composite.geometry.width / 2;
  4019. pt.y += composite.geometry.height + length;
  4020. }
  4021. else if (direction == mxConstants.DIRECTION_WEST)
  4022. {
  4023. pt.x -= length;
  4024. pt.y += composite.geometry.height / 2;
  4025. }
  4026. else
  4027. {
  4028. pt.x += composite.geometry.width + length;
  4029. pt.y += composite.geometry.height / 2;
  4030. }
  4031. var parentState = this.view.getState(this.model.getParent(source));
  4032. var s = this.view.scale;
  4033. var t = this.view.translate;
  4034. var dx = t.x * s;
  4035. var dy = t.y * s;
  4036. if (parentState != null && this.model.isVertex(parentState.cell))
  4037. {
  4038. dx = parentState.x;
  4039. dy = parentState.y;
  4040. }
  4041. // Workaround for relative child cells
  4042. if (this.model.isVertex(source.parent) && source.geometry.relative)
  4043. {
  4044. pt.x += source.parent.geometry.x;
  4045. pt.y += source.parent.geometry.y;
  4046. }
  4047. // Checks end point for target cell and container
  4048. var rect = (!ignoreCellAt) ? new mxRectangle(dx + pt.x * s, dy + pt.y * s).grow(40 * s) : null;
  4049. var tempCells = (rect != null) ? this.getCells(0, 0, 0, 0, null, null, rect, null, true) : null;
  4050. var sourceState = this.view.getState(source);
  4051. var container = null;
  4052. var target = null;
  4053. if (tempCells != null)
  4054. {
  4055. tempCells = tempCells.reverse();
  4056. for (var i = 0; i < tempCells.length; i++)
  4057. {
  4058. if (!this.isCellLocked(tempCells[i]) && !this.model.isEdge(tempCells[i]) && tempCells[i] != source)
  4059. {
  4060. // Direct parent overrides all possible containers
  4061. if (!this.model.isAncestor(source, tempCells[i]) && this.isContainer(tempCells[i]) &&
  4062. (container == null || tempCells[i] == this.model.getParent(source)))
  4063. {
  4064. container = tempCells[i];
  4065. }
  4066. // Containers are used as target cells but swimlanes are used as parents
  4067. else if (target == null && this.isCellConnectable(tempCells[i]) &&
  4068. !this.model.isAncestor(tempCells[i], source) &&
  4069. !this.isSwimlane(tempCells[i]))
  4070. {
  4071. var targetState = this.view.getState(tempCells[i]);
  4072. if (sourceState != null && targetState != null && !mxUtils.intersects(sourceState, targetState))
  4073. {
  4074. target = tempCells[i];
  4075. }
  4076. }
  4077. }
  4078. }
  4079. }
  4080. var duplicate = (!mxEvent.isShiftDown(evt) || mxEvent.isControlDown(evt)) || forceClone;
  4081. if (duplicate && (urlParams['sketch'] != '1' || forceClone))
  4082. {
  4083. if (direction == mxConstants.DIRECTION_NORTH)
  4084. {
  4085. pt.y -= source.geometry.height / 2;
  4086. }
  4087. else if (direction == mxConstants.DIRECTION_SOUTH)
  4088. {
  4089. pt.y += source.geometry.height / 2;
  4090. }
  4091. else if (direction == mxConstants.DIRECTION_WEST)
  4092. {
  4093. pt.x -= source.geometry.width / 2;
  4094. }
  4095. else
  4096. {
  4097. pt.x += source.geometry.width / 2;
  4098. }
  4099. }
  4100. var result = [];
  4101. var realTarget = target;
  4102. target = container;
  4103. var execute = mxUtils.bind(this, function(targetCell)
  4104. {
  4105. if (createTarget == null || targetCell != null || (target == null && cloneSource))
  4106. {
  4107. this.model.beginUpdate();
  4108. try
  4109. {
  4110. if (realTarget == null && duplicate)
  4111. {
  4112. // Handles relative and composite cells
  4113. var cellToClone = this.getAbsoluteParent((targetCell != null) ? targetCell : source);
  4114. cellToClone = (cloneSource) ? source : this.getCompositeParent(cellToClone);
  4115. realTarget = (targetCell != null) ? targetCell : this.duplicateCells([cellToClone], false)[0];
  4116. if (targetCell != null)
  4117. {
  4118. this.addCells([realTarget], this.model.getParent(source), null, null, null, true);
  4119. }
  4120. var geo = this.getCellGeometry(realTarget);
  4121. if (geo != null)
  4122. {
  4123. if (targetCell != null && urlParams['sketch'] == '1')
  4124. {
  4125. if (direction == mxConstants.DIRECTION_NORTH)
  4126. {
  4127. pt.y -= geo.height / 2;
  4128. }
  4129. else if (direction == mxConstants.DIRECTION_SOUTH)
  4130. {
  4131. pt.y += geo.height / 2;
  4132. }
  4133. else if (direction == mxConstants.DIRECTION_WEST)
  4134. {
  4135. pt.x -= geo.width / 2;
  4136. }
  4137. else
  4138. {
  4139. pt.x += geo.width / 2;
  4140. }
  4141. }
  4142. geo.x = pt.x - geo.width / 2;
  4143. geo.y = pt.y - geo.height / 2;
  4144. }
  4145. if (container != null)
  4146. {
  4147. this.addCells([realTarget], container, null, null, null, true);
  4148. target = null;
  4149. }
  4150. else if (duplicate && !cloneSource)
  4151. {
  4152. this.addCells([realTarget], this.getDefaultParent(), null, null, null, true);
  4153. }
  4154. }
  4155. var edge = ((mxEvent.isControlDown(evt) && mxEvent.isShiftDown(evt) && duplicate) ||
  4156. (target == null && cloneSource)) ? null : this.insertEdge(this.model.getParent(source),
  4157. null, '', source, realTarget, this.createCurrentEdgeStyle());
  4158. if (edge != null)
  4159. {
  4160. result.push(edge);
  4161. this.applyNewEdgeStyle(source, [edge], direction);
  4162. if (this.connectionHandler.insertBeforeSource)
  4163. {
  4164. this.insertEdgeBeforeCell(edge, source);
  4165. }
  4166. }
  4167. // Special case: Click on west icon puts clone before cell
  4168. if (target == null && realTarget != null && source.parent != null &&
  4169. cloneSource && direction == mxConstants.DIRECTION_WEST)
  4170. {
  4171. var index = source.parent.getIndex(source);
  4172. this.model.add(source.parent, realTarget, index);
  4173. }
  4174. if (target == null && realTarget != null)
  4175. {
  4176. result.push(realTarget);
  4177. }
  4178. if (realTarget == null && edge != null)
  4179. {
  4180. edge.geometry.setTerminalPoint(pt, false);
  4181. }
  4182. if (edge != null)
  4183. {
  4184. this.fireEvent(new mxEventObject('cellsInserted', 'cells', [edge]));
  4185. }
  4186. }
  4187. finally
  4188. {
  4189. this.model.endUpdate();
  4190. }
  4191. }
  4192. if (done != null)
  4193. {
  4194. done(result);
  4195. }
  4196. else
  4197. {
  4198. return result;
  4199. }
  4200. });
  4201. if (createTarget != null && realTarget == null && duplicate &&
  4202. (target != null || !cloneSource))
  4203. {
  4204. createTarget(dx + pt.x * s, dy + pt.y * s, execute);
  4205. }
  4206. else
  4207. {
  4208. return execute(realTarget);
  4209. }
  4210. };
  4211. /**
  4212. * Returns all labels in the diagram as a string.
  4213. */
  4214. Graph.prototype.getIndexableText = function(cells)
  4215. {
  4216. cells = (cells != null) ? cells : this.model.
  4217. getDescendants(this.model.root);
  4218. var tmp = document.createElement('div');
  4219. var labels = [];
  4220. var label = '';
  4221. for (var i = 0; i < cells.length; i++)
  4222. {
  4223. var cell = cells[i];
  4224. if (this.model.isVertex(cell) || this.model.isEdge(cell))
  4225. {
  4226. if (this.isHtmlLabel(cell))
  4227. {
  4228. tmp.innerHTML = Graph.sanitizeHtml(this.getLabel(cell));
  4229. label = mxUtils.extractTextWithWhitespace([tmp]);
  4230. }
  4231. else
  4232. {
  4233. label = this.getLabel(cell);
  4234. }
  4235. label = mxUtils.trim(label.replace(/[\x00-\x1F\x7F-\x9F]|\s+/g, ' '));
  4236. if (label.length > 0)
  4237. {
  4238. labels.push(label);
  4239. }
  4240. }
  4241. }
  4242. return labels.join(' ');
  4243. };
  4244. /**
  4245. * Returns the label for the given cell.
  4246. */
  4247. Graph.prototype.convertValueToString = function(cell)
  4248. {
  4249. var value = this.model.getValue(cell);
  4250. if (value != null && typeof(value) == 'object')
  4251. {
  4252. var result = null;
  4253. if (this.isReplacePlaceholders(cell) && cell.getAttribute('placeholder') != null)
  4254. {
  4255. var name = cell.getAttribute('placeholder');
  4256. var current = cell;
  4257. while (result == null && current != null)
  4258. {
  4259. if (current.value != null && typeof(current.value) == 'object')
  4260. {
  4261. result = (current.hasAttribute(name)) ? ((current.getAttribute(name) != null) ?
  4262. current.getAttribute(name) : '') : null;
  4263. }
  4264. current = this.model.getParent(current);
  4265. }
  4266. }
  4267. else
  4268. {
  4269. var result = null;
  4270. if (Graph.translateDiagram && Graph.diagramLanguage != null)
  4271. {
  4272. result = value.getAttribute('label_' + Graph.diagramLanguage);
  4273. }
  4274. if (result == null)
  4275. {
  4276. result = value.getAttribute('label') || '';
  4277. }
  4278. }
  4279. return result || '';
  4280. }
  4281. return mxGraph.prototype.convertValueToString.apply(this, arguments);
  4282. };
  4283. /**
  4284. * Returns the link for the given cell.
  4285. */
  4286. Graph.prototype.getLinksForState = function(state)
  4287. {
  4288. if (state != null && state.text != null && state.text.node != null)
  4289. {
  4290. return state.text.node.getElementsByTagName('a');
  4291. }
  4292. return null;
  4293. };
  4294. /**
  4295. * Returns the link for the given cell.
  4296. */
  4297. Graph.prototype.getLinkForCell = function(cell)
  4298. {
  4299. if (cell.value != null && typeof(cell.value) == 'object')
  4300. {
  4301. var link = cell.value.getAttribute('link');
  4302. // Removes links with leading javascript: protocol
  4303. // TODO: Check more possible attack vectors
  4304. if (link != null && link.toLowerCase().substring(0, 11) === 'javascript:')
  4305. {
  4306. link = link.substring(11);
  4307. }
  4308. return link;
  4309. }
  4310. return null;
  4311. };
  4312. /**
  4313. * Returns the link target for the given cell.
  4314. */
  4315. Graph.prototype.getLinkTargetForCell = function(cell)
  4316. {
  4317. if (cell.value != null && typeof(cell.value) == 'object')
  4318. {
  4319. return cell.value.getAttribute('linkTarget');
  4320. }
  4321. return null;
  4322. };
  4323. /**
  4324. * Adds style post processing steps.
  4325. */
  4326. Graph.prototype.postProcessCellStyle = function(cell, style)
  4327. {
  4328. return this.updateHorizontalStyle(cell,this.replaceDefaultColors(cell,
  4329. mxGraph.prototype.postProcessCellStyle.apply(this, arguments)));
  4330. };
  4331. /**
  4332. * Overrides label orientation for collapsed swimlanes inside stack and
  4333. * for partial rectangles inside tables.
  4334. */
  4335. Graph.prototype.updateHorizontalStyle = function(cell, style)
  4336. {
  4337. if (cell != null && style != null && this.layoutManager != null)
  4338. {
  4339. var parent = this.model.getParent(cell);
  4340. if (this.model.isVertex(parent) && this.isCellCollapsed(cell))
  4341. {
  4342. var layout = this.layoutManager.getLayout(parent);
  4343. if (layout != null && layout.constructor == mxStackLayout)
  4344. {
  4345. style[mxConstants.STYLE_HORIZONTAL] = !layout.horizontal;
  4346. }
  4347. }
  4348. }
  4349. return style;
  4350. };
  4351. /**
  4352. * Replaces default colors.
  4353. */
  4354. Graph.prototype.replaceDefaultColors = function(cell, style)
  4355. {
  4356. if (style != null)
  4357. {
  4358. var bg = mxUtils.hex2rgb(this.shapeBackgroundColor);
  4359. var fg = mxUtils.hex2rgb(this.shapeForegroundColor);
  4360. this.replaceDefaultColor(style, mxConstants.STYLE_FONTCOLOR, fg, bg);
  4361. this.replaceDefaultColor(style, mxConstants.STYLE_FILLCOLOR, bg, fg);
  4362. this.replaceDefaultColor(style, mxConstants.STYLE_GRADIENTCOLOR, fg, bg);
  4363. this.replaceDefaultColor(style, mxConstants.STYLE_STROKECOLOR, fg, bg);
  4364. this.replaceDefaultColor(style, mxConstants.STYLE_IMAGE_BORDER, fg, bg);
  4365. this.replaceDefaultColor(style, mxConstants.STYLE_IMAGE_BACKGROUND, bg, fg);
  4366. this.replaceDefaultColor(style, mxConstants.STYLE_LABEL_BORDERCOLOR, fg, bg);
  4367. this.replaceDefaultColor(style, mxConstants.STYLE_SWIMLANE_FILLCOLOR, bg, fg);
  4368. this.replaceDefaultColor(style, mxConstants.STYLE_LABEL_BACKGROUNDCOLOR, bg, fg);
  4369. }
  4370. return style;
  4371. };
  4372. /**
  4373. * Replaces the colors for the given key.
  4374. */
  4375. Graph.prototype.replaceDefaultColor = function(style, key, value, inverseValue)
  4376. {
  4377. if (style != null && style[key] == 'default' && value != null)
  4378. {
  4379. style[key] = this.getDefaultColor(style, key, value, inverseValue);
  4380. }
  4381. };
  4382. /**
  4383. * Replaces the colors for the given key.
  4384. */
  4385. Graph.prototype.getDefaultColor = function(style, key, defaultValue, inverseDefaultValue)
  4386. {
  4387. var temp = 'default' + key.charAt(0).toUpperCase() + key.substring(1);
  4388. if (style[temp] == 'invert')
  4389. {
  4390. defaultValue = inverseDefaultValue;
  4391. }
  4392. return defaultValue;
  4393. };
  4394. /**
  4395. * Disables alternate width persistence for stack layout parents
  4396. */
  4397. Graph.prototype.updateAlternateBounds = function(cell, geo, willCollapse)
  4398. {
  4399. if (cell != null && geo != null && this.layoutManager != null && geo.alternateBounds != null)
  4400. {
  4401. var layout = this.layoutManager.getLayout(this.model.getParent(cell));
  4402. if (layout != null && layout.constructor == mxStackLayout)
  4403. {
  4404. if (layout.horizontal)
  4405. {
  4406. geo.alternateBounds.height = 0;
  4407. }
  4408. else
  4409. {
  4410. geo.alternateBounds.width = 0;
  4411. }
  4412. }
  4413. }
  4414. mxGraph.prototype.updateAlternateBounds.apply(this, arguments);
  4415. };
  4416. /**
  4417. * Adds Shift+collapse/expand and size management for folding inside stack
  4418. */
  4419. Graph.prototype.isMoveCellsEvent = function(evt, state)
  4420. {
  4421. return mxEvent.isShiftDown(evt) || mxUtils.getValue(state.style, 'moveCells', '0') == '1';
  4422. };
  4423. /**
  4424. * Adds Shift+collapse/expand and size management for folding inside stack
  4425. */
  4426. Graph.prototype.foldCells = function(collapse, recurse, cells, checkFoldable, evt)
  4427. {
  4428. recurse = (recurse != null) ? recurse : false;
  4429. if (cells == null)
  4430. {
  4431. cells = this.getFoldableCells(this.getSelectionCells(), collapse);
  4432. }
  4433. if (cells != null)
  4434. {
  4435. this.model.beginUpdate();
  4436. try
  4437. {
  4438. mxGraph.prototype.foldCells.apply(this, arguments);
  4439. // Resizes all parent stacks if alt is not pressed
  4440. if (this.layoutManager != null)
  4441. {
  4442. for (var i = 0; i < cells.length; i++)
  4443. {
  4444. var state = this.view.getState(cells[i]);
  4445. var geo = this.getCellGeometry(cells[i]);
  4446. if (state != null && geo != null)
  4447. {
  4448. var dx = Math.round(geo.width - state.width / this.view.scale);
  4449. var dy = Math.round(geo.height - state.height / this.view.scale);
  4450. if (dy != 0 || dx != 0)
  4451. {
  4452. var parent = this.model.getParent(cells[i]);
  4453. var layout = this.layoutManager.getLayout(parent);
  4454. if (layout == null)
  4455. {
  4456. // Moves cells to the right and down after collapse/expand
  4457. if (evt != null && this.isMoveCellsEvent(evt, state))
  4458. {
  4459. this.moveSiblings(state, parent, dx, dy);
  4460. }
  4461. }
  4462. else if ((evt == null || !mxEvent.isAltDown(evt)) &&
  4463. layout.constructor == mxStackLayout && !layout.resizeLast)
  4464. {
  4465. this.resizeParentStacks(parent, layout, dx, dy);
  4466. }
  4467. }
  4468. }
  4469. }
  4470. }
  4471. }
  4472. finally
  4473. {
  4474. this.model.endUpdate();
  4475. }
  4476. // Selects cells after folding
  4477. if (this.isEnabled())
  4478. {
  4479. this.setSelectionCells(cells);
  4480. }
  4481. }
  4482. };
  4483. /**
  4484. * Overrides label orientation for collapsed swimlanes inside stack.
  4485. */
  4486. Graph.prototype.moveSiblings = function(state, parent, dx, dy)
  4487. {
  4488. this.model.beginUpdate();
  4489. try
  4490. {
  4491. var cells = this.getCellsBeyond(state.x, state.y, parent, true, true);
  4492. for (var i = 0; i < cells.length; i++)
  4493. {
  4494. if (cells[i] != state.cell)
  4495. {
  4496. var tmp = this.view.getState(cells[i]);
  4497. var geo = this.getCellGeometry(cells[i]);
  4498. if (tmp != null && geo != null)
  4499. {
  4500. geo = geo.clone();
  4501. geo.translate(Math.round(dx * Math.max(0, Math.min(1, (tmp.x - state.x) / state.width))),
  4502. Math.round(dy * Math.max(0, Math.min(1, (tmp.y - state.y) / state.height))));
  4503. this.model.setGeometry(cells[i], geo);
  4504. }
  4505. }
  4506. }
  4507. }
  4508. finally
  4509. {
  4510. this.model.endUpdate();
  4511. }
  4512. };
  4513. /**
  4514. * Overrides label orientation for collapsed swimlanes inside stack.
  4515. */
  4516. Graph.prototype.resizeParentStacks = function(parent, layout, dx, dy)
  4517. {
  4518. if (this.layoutManager != null && layout != null && layout.constructor == mxStackLayout && !layout.resizeLast)
  4519. {
  4520. this.model.beginUpdate();
  4521. try
  4522. {
  4523. var dir = layout.horizontal;
  4524. // Bubble resize up for all parent stack layouts with same orientation
  4525. while (parent != null && layout != null && layout.constructor == mxStackLayout &&
  4526. layout.horizontal == dir && !layout.resizeLast)
  4527. {
  4528. var pgeo = this.getCellGeometry(parent);
  4529. var pstate = this.view.getState(parent);
  4530. if (pstate != null && pgeo != null)
  4531. {
  4532. pgeo = pgeo.clone();
  4533. if (layout.horizontal)
  4534. {
  4535. pgeo.width += dx + Math.min(0, pstate.width / this.view.scale - pgeo.width);
  4536. }
  4537. else
  4538. {
  4539. pgeo.height += dy + Math.min(0, pstate.height / this.view.scale - pgeo.height);
  4540. }
  4541. this.model.setGeometry(parent, pgeo);
  4542. }
  4543. parent = this.model.getParent(parent);
  4544. layout = this.layoutManager.getLayout(parent);
  4545. }
  4546. }
  4547. finally
  4548. {
  4549. this.model.endUpdate();
  4550. }
  4551. }
  4552. };
  4553. /**
  4554. * Disables drill-down for non-swimlanes.
  4555. */
  4556. Graph.prototype.isContainer = function(cell)
  4557. {
  4558. var style = this.getCurrentCellStyle(cell);
  4559. if (this.isSwimlane(cell))
  4560. {
  4561. return style['container'] != '0';
  4562. }
  4563. else
  4564. {
  4565. return style['container'] == '1';
  4566. }
  4567. };
  4568. /**
  4569. * Adds a connectable style.
  4570. */
  4571. Graph.prototype.isCellConnectable = function(cell)
  4572. {
  4573. var style = this.getCurrentCellStyle(cell);
  4574. return (style['connectable'] != null) ? style['connectable'] != '0' :
  4575. mxGraph.prototype.isCellConnectable.apply(this, arguments);
  4576. };
  4577. /**
  4578. * Adds labelMovable style.
  4579. */
  4580. Graph.prototype.isLabelMovable = function(cell)
  4581. {
  4582. var style = this.getCurrentCellStyle(cell);
  4583. return (style['movableLabel'] != null) ? style['movableLabel'] != '0' :
  4584. mxGraph.prototype.isLabelMovable.apply(this, arguments);
  4585. };
  4586. /**
  4587. * Function: selectAll
  4588. *
  4589. * Selects all children of the given parent cell or the children of the
  4590. * default parent if no parent is specified. To select leaf vertices and/or
  4591. * edges use <selectCells>.
  4592. *
  4593. * Parameters:
  4594. *
  4595. * parent - Optional <mxCell> whose children should be selected.
  4596. * Default is <defaultParent>.
  4597. */
  4598. Graph.prototype.selectAll = function(parent)
  4599. {
  4600. parent = parent || this.getDefaultParent();
  4601. if (!this.isCellLocked(parent))
  4602. {
  4603. mxGraph.prototype.selectAll.apply(this, arguments);
  4604. }
  4605. };
  4606. /**
  4607. * Function: selectCells
  4608. *
  4609. * Selects all vertices and/or edges depending on the given boolean
  4610. * arguments recursively, starting at the given parent or the default
  4611. * parent if no parent is specified. Use <selectAll> to select all cells.
  4612. * For vertices, only cells with no children are selected.
  4613. *
  4614. * Parameters:
  4615. *
  4616. * vertices - Boolean indicating if vertices should be selected.
  4617. * edges - Boolean indicating if edges should be selected.
  4618. * parent - Optional <mxCell> that acts as the root of the recursion.
  4619. * Default is <defaultParent>.
  4620. */
  4621. Graph.prototype.selectCells = function(vertices, edges, parent)
  4622. {
  4623. parent = parent || this.getDefaultParent();
  4624. if (!this.isCellLocked(parent))
  4625. {
  4626. mxGraph.prototype.selectCells.apply(this, arguments);
  4627. }
  4628. };
  4629. /**
  4630. * Function: getSwimlaneAt
  4631. *
  4632. * Returns the bottom-most swimlane that intersects the given point (x, y)
  4633. * in the cell hierarchy that starts at the given parent.
  4634. *
  4635. * Parameters:
  4636. *
  4637. * x - X-coordinate of the location to be checked.
  4638. * y - Y-coordinate of the location to be checked.
  4639. * parent - <mxCell> that should be used as the root of the recursion.
  4640. * Default is <defaultParent>.
  4641. */
  4642. Graph.prototype.getSwimlaneAt = function (x, y, parent)
  4643. {
  4644. var result = mxGraph.prototype.getSwimlaneAt.apply(this, arguments);
  4645. if (this.isCellLocked(result))
  4646. {
  4647. result = null;
  4648. }
  4649. return result;
  4650. };
  4651. /**
  4652. * Disables folding for non-swimlanes.
  4653. */
  4654. Graph.prototype.isCellFoldable = function(cell)
  4655. {
  4656. var style = this.getCurrentCellStyle(cell);
  4657. return this.foldingEnabled && mxUtils.getValue(style,
  4658. mxConstants.STYLE_RESIZABLE, '1') != '0' &&
  4659. (style['treeFolding'] == '1' ||
  4660. (!this.isCellLocked(cell) &&
  4661. ((this.isContainer(cell) && style['collapsible'] != '0') ||
  4662. (!this.isContainer(cell) && style['collapsible'] == '1'))));
  4663. };
  4664. /**
  4665. * Stops all interactions and clears the selection.
  4666. */
  4667. Graph.prototype.reset = function()
  4668. {
  4669. if (this.isEditing())
  4670. {
  4671. this.stopEditing(true);
  4672. }
  4673. this.escape();
  4674. if (!this.isSelectionEmpty())
  4675. {
  4676. this.clearSelection();
  4677. }
  4678. };
  4679. /**
  4680. * Overridden to limit zoom to 1% - 16.000%.
  4681. */
  4682. Graph.prototype.zoom = function(factor, center)
  4683. {
  4684. factor = Math.max(0.01, Math.min(this.view.scale * factor, 160)) / this.view.scale;
  4685. mxGraph.prototype.zoom.apply(this, arguments);
  4686. };
  4687. /**
  4688. * Function: zoomIn
  4689. *
  4690. * Zooms into the graph by <zoomFactor>.
  4691. */
  4692. Graph.prototype.zoomIn = function()
  4693. {
  4694. // Switches to 1% zoom steps below 15%
  4695. if (this.view.scale < 0.15)
  4696. {
  4697. this.zoom((this.view.scale + 0.01) / this.view.scale);
  4698. }
  4699. else
  4700. {
  4701. // Uses to 5% zoom steps for better grid rendering in webkit
  4702. // and to avoid rounding errors for zoom steps
  4703. this.zoom((Math.round(this.view.scale * this.zoomFactor * 20) / 20) / this.view.scale);
  4704. }
  4705. };
  4706. /**
  4707. * Function: zoomOut
  4708. *
  4709. * Zooms out of the graph by <zoomFactor>.
  4710. */
  4711. Graph.prototype.zoomOut = function()
  4712. {
  4713. // Switches to 1% zoom steps below 15%
  4714. if (this.view.scale <= 0.15)
  4715. {
  4716. this.zoom((this.view.scale - 0.01) / this.view.scale);
  4717. }
  4718. else
  4719. {
  4720. // Uses to 5% zoom steps for better grid rendering in webkit
  4721. // and to avoid rounding errors for zoom steps
  4722. this.zoom((Math.round(this.view.scale * (1 / this.zoomFactor) * 20) / 20) / this.view.scale);
  4723. }
  4724. };
  4725. /**
  4726. * Function: fitPages
  4727. *
  4728. * Fits the given number of pages to the current view horizontally.
  4729. * If pageCount is null then all pages will be used. This should not
  4730. * be called if pages are not visible.
  4731. */
  4732. Graph.prototype.fitPages = function(pageCount, ignoreHeight)
  4733. {
  4734. var vcount = 1;
  4735. if (pageCount == null)
  4736. {
  4737. var layout = this.getPageLayout();
  4738. pageCount = layout.width;
  4739. vcount = layout.height;
  4740. }
  4741. var ps = this.pageScale;
  4742. var fmt = this.pageFormat;
  4743. var cw = this.container.clientWidth - 10;
  4744. var ch = this.container.clientHeight - 10;
  4745. var sx = cw / (pageCount * fmt.width) / ps;
  4746. var scale = Math.floor(20 * ((ignoreHeight) ? sx :
  4747. Math.min(sx, ch / (vcount * fmt.height) / ps))) / 20;
  4748. this.zoomTo(scale);
  4749. if (mxUtils.hasScrollbars(this.container))
  4750. {
  4751. var pad = this.getPagePadding();
  4752. this.container.scrollLeft = Math.min(pad.x * this.view.scale,
  4753. (this.container.scrollWidth - this.container.clientWidth) / 2) - 1;
  4754. if (!ignoreHeight)
  4755. {
  4756. if (pageCount >= 2)
  4757. {
  4758. this.container.scrollTop = Math.min(pad.y,
  4759. (this.container.scrollHeight -
  4760. this.container.clientHeight) / 2);
  4761. }
  4762. else
  4763. {
  4764. this.container.scrollTop = pad.y * this.view.scale - 1;
  4765. }
  4766. }
  4767. }
  4768. };
  4769. /**
  4770. * Function: fitWindow
  4771. *
  4772. * Sets the current visible rectangle of the window in graph coordinates.
  4773. */
  4774. Graph.prototype.fitWindow = function(bounds, border)
  4775. {
  4776. border = (border != null) ? border : 10;
  4777. var cw = this.container.clientWidth - border;
  4778. var ch = this.container.clientHeight - border;
  4779. var scale = Math.floor(20 * Math.min(cw / bounds.width, ch / bounds.height)) / 20;
  4780. this.zoomTo(scale);
  4781. if (mxUtils.hasScrollbars(this.container))
  4782. {
  4783. var t = this.view.translate;
  4784. this.container.scrollLeft = (bounds.x + t.x) * this.view.scale -
  4785. Math.max((cw - bounds.width * this.view.scale) / 2 + border / 2, 0);
  4786. this.container.scrollTop = (bounds.y + t.y) * this.view.scale -
  4787. Math.max((ch - bounds.height * this.view.scale) / 2 + border / 2, 0);
  4788. }
  4789. };
  4790. /**
  4791. * Overrides tooltips to show custom tooltip or metadata.
  4792. */
  4793. Graph.prototype.convertValueToTooltip = function(cell)
  4794. {
  4795. var tmp = null;
  4796. if (mxUtils.isNode(cell.value))
  4797. {
  4798. if (Graph.translateDiagram && Graph.diagramLanguage != null)
  4799. {
  4800. tmp = cell.value.getAttribute('tooltip_' + Graph.diagramLanguage);
  4801. }
  4802. if (tmp == null)
  4803. {
  4804. tmp = cell.value.getAttribute('tooltip');
  4805. }
  4806. if (tmp != null)
  4807. {
  4808. if (tmp != null && this.isReplacePlaceholders(cell))
  4809. {
  4810. tmp = this.replacePlaceholders(cell, tmp);
  4811. }
  4812. tmp = Graph.sanitizeHtml(tmp);
  4813. }
  4814. }
  4815. return tmp;
  4816. };
  4817. /**
  4818. * Overrides tooltips to show custom tooltip or metadata.
  4819. */
  4820. Graph.prototype.getTooltipForCell = function(cell)
  4821. {
  4822. var tip = '';
  4823. if (mxUtils.isNode(cell.value))
  4824. {
  4825. tip = this.convertValueToTooltip(cell);
  4826. if (tip == null)
  4827. {
  4828. var ignored = this.builtInProperties;
  4829. var attrs = cell.value.attributes;
  4830. var temp = [];
  4831. tip = '';
  4832. // Hides links in edit mode
  4833. if (this.isEnabled())
  4834. {
  4835. ignored.push('linkTarget');
  4836. ignored.push('link');
  4837. }
  4838. for (var i = 0; i < attrs.length; i++)
  4839. {
  4840. if (((Graph.translateDiagram && attrs[i].nodeName == 'label') ||
  4841. mxUtils.indexOf(ignored, attrs[i].nodeName) < 0) &&
  4842. attrs[i].nodeValue.length > 0)
  4843. {
  4844. temp.push({name: attrs[i].nodeName, value: attrs[i].nodeValue});
  4845. }
  4846. }
  4847. // Sorts by name
  4848. temp.sort(function(a, b)
  4849. {
  4850. if (a.name < b.name)
  4851. {
  4852. return -1;
  4853. }
  4854. else if (a.name > b.name)
  4855. {
  4856. return 1;
  4857. }
  4858. else
  4859. {
  4860. return 0;
  4861. }
  4862. });
  4863. for (var i = 0; i < temp.length; i++)
  4864. {
  4865. if (temp[i].name != 'link' || !this.isCustomLink(temp[i].value))
  4866. {
  4867. tip += ((temp[i].name != 'link') ? '<b>' + mxUtils.htmlEntities(temp[i].name) +
  4868. ':</b> ' : '') + mxUtils.htmlEntities(temp[i].value) + '\n';
  4869. }
  4870. }
  4871. if (tip.length > 0)
  4872. {
  4873. tip = tip.substring(0, tip.length - 1);
  4874. if (mxClient.IS_SVG)
  4875. {
  4876. tip = '<div style="max-width:360px;text-overflow:ellipsis;overflow:hidden;">' +
  4877. tip + '</div>';
  4878. }
  4879. }
  4880. }
  4881. }
  4882. return tip;
  4883. };
  4884. /**
  4885. * Adds rack child layout style.
  4886. */
  4887. Graph.prototype.getFlowAnimationStyle = function()
  4888. {
  4889. var head = document.getElementsByTagName('head')[0];
  4890. if (head != null && this.flowAnimationStyle == null)
  4891. {
  4892. this.flowAnimationStyle = document.createElement('style')
  4893. this.flowAnimationStyle.setAttribute('id',
  4894. 'geEditorFlowAnimation-' + Editor.guid());
  4895. this.flowAnimationStyle.type = 'text/css';
  4896. var id = this.flowAnimationStyle.getAttribute('id');
  4897. this.flowAnimationStyle.innerHTML = this.getFlowAnimationStyleCss(id);
  4898. head.appendChild(this.flowAnimationStyle);
  4899. }
  4900. return this.flowAnimationStyle;
  4901. };
  4902. /**
  4903. * Adds rack child layout style.
  4904. */
  4905. Graph.prototype.getFlowAnimationStyleCss = function(id)
  4906. {
  4907. return '.' + id + ' {\n' +
  4908. 'animation: ' + id + ' 0.5s linear;\n' +
  4909. 'animation-iteration-count: infinite;\n' +
  4910. '}\n' +
  4911. '@keyframes ' + id + ' {\n' +
  4912. 'to {\n' +
  4913. 'stroke-dashoffset: ' + (this.view.scale * -16) + ';\n' +
  4914. '}\n' +
  4915. '}';
  4916. };
  4917. /**
  4918. * Turns the given string into an array.
  4919. */
  4920. Graph.prototype.stringToBytes = function(str)
  4921. {
  4922. return Graph.stringToBytes(str);
  4923. };
  4924. /**
  4925. * Turns the given array into a string.
  4926. */
  4927. Graph.prototype.bytesToString = function(arr)
  4928. {
  4929. return Graph.bytesToString(arr);
  4930. };
  4931. /**
  4932. * Returns a base64 encoded version of the compressed outer XML of the given node.
  4933. */
  4934. Graph.prototype.compressNode = function(node)
  4935. {
  4936. return Graph.compressNode(node);
  4937. };
  4938. /**
  4939. * Returns a base64 encoded version of the compressed string.
  4940. */
  4941. Graph.prototype.compress = function(data, deflate)
  4942. {
  4943. return Graph.compress(data, deflate);
  4944. };
  4945. /**
  4946. * Returns a decompressed version of the base64 encoded string.
  4947. */
  4948. Graph.prototype.decompress = function(data, inflate)
  4949. {
  4950. return Graph.decompress(data, inflate);
  4951. };
  4952. /**
  4953. * Redirects to Graph.zapGremlins.
  4954. */
  4955. Graph.prototype.zapGremlins = function(text)
  4956. {
  4957. return Graph.zapGremlins(text);
  4958. };
  4959. /**
  4960. * Hover icons are used for hover, vertex handler and drag from sidebar.
  4961. */
  4962. HoverIcons = function(graph)
  4963. {
  4964. mxEventSource.call(this);
  4965. this.graph = graph;
  4966. this.init();
  4967. };
  4968. // Extends mxEventSource
  4969. mxUtils.extend(HoverIcons, mxEventSource);
  4970. /**
  4971. * Up arrow.
  4972. */
  4973. HoverIcons.prototype.arrowSpacing = 2;
  4974. /**
  4975. * Delay to switch to another state for overlapping bbox. Default is 500ms.
  4976. */
  4977. HoverIcons.prototype.updateDelay = 500;
  4978. /**
  4979. * Delay to switch between states. Default is 140ms.
  4980. */
  4981. HoverIcons.prototype.activationDelay = 140;
  4982. /**
  4983. * Up arrow.
  4984. */
  4985. HoverIcons.prototype.currentState = null;
  4986. /**
  4987. * Up arrow.
  4988. */
  4989. HoverIcons.prototype.activeArrow = null;
  4990. /**
  4991. * Up arrow.
  4992. */
  4993. HoverIcons.prototype.inactiveOpacity = 15;
  4994. /**
  4995. * Up arrow.
  4996. */
  4997. HoverIcons.prototype.cssCursor = 'copy';
  4998. /**
  4999. * Whether to hide arrows that collide with vertices.
  5000. * LATER: Add keyboard override, touch support.
  5001. */
  5002. HoverIcons.prototype.checkCollisions = true;
  5003. /**
  5004. * Up arrow.
  5005. */
  5006. HoverIcons.prototype.arrowFill = '#29b6f2';
  5007. /**
  5008. * Up arrow.
  5009. */
  5010. HoverIcons.prototype.triangleUp = (!mxClient.IS_SVG) ? new mxImage(IMAGE_PATH + '/triangle-up.png', 26, 14) :
  5011. Graph.createSvgImage(18, 28, '<path d="m 6 26 L 12 26 L 12 12 L 18 12 L 9 1 L 1 12 L 6 12 z" ' +
  5012. 'stroke="#fff" fill="' + HoverIcons.prototype.arrowFill + '"/>');
  5013. /**
  5014. * Right arrow.
  5015. */
  5016. HoverIcons.prototype.triangleRight = (!mxClient.IS_SVG) ? new mxImage(IMAGE_PATH + '/triangle-right.png', 14, 26) :
  5017. Graph.createSvgImage(26, 18, '<path d="m 1 6 L 14 6 L 14 1 L 26 9 L 14 18 L 14 12 L 1 12 z" ' +
  5018. 'stroke="#fff" fill="' + HoverIcons.prototype.arrowFill + '"/>');
  5019. /**
  5020. * Down arrow.
  5021. */
  5022. HoverIcons.prototype.triangleDown = (!mxClient.IS_SVG) ? new mxImage(IMAGE_PATH + '/triangle-down.png', 26, 14) :
  5023. Graph.createSvgImage(18, 26, '<path d="m 6 1 L 6 14 L 1 14 L 9 26 L 18 14 L 12 14 L 12 1 z" ' +
  5024. 'stroke="#fff" fill="' + HoverIcons.prototype.arrowFill + '"/>');
  5025. /**
  5026. * Left arrow.
  5027. */
  5028. HoverIcons.prototype.triangleLeft = (!mxClient.IS_SVG) ? new mxImage(IMAGE_PATH + '/triangle-left.png', 14, 26) :
  5029. Graph.createSvgImage(28, 18, '<path d="m 1 9 L 12 1 L 12 6 L 26 6 L 26 12 L 12 12 L 12 18 z" ' +
  5030. 'stroke="#fff" fill="' + HoverIcons.prototype.arrowFill + '"/>');
  5031. /**
  5032. * Round target.
  5033. */
  5034. HoverIcons.prototype.roundDrop = (!mxClient.IS_SVG) ? new mxImage(IMAGE_PATH + '/round-drop.png', 26, 26) :
  5035. Graph.createSvgImage(26, 26, '<circle cx="13" cy="13" r="12" ' +
  5036. 'stroke="#fff" fill="' + HoverIcons.prototype.arrowFill + '"/>');
  5037. /**
  5038. * Refresh target.
  5039. */
  5040. HoverIcons.prototype.refreshTarget = new mxImage((mxClient.IS_SVG) ? 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjM2cHgiIGhlaWdodD0iMzZweCI+PGVsbGlwc2UgZmlsbD0iIzI5YjZmMiIgY3g9IjEyIiBjeT0iMTIiIHJ4PSIxMiIgcnk9IjEyIi8+PHBhdGggdHJhbnNmb3JtPSJzY2FsZSgwLjgpIHRyYW5zbGF0ZSgyLjQsIDIuNCkiIHN0cm9rZT0iI2ZmZiIgZmlsbD0iI2ZmZiIgZD0iTTEyIDZ2M2w0LTQtNC00djNjLTQuNDIgMC04IDMuNTgtOCA4IDAgMS41Ny40NiAzLjAzIDEuMjQgNC4yNkw2LjcgMTQuOGMtLjQ1LS44My0uNy0xLjc5LS43LTIuOCAwLTMuMzEgMi42OS02IDYtNnptNi43NiAxLjc0TDE3LjMgOS4yYy40NC44NC43IDEuNzkuNyAyLjggMCAzLjMxLTIuNjkgNi02IDZ2LTNsLTQgNCA0IDR2LTNjNC40MiAwIDgtMy41OCA4LTggMC0xLjU3LS40Ni0zLjAzLTEuMjQtNC4yNnoiLz48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PC9zdmc+Cg==' :
  5041. IMAGE_PATH + '/refresh.png', 38, 38);
  5042. /**
  5043. * Tolerance for hover icon clicks.
  5044. */
  5045. HoverIcons.prototype.tolerance = (mxClient.IS_TOUCH) ? 6 : 0;
  5046. /**
  5047. *
  5048. */
  5049. HoverIcons.prototype.init = function()
  5050. {
  5051. this.arrowUp = this.createArrow(this.triangleUp, mxResources.get('plusTooltip'), mxConstants.DIRECTION_NORTH);
  5052. this.arrowRight = this.createArrow(this.triangleRight, mxResources.get('plusTooltip'), mxConstants.DIRECTION_EAST);
  5053. this.arrowDown = this.createArrow(this.triangleDown, mxResources.get('plusTooltip'), mxConstants.DIRECTION_SOUTH);
  5054. this.arrowLeft = this.createArrow(this.triangleLeft, mxResources.get('plusTooltip'), mxConstants.DIRECTION_WEST);
  5055. this.elts = [this.arrowUp, this.arrowRight, this.arrowDown, this.arrowLeft];
  5056. this.resetHandler = mxUtils.bind(this, function()
  5057. {
  5058. this.reset();
  5059. });
  5060. this.repaintHandler = mxUtils.bind(this, function()
  5061. {
  5062. this.repaint();
  5063. });
  5064. this.graph.selectionModel.addListener(mxEvent.CHANGE, this.resetHandler);
  5065. this.graph.model.addListener(mxEvent.CHANGE, this.repaintHandler);
  5066. this.graph.view.addListener(mxEvent.SCALE_AND_TRANSLATE, this.repaintHandler);
  5067. this.graph.view.addListener(mxEvent.TRANSLATE, this.repaintHandler);
  5068. this.graph.view.addListener(mxEvent.SCALE, this.repaintHandler);
  5069. this.graph.view.addListener(mxEvent.DOWN, this.repaintHandler);
  5070. this.graph.view.addListener(mxEvent.UP, this.repaintHandler);
  5071. this.graph.addListener(mxEvent.ROOT, this.repaintHandler);
  5072. this.graph.addListener(mxEvent.ESCAPE, this.resetHandler);
  5073. mxEvent.addListener(this.graph.container, 'scroll', this.resetHandler);
  5074. // Resets the mouse point on escape
  5075. this.graph.addListener(mxEvent.ESCAPE, mxUtils.bind(this, function()
  5076. {
  5077. this.mouseDownPoint = null;
  5078. }));
  5079. // Removes hover icons if mouse leaves the container
  5080. mxEvent.addListener(this.graph.container, 'mouseleave', mxUtils.bind(this, function(evt)
  5081. {
  5082. // Workaround for IE11 firing mouseleave for touch in diagram
  5083. if (evt.relatedTarget != null && mxEvent.getSource(evt) == this.graph.container)
  5084. {
  5085. this.setDisplay('none');
  5086. }
  5087. }));
  5088. // Resets current state when in-place editor starts
  5089. this.graph.addListener(mxEvent.START_EDITING, mxUtils.bind(this, function(evt)
  5090. {
  5091. this.reset();
  5092. }));
  5093. // Resets current state after update of selection state for touch events
  5094. var graphClick = this.graph.click;
  5095. this.graph.click = mxUtils.bind(this, function(me)
  5096. {
  5097. graphClick.apply(this.graph, arguments);
  5098. if (this.currentState != null && !this.graph.isCellSelected(this.currentState.cell) &&
  5099. mxEvent.isTouchEvent(me.getEvent()) && !this.graph.model.isVertex(me.getCell()))
  5100. {
  5101. this.reset();
  5102. }
  5103. });
  5104. // Checks if connection handler was active in mouse move
  5105. // as workaround for possible double connection inserted
  5106. var connectionHandlerActive = false;
  5107. // Implements a listener for hover and click handling
  5108. this.graph.addMouseListener(
  5109. {
  5110. mouseDown: mxUtils.bind(this, function(sender, me)
  5111. {
  5112. connectionHandlerActive = false;
  5113. var evt = me.getEvent();
  5114. if (this.isResetEvent(evt))
  5115. {
  5116. this.reset();
  5117. }
  5118. else if (!this.isActive())
  5119. {
  5120. var state = this.getState(me.getState());
  5121. if (state != null || !mxEvent.isTouchEvent(evt))
  5122. {
  5123. this.update(state);
  5124. }
  5125. }
  5126. this.setDisplay('none');
  5127. }),
  5128. mouseMove: mxUtils.bind(this, function(sender, me)
  5129. {
  5130. var evt = me.getEvent();
  5131. if (this.isResetEvent(evt))
  5132. {
  5133. this.reset();
  5134. }
  5135. else if (!this.graph.isMouseDown && !mxEvent.isTouchEvent(evt))
  5136. {
  5137. this.update(this.getState(me.getState()),
  5138. me.getGraphX(), me.getGraphY());
  5139. }
  5140. if (this.graph.connectionHandler != null &&
  5141. this.graph.connectionHandler.shape != null)
  5142. {
  5143. connectionHandlerActive = true;
  5144. }
  5145. }),
  5146. mouseUp: mxUtils.bind(this, function(sender, me)
  5147. {
  5148. var evt = me.getEvent();
  5149. var pt = mxUtils.convertPoint(this.graph.container,
  5150. mxEvent.getClientX(evt), mxEvent.getClientY(evt))
  5151. if (this.isResetEvent(evt))
  5152. {
  5153. this.reset();
  5154. }
  5155. else if (this.isActive() && !connectionHandlerActive &&
  5156. this.mouseDownPoint != null)
  5157. {
  5158. this.click(this.currentState, this.getDirection(), me);
  5159. }
  5160. else if (this.isActive())
  5161. {
  5162. // Selects target vertex after drag and clone if not only new edge was inserted
  5163. if (this.graph.getSelectionCount() != 1 || !this.graph.model.isEdge(
  5164. this.graph.getSelectionCell()))
  5165. {
  5166. this.update(this.getState(this.graph.view.getState(
  5167. this.graph.getCellAt(me.getGraphX(), me.getGraphY()))));
  5168. }
  5169. else
  5170. {
  5171. this.reset();
  5172. }
  5173. }
  5174. else if (mxEvent.isTouchEvent(evt) || (this.bbox != null &&
  5175. mxUtils.contains(this.bbox, me.getGraphX(), me.getGraphY())))
  5176. {
  5177. // Shows existing hover icons if inside bounding box
  5178. this.setDisplay('');
  5179. this.repaint();
  5180. }
  5181. else if (!mxEvent.isTouchEvent(evt))
  5182. {
  5183. this.reset();
  5184. }
  5185. connectionHandlerActive = false;
  5186. this.resetActiveArrow();
  5187. })
  5188. });
  5189. };
  5190. /**
  5191. *
  5192. */
  5193. HoverIcons.prototype.isResetEvent = function(evt, allowShift)
  5194. {
  5195. return mxEvent.isAltDown(evt) || (this.activeArrow == null && mxEvent.isShiftDown(evt)) ||
  5196. (mxEvent.isPopupTrigger(evt) && !this.graph.isCloneEvent(evt));
  5197. };
  5198. /**
  5199. *
  5200. */
  5201. HoverIcons.prototype.createArrow = function(img, tooltip, direction)
  5202. {
  5203. var arrow = null;
  5204. arrow = mxUtils.createImage(img.src);
  5205. arrow.style.width = img.width + 'px';
  5206. arrow.style.height = img.height + 'px';
  5207. arrow.style.padding = this.tolerance + 'px';
  5208. if (tooltip != null)
  5209. {
  5210. arrow.setAttribute('title', tooltip);
  5211. }
  5212. arrow.style.position = 'absolute';
  5213. arrow.style.cursor = this.cssCursor;
  5214. mxEvent.addGestureListeners(arrow, mxUtils.bind(this, function(evt)
  5215. {
  5216. if (this.currentState != null && !this.isResetEvent(evt))
  5217. {
  5218. this.mouseDownPoint = mxUtils.convertPoint(this.graph.container,
  5219. mxEvent.getClientX(evt), mxEvent.getClientY(evt));
  5220. this.drag(evt, this.mouseDownPoint.x, this.mouseDownPoint.y);
  5221. this.activeArrow = arrow;
  5222. this.setDisplay('none');
  5223. mxEvent.consume(evt);
  5224. }
  5225. }));
  5226. // Captures mouse events as events on graph
  5227. mxEvent.redirectMouseEvents(arrow, this.graph, this.currentState);
  5228. mxEvent.addListener(arrow, 'mouseenter', mxUtils.bind(this, function(evt)
  5229. {
  5230. // Workaround for Firefox firing mouseenter on touchend
  5231. if (mxEvent.isMouseEvent(evt))
  5232. {
  5233. if (this.activeArrow != null && this.activeArrow != arrow)
  5234. {
  5235. mxUtils.setOpacity(this.activeArrow, this.inactiveOpacity);
  5236. }
  5237. this.graph.connectionHandler.constraintHandler.reset();
  5238. mxUtils.setOpacity(arrow, 100);
  5239. this.activeArrow = arrow;
  5240. this.fireEvent(new mxEventObject('focus', 'arrow', arrow,
  5241. 'direction', direction, 'event', evt));
  5242. }
  5243. }));
  5244. mxEvent.addListener(arrow, 'mouseleave', mxUtils.bind(this, function(evt)
  5245. {
  5246. if (mxEvent.isMouseEvent(evt))
  5247. {
  5248. this.fireEvent(new mxEventObject('blur', 'arrow', arrow,
  5249. 'direction', direction, 'event', evt));
  5250. }
  5251. // Workaround for IE11 firing this event on touch
  5252. if (!this.graph.isMouseDown)
  5253. {
  5254. this.resetActiveArrow();
  5255. }
  5256. }));
  5257. return arrow;
  5258. };
  5259. /**
  5260. *
  5261. */
  5262. HoverIcons.prototype.resetActiveArrow = function()
  5263. {
  5264. if (this.activeArrow != null)
  5265. {
  5266. mxUtils.setOpacity(this.activeArrow, this.inactiveOpacity);
  5267. this.activeArrow = null;
  5268. }
  5269. };
  5270. /**
  5271. *
  5272. */
  5273. HoverIcons.prototype.getDirection = function()
  5274. {
  5275. var dir = mxConstants.DIRECTION_EAST;
  5276. if (this.activeArrow == this.arrowUp)
  5277. {
  5278. dir = mxConstants.DIRECTION_NORTH;
  5279. }
  5280. else if (this.activeArrow == this.arrowDown)
  5281. {
  5282. dir = mxConstants.DIRECTION_SOUTH;
  5283. }
  5284. else if (this.activeArrow == this.arrowLeft)
  5285. {
  5286. dir = mxConstants.DIRECTION_WEST;
  5287. }
  5288. return dir;
  5289. };
  5290. /**
  5291. *
  5292. */
  5293. HoverIcons.prototype.visitNodes = function(visitor)
  5294. {
  5295. for (var i = 0; i < this.elts.length; i++)
  5296. {
  5297. if (this.elts[i] != null)
  5298. {
  5299. visitor(this.elts[i]);
  5300. }
  5301. }
  5302. };
  5303. /**
  5304. *
  5305. */
  5306. HoverIcons.prototype.removeNodes = function()
  5307. {
  5308. this.visitNodes(function(elt)
  5309. {
  5310. if (elt.parentNode != null)
  5311. {
  5312. elt.parentNode.removeChild(elt);
  5313. }
  5314. });
  5315. };
  5316. /**
  5317. *
  5318. */
  5319. HoverIcons.prototype.setDisplay = function(display)
  5320. {
  5321. this.visitNodes(function(elt)
  5322. {
  5323. elt.style.display = display;
  5324. });
  5325. };
  5326. /**
  5327. *
  5328. */
  5329. HoverIcons.prototype.isActive = function()
  5330. {
  5331. return this.activeArrow != null && this.currentState != null;
  5332. };
  5333. /**
  5334. *
  5335. */
  5336. HoverIcons.prototype.drag = function(evt, x, y)
  5337. {
  5338. this.graph.popupMenuHandler.hideMenu();
  5339. this.graph.stopEditing(false);
  5340. // Checks if state was removed in call to stopEditing above
  5341. if (this.currentState != null)
  5342. {
  5343. this.graph.connectionHandler.start(this.currentState, x, y);
  5344. this.graph.isMouseTrigger = mxEvent.isMouseEvent(evt);
  5345. this.graph.isMouseDown = true;
  5346. // Hides handles for selection cell
  5347. var handler = this.graph.selectionCellsHandler.getHandler(this.currentState.cell);
  5348. if (handler != null)
  5349. {
  5350. handler.setHandlesVisible(false);
  5351. }
  5352. // Ctrl+shift drag sets source constraint
  5353. var es = this.graph.connectionHandler.edgeState;
  5354. if (evt != null && mxEvent.isShiftDown(evt) && mxEvent.isControlDown(evt) && es != null &&
  5355. mxUtils.getValue(es.style, mxConstants.STYLE_EDGE, null) === 'orthogonalEdgeStyle')
  5356. {
  5357. var direction = this.getDirection();
  5358. es.cell.style = mxUtils.setStyle(es.cell.style, 'sourcePortConstraint', direction);
  5359. es.style['sourcePortConstraint'] = direction;
  5360. }
  5361. }
  5362. };
  5363. /**
  5364. *
  5365. */
  5366. HoverIcons.prototype.getStateAt = function(state, x, y)
  5367. {
  5368. return this.graph.view.getState(this.graph.getCellAt(x, y));
  5369. };
  5370. /**
  5371. *
  5372. */
  5373. HoverIcons.prototype.click = function(state, dir, me)
  5374. {
  5375. var evt = me.getEvent();
  5376. var x = me.getGraphX();
  5377. var y = me.getGraphY();
  5378. var tmp = this.getStateAt(state, x, y);
  5379. if (tmp != null && this.graph.model.isEdge(tmp.cell) && !this.graph.isCloneEvent(evt) &&
  5380. (tmp.getVisibleTerminalState(true) == state || tmp.getVisibleTerminalState(false) == state))
  5381. {
  5382. this.graph.setSelectionCell(tmp.cell);
  5383. this.reset();
  5384. }
  5385. else if (state != null)
  5386. {
  5387. this.execute(state, dir, me);
  5388. }
  5389. me.consume();
  5390. };
  5391. /**
  5392. *
  5393. */
  5394. HoverIcons.prototype.execute = function(state, dir, me)
  5395. {
  5396. var evt = me.getEvent();
  5397. this.graph.selectCellsForConnectVertex(this.graph.connectVertex(
  5398. state.cell, dir, this.graph.defaultEdgeLength, evt, this.graph.isCloneEvent(evt),
  5399. this.graph.isCloneEvent(evt)), evt, this);
  5400. };
  5401. /**
  5402. *
  5403. */
  5404. HoverIcons.prototype.reset = function(clearTimeout)
  5405. {
  5406. clearTimeout = (clearTimeout == null) ? true : clearTimeout;
  5407. if (clearTimeout && this.updateThread != null)
  5408. {
  5409. window.clearTimeout(this.updateThread);
  5410. }
  5411. this.mouseDownPoint = null;
  5412. this.currentState = null;
  5413. this.activeArrow = null;
  5414. this.removeNodes();
  5415. this.bbox = null;
  5416. this.fireEvent(new mxEventObject('reset'));
  5417. };
  5418. /**
  5419. *
  5420. */
  5421. HoverIcons.prototype.repaint = function()
  5422. {
  5423. this.bbox = null;
  5424. if (this.currentState != null)
  5425. {
  5426. // Checks if cell was deleted
  5427. this.currentState = this.getState(this.currentState);
  5428. // Cell was deleted
  5429. if (this.currentState != null &&
  5430. this.graph.model.isVertex(this.currentState.cell) &&
  5431. this.graph.isCellConnectable(this.currentState.cell))
  5432. {
  5433. var bds = mxRectangle.fromRectangle(this.currentState);
  5434. // Uses outer bounding box to take rotation into account
  5435. if (this.currentState.shape != null && this.currentState.shape.boundingBox != null)
  5436. {
  5437. bds = mxRectangle.fromRectangle(this.currentState.shape.boundingBox);
  5438. }
  5439. bds.grow(this.graph.tolerance);
  5440. bds.grow(this.arrowSpacing);
  5441. var handler = this.graph.selectionCellsHandler.getHandler(this.currentState.cell);
  5442. if (this.graph.isTableRow(this.currentState.cell))
  5443. {
  5444. handler = this.graph.selectionCellsHandler.getHandler(
  5445. this.graph.model.getParent(this.currentState.cell));
  5446. }
  5447. var rotationBbox = null;
  5448. if (handler != null)
  5449. {
  5450. bds.x -= handler.horizontalOffset / 2;
  5451. bds.y -= handler.verticalOffset / 2;
  5452. bds.width += handler.horizontalOffset;
  5453. bds.height += handler.verticalOffset;
  5454. // Adds bounding box of rotation handle to avoid overlap
  5455. if (handler.rotationShape != null && handler.rotationShape.node != null &&
  5456. handler.rotationShape.node.style.visibility != 'hidden' &&
  5457. handler.rotationShape.node.style.display != 'none' &&
  5458. handler.rotationShape.boundingBox != null)
  5459. {
  5460. rotationBbox = handler.rotationShape.boundingBox;
  5461. }
  5462. }
  5463. // Positions arrows avoid collisions with rotation handle
  5464. var positionArrow = mxUtils.bind(this, function(arrow, x, y)
  5465. {
  5466. if (rotationBbox != null)
  5467. {
  5468. var bbox = new mxRectangle(x, y, arrow.clientWidth, arrow.clientHeight);
  5469. if (mxUtils.intersects(bbox, rotationBbox))
  5470. {
  5471. if (arrow == this.arrowUp)
  5472. {
  5473. y -= bbox.y + bbox.height - rotationBbox.y;
  5474. }
  5475. else if (arrow == this.arrowRight)
  5476. {
  5477. x += rotationBbox.x + rotationBbox.width - bbox.x;
  5478. }
  5479. else if (arrow == this.arrowDown)
  5480. {
  5481. y += rotationBbox.y + rotationBbox.height - bbox.y;
  5482. }
  5483. else if (arrow == this.arrowLeft)
  5484. {
  5485. x -= bbox.x + bbox.width - rotationBbox.x;
  5486. }
  5487. }
  5488. }
  5489. arrow.style.left = x + 'px';
  5490. arrow.style.top = y + 'px';
  5491. mxUtils.setOpacity(arrow, this.inactiveOpacity);
  5492. });
  5493. positionArrow(this.arrowUp,
  5494. Math.round(this.currentState.getCenterX() - this.triangleUp.width / 2 - this.tolerance),
  5495. Math.round(bds.y - this.triangleUp.height - this.tolerance));
  5496. positionArrow(this.arrowRight, Math.round(bds.x + bds.width - this.tolerance),
  5497. Math.round(this.currentState.getCenterY() - this.triangleRight.height / 2 - this.tolerance));
  5498. positionArrow(this.arrowDown, parseInt(this.arrowUp.style.left),
  5499. Math.round(bds.y + bds.height - this.tolerance));
  5500. positionArrow(this.arrowLeft, Math.round(bds.x - this.triangleLeft.width - this.tolerance),
  5501. parseInt(this.arrowRight.style.top));
  5502. if (this.checkCollisions)
  5503. {
  5504. var right = this.graph.getCellAt(bds.x + bds.width +
  5505. this.triangleRight.width / 2, this.currentState.getCenterY());
  5506. var left = this.graph.getCellAt(bds.x - this.triangleLeft.width / 2, this.currentState.getCenterY());
  5507. var top = this.graph.getCellAt(this.currentState.getCenterX(), bds.y - this.triangleUp.height / 2);
  5508. var bottom = this.graph.getCellAt(this.currentState.getCenterX(), bds.y + bds.height + this.triangleDown.height / 2);
  5509. // Shows hover icons large cell is behind all directions of current cell
  5510. if (right != null && right == left && left == top && top == bottom)
  5511. {
  5512. right = null;
  5513. left = null;
  5514. top = null;
  5515. bottom = null;
  5516. }
  5517. var currentGeo = this.graph.getCellGeometry(this.currentState.cell);
  5518. var checkCollision = mxUtils.bind(this, function(cell, arrow)
  5519. {
  5520. var geo = this.graph.model.isVertex(cell) && this.graph.getCellGeometry(cell);
  5521. // Ignores collision if vertex is more than 3 times the size of this vertex
  5522. if (cell != null && !this.graph.model.isAncestor(cell, this.currentState.cell) &&
  5523. !this.graph.isSwimlane(cell) && (geo == null || currentGeo == null ||
  5524. (geo.height < 3 * currentGeo.height && geo.width < 3 * currentGeo.width)))
  5525. {
  5526. arrow.style.visibility = 'hidden';
  5527. }
  5528. else
  5529. {
  5530. arrow.style.visibility = 'visible';
  5531. }
  5532. });
  5533. checkCollision(right, this.arrowRight);
  5534. checkCollision(left, this.arrowLeft);
  5535. checkCollision(top, this.arrowUp);
  5536. checkCollision(bottom, this.arrowDown);
  5537. }
  5538. else
  5539. {
  5540. this.arrowLeft.style.visibility = 'visible';
  5541. this.arrowRight.style.visibility = 'visible';
  5542. this.arrowUp.style.visibility = 'visible';
  5543. this.arrowDown.style.visibility = 'visible';
  5544. }
  5545. if (this.graph.tooltipHandler.isEnabled())
  5546. {
  5547. this.arrowLeft.setAttribute('title', mxResources.get('plusTooltip'));
  5548. this.arrowRight.setAttribute('title', mxResources.get('plusTooltip'));
  5549. this.arrowUp.setAttribute('title', mxResources.get('plusTooltip'));
  5550. this.arrowDown.setAttribute('title', mxResources.get('plusTooltip'));
  5551. }
  5552. else
  5553. {
  5554. this.arrowLeft.removeAttribute('title');
  5555. this.arrowRight.removeAttribute('title');
  5556. this.arrowUp.removeAttribute('title');
  5557. this.arrowDown.removeAttribute('title');
  5558. }
  5559. }
  5560. else
  5561. {
  5562. this.reset();
  5563. }
  5564. // Updates bounding box
  5565. if (this.currentState != null)
  5566. {
  5567. this.bbox = this.computeBoundingBox();
  5568. // Adds tolerance for hover
  5569. if (this.bbox != null)
  5570. {
  5571. this.bbox.grow(10);
  5572. }
  5573. }
  5574. }
  5575. };
  5576. /**
  5577. *
  5578. */
  5579. HoverIcons.prototype.computeBoundingBox = function()
  5580. {
  5581. var bbox = (!this.graph.model.isEdge(this.currentState.cell)) ? mxRectangle.fromRectangle(this.currentState) : null;
  5582. this.visitNodes(function(elt)
  5583. {
  5584. if (elt.parentNode != null)
  5585. {
  5586. var tmp = new mxRectangle(elt.offsetLeft, elt.offsetTop, elt.offsetWidth, elt.offsetHeight);
  5587. if (bbox == null)
  5588. {
  5589. bbox = tmp;
  5590. }
  5591. else
  5592. {
  5593. bbox.add(tmp);
  5594. }
  5595. }
  5596. });
  5597. return bbox;
  5598. };
  5599. /**
  5600. *
  5601. */
  5602. HoverIcons.prototype.getState = function(state)
  5603. {
  5604. if (state != null)
  5605. {
  5606. var cell = state.cell;
  5607. if (!this.graph.getModel().contains(cell))
  5608. {
  5609. state = null;
  5610. }
  5611. else
  5612. {
  5613. // Uses connectable parent vertex if child is not connectable
  5614. if (this.graph.getModel().isVertex(cell) && !this.graph.isCellConnectable(cell))
  5615. {
  5616. var parent = this.graph.getModel().getParent(cell);
  5617. if (this.graph.getModel().isVertex(parent) && this.graph.isCellConnectable(parent))
  5618. {
  5619. cell = parent;
  5620. }
  5621. }
  5622. // Ignores locked cells and edges
  5623. if (this.graph.isCellLocked(cell) || this.graph.model.isEdge(cell))
  5624. {
  5625. cell = null;
  5626. }
  5627. state = this.graph.view.getState(cell);
  5628. if (state != null && state.style == null)
  5629. {
  5630. state = null;
  5631. }
  5632. }
  5633. }
  5634. return state;
  5635. };
  5636. /**
  5637. *
  5638. */
  5639. HoverIcons.prototype.update = function(state, x, y)
  5640. {
  5641. if (!this.graph.connectionArrowsEnabled ||
  5642. (this.graph.freehand != null && this.graph.freehand.isDrawing()) ||
  5643. (state != null && mxUtils.getValue(state.style, 'allowArrows', '1') == '0'))
  5644. {
  5645. this.reset();
  5646. }
  5647. else
  5648. {
  5649. if (state != null && state.cell.geometry != null && state.cell.geometry.relative &&
  5650. this.graph.model.isEdge(state.cell.parent))
  5651. {
  5652. state = null;
  5653. }
  5654. var timeOnTarget = null;
  5655. // Time on target
  5656. if (this.prev != state || this.isActive())
  5657. {
  5658. this.startTime = new Date().getTime();
  5659. this.prev = state;
  5660. timeOnTarget = 0;
  5661. if (this.updateThread != null)
  5662. {
  5663. window.clearTimeout(this.updateThread);
  5664. }
  5665. if (state != null)
  5666. {
  5667. // Starts timer to update current state with no mouse events
  5668. this.updateThread = window.setTimeout(mxUtils.bind(this, function()
  5669. {
  5670. if (!this.isActive() && !this.graph.isMouseDown &&
  5671. !this.graph.panningHandler.isActive())
  5672. {
  5673. this.prev = state;
  5674. this.update(state, x, y);
  5675. }
  5676. }), this.updateDelay + 10);
  5677. }
  5678. }
  5679. else if (this.startTime != null)
  5680. {
  5681. timeOnTarget = new Date().getTime() - this.startTime;
  5682. }
  5683. this.setDisplay('');
  5684. if (this.currentState != null && this.currentState != state && timeOnTarget < this.activationDelay &&
  5685. this.bbox != null && !mxUtils.contains(this.bbox, x, y))
  5686. {
  5687. this.reset(false);
  5688. }
  5689. else if (this.currentState != null || timeOnTarget > this.activationDelay)
  5690. {
  5691. if (this.currentState != state && ((timeOnTarget > this.updateDelay && state != null) ||
  5692. this.bbox == null || x == null || y == null || !mxUtils.contains(this.bbox, x, y)))
  5693. {
  5694. if (state != null && this.graph.isEnabled())
  5695. {
  5696. this.removeNodes();
  5697. this.setCurrentState(state);
  5698. this.repaint();
  5699. // Resets connection points on other focused cells
  5700. if (this.graph.connectionHandler.constraintHandler.currentFocus != state)
  5701. {
  5702. this.graph.connectionHandler.constraintHandler.reset();
  5703. }
  5704. }
  5705. else
  5706. {
  5707. this.reset();
  5708. }
  5709. }
  5710. }
  5711. }
  5712. };
  5713. /**
  5714. *
  5715. */
  5716. HoverIcons.prototype.setCurrentState = function(state)
  5717. {
  5718. if (state.style['portConstraint'] != 'eastwest')
  5719. {
  5720. this.graph.container.appendChild(this.arrowUp);
  5721. this.graph.container.appendChild(this.arrowDown);
  5722. }
  5723. this.graph.container.appendChild(this.arrowRight);
  5724. this.graph.container.appendChild(this.arrowLeft);
  5725. this.currentState = state;
  5726. };
  5727. /**
  5728. * Returns true if the given cell is a table.
  5729. */
  5730. Graph.prototype.removeTextStyleForCell = function(cell, removeCellStyles)
  5731. {
  5732. var style = this.getCurrentCellStyle(cell);
  5733. var result = false;
  5734. this.getModel().beginUpdate();
  5735. try
  5736. {
  5737. if (mxUtils.getValue(style, 'html', '0') == '1')
  5738. {
  5739. var label = this.convertValueToString(cell);
  5740. if (mxUtils.getValue(style, 'nl2Br', '1') != '0')
  5741. {
  5742. // Removes newlines from HTML and converts breaks to newlines
  5743. // to match the HTML output in plain text
  5744. label = label.replace(/\n/g, '').replace(/<br\s*.?>/g, '\n');
  5745. }
  5746. label = Editor.convertHtmlToText(label);
  5747. this.cellLabelChanged(cell, label);
  5748. result = true;
  5749. }
  5750. if (removeCellStyles)
  5751. {
  5752. this.setCellStyles('fontSource', null, [cell]);
  5753. this.setCellStyles(mxConstants.STYLE_FONTFAMILY, null, [cell]);
  5754. this.setCellStyles(mxConstants.STYLE_FONTSIZE, null, [cell]);
  5755. this.setCellStyles(mxConstants.STYLE_FONTSTYLE, null, [cell]);
  5756. this.setCellStyles(mxConstants.STYLE_FONTCOLOR, null, [cell]);
  5757. this.setCellStyles(mxConstants.STYLE_LABEL_BORDERCOLOR, null, [cell]);
  5758. this.setCellStyles(mxConstants.STYLE_LABEL_BACKGROUNDCOLOR, null, [cell]);
  5759. }
  5760. }
  5761. finally
  5762. {
  5763. this.getModel().endUpdate();
  5764. }
  5765. return result;
  5766. };
  5767. /**
  5768. * Returns true if the given cell is a table.
  5769. */
  5770. Graph.prototype.createParent = function(parent, child, childCount, dx, dy)
  5771. {
  5772. parent = this.cloneCell(parent);
  5773. for (var i = 0; i < childCount; i++)
  5774. {
  5775. var clone = this.cloneCell(child);
  5776. var geo = this.getCellGeometry(clone)
  5777. if (geo != null)
  5778. {
  5779. geo.x += i * dx;
  5780. geo.y += i * dy;
  5781. }
  5782. parent.insert(clone);
  5783. }
  5784. return parent;
  5785. };
  5786. /**
  5787. * Returns true if the given cell is a table.
  5788. */
  5789. Graph.prototype.createTable = function(rowCount, colCount, w, h, title, startSize, tableStyle, rowStyle, cellStyle)
  5790. {
  5791. w = (w != null) ? w : 60;
  5792. h = (h != null) ? h : 40;
  5793. startSize = (startSize != null) ? startSize : 30;
  5794. tableStyle = (tableStyle != null) ? tableStyle : 'shape=table;startSize=' +
  5795. ((title != null) ? startSize : '0') + ';container=1;collapsible=0;childLayout=tableLayout;';
  5796. rowStyle = (rowStyle != null) ? rowStyle : 'shape=tableRow;horizontal=0;startSize=0;swimlaneHead=0;swimlaneBody=0;strokeColor=inherit;' +
  5797. 'top=0;left=0;bottom=0;right=0;collapsible=0;dropTarget=0;fillColor=none;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;';
  5798. cellStyle = (cellStyle != null) ? cellStyle : 'shape=partialRectangle;html=1;whiteSpace=wrap;connectable=0;strokeColor=inherit;' +
  5799. 'overflow=hidden;fillColor=none;top=0;left=0;bottom=0;right=0;pointerEvents=1;';
  5800. return this.createParent(this.createVertex(null, null, (title != null) ? title : '',
  5801. 0, 0, colCount * w, rowCount * h + ((title != null) ? startSize : 0), tableStyle),
  5802. this.createParent(this.createVertex(null, null, '', 0, 0, colCount * w, h, rowStyle),
  5803. this.createVertex(null, null, '', 0, 0, w, h, cellStyle),
  5804. colCount, w, 0), rowCount, 0, h);
  5805. };
  5806. /**
  5807. * Sets the values for the cells and rows in the given table and returns the table.
  5808. */
  5809. Graph.prototype.setTableValues = function(table, values, rowValues)
  5810. {
  5811. var rows = this.model.getChildCells(table, true);
  5812. for (var i = 0; i < rows.length; i++)
  5813. {
  5814. if (rowValues != null)
  5815. {
  5816. rows[i].value = rowValues[i];
  5817. }
  5818. if (values != null)
  5819. {
  5820. var cells = this.model.getChildCells(rows[i], true);
  5821. for (var j = 0; j < cells.length; j++)
  5822. {
  5823. if (values[i][j] != null)
  5824. {
  5825. cells[j].value = values[i][j];
  5826. }
  5827. }
  5828. }
  5829. }
  5830. return table;
  5831. };
  5832. /**
  5833. *
  5834. */
  5835. Graph.prototype.createCrossFunctionalSwimlane = function(rowCount, colCount, w, h, title, tableStyle, rowStyle, firstCellStyle, cellStyle)
  5836. {
  5837. w = (w != null) ? w : 120;
  5838. h = (h != null) ? h : 120;
  5839. var s = 'collapsible=0;recursiveResize=0;expand=0;';
  5840. tableStyle = (tableStyle != null) ? tableStyle : 'shape=table;childLayout=tableLayout;' +
  5841. ((title == null) ? 'startSize=0;fillColor=none;' : 'startSize=40;') + s;
  5842. rowStyle = (rowStyle != null) ? rowStyle : 'shape=tableRow;horizontal=0;swimlaneHead=0;swimlaneBody=0;top=0;left=0;strokeColor=inherit;' +
  5843. 'bottom=0;right=0;dropTarget=0;fontStyle=0;fillColor=none;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;startSize=40;' + s;
  5844. firstCellStyle = (firstCellStyle != null) ? firstCellStyle : 'swimlane;swimlaneHead=0;swimlaneBody=0;fontStyle=0;strokeColor=inherit;' +
  5845. 'connectable=0;fillColor=none;startSize=40;' + s;
  5846. cellStyle = (cellStyle != null) ? cellStyle : 'swimlane;swimlaneHead=0;swimlaneBody=0;fontStyle=0;connectable=0;strokeColor=inherit;' +
  5847. 'fillColor=none;startSize=0;' + s;
  5848. var table = this.createVertex(null, null, (title != null) ? title : '', 0, 0,
  5849. colCount * w, rowCount * h, tableStyle);
  5850. var t = mxUtils.getValue(this.getCellStyle(table), mxConstants.STYLE_STARTSIZE,
  5851. mxConstants.DEFAULT_STARTSIZE);
  5852. table.geometry.width += t;
  5853. table.geometry.height += t;
  5854. var row = this.createVertex(null, null, '', 0, t, colCount * w + t, h, rowStyle);
  5855. table.insert(this.createParent(row, this.createVertex(null, null,
  5856. '', t, 0, w, h, firstCellStyle), colCount, w, 0));
  5857. if (rowCount > 1)
  5858. {
  5859. row.geometry.y = h + t;
  5860. return this.createParent(table, this.createParent(row,
  5861. this.createVertex(null, null, '', t, 0, w, h, cellStyle),
  5862. colCount, w, 0), rowCount - 1, 0, h);
  5863. }
  5864. else
  5865. {
  5866. return table;
  5867. }
  5868. };
  5869. /**
  5870. * Returns the row and column lines for the given table.
  5871. */
  5872. Graph.prototype.visitTableCells = function(cell, visitor)
  5873. {
  5874. var lastRow = null;
  5875. var rows = this.model.getChildCells(cell, true);
  5876. var start = this.getActualStartSize(cell, true);
  5877. for (var i = 0; i < rows.length; i++)
  5878. {
  5879. var rowStart = this.getActualStartSize(rows[i], true);
  5880. var cols = this.model.getChildCells(rows[i], true);
  5881. var rowStyle = this.getCellStyle(rows[i], true);
  5882. var lastCol = null;
  5883. var row = [];
  5884. for (var j = 0; j < cols.length; j++)
  5885. {
  5886. var geo = this.getCellGeometry(cols[j]);
  5887. var col = {cell: cols[j], rospan: 1, colspan: 1, row: i, col: j, geo: geo};
  5888. geo = (geo.alternateBounds != null) ? geo.alternateBounds : geo;
  5889. col.point = new mxPoint(geo.width + (lastCol != null ? lastCol.point.x : start.x + rowStart.x),
  5890. geo.height + (lastRow != null && lastRow[0] != null ? lastRow[0].point.y : start.y + rowStart.y));
  5891. col.actual = col;
  5892. if (lastRow != null && lastRow[j] != null && lastRow[j].rowspan > 1)
  5893. {
  5894. col.rowspan = lastRow[j].rowspan - 1;
  5895. col.colspan = lastRow[j].colspan;
  5896. col.actual = lastRow[j].actual;
  5897. }
  5898. else
  5899. {
  5900. if (lastCol != null && lastCol.colspan > 1)
  5901. {
  5902. col.rowspan = lastCol.rowspan;
  5903. col.colspan = lastCol.colspan - 1;
  5904. col.actual = lastCol.actual;
  5905. }
  5906. else
  5907. {
  5908. var style = this.getCurrentCellStyle(cols[j], true);
  5909. if (style != null)
  5910. {
  5911. col.rowspan = parseInt(style['rowspan'] || 1);
  5912. col.colspan = parseInt(style['colspan'] || 1);
  5913. }
  5914. }
  5915. }
  5916. var head = mxUtils.getValue(rowStyle, mxConstants.STYLE_SWIMLANE_HEAD, 1) == 1 &&
  5917. mxUtils.getValue(rowStyle, mxConstants.STYLE_STROKECOLOR,
  5918. mxConstants.NONE) != mxConstants.NONE;
  5919. visitor(col, cols.length, rows.length,
  5920. start.x + ((head) ? rowStart.x : 0),
  5921. start.y + ((head) ? rowStart.y : 0));
  5922. row.push(col);
  5923. lastCol = col;
  5924. }
  5925. lastRow = row;
  5926. }
  5927. };
  5928. /**
  5929. * Returns the row and column lines for the given table.
  5930. */
  5931. Graph.prototype.getTableLines = function(cell, horizontal, vertical)
  5932. {
  5933. var hl = [];
  5934. var vl = [];
  5935. if (horizontal || vertical)
  5936. {
  5937. this.visitTableCells(cell, mxUtils.bind(this, function(iter, colCount, rowCount, x0, y0)
  5938. {
  5939. // Constructs horizontal lines
  5940. if (horizontal && iter.row < rowCount - 1)
  5941. {
  5942. if (hl[iter.row] == null)
  5943. {
  5944. hl[iter.row] = [new mxPoint(x0, iter.point.y)];
  5945. }
  5946. if (iter.rowspan > 1)
  5947. {
  5948. hl[iter.row].push(null);
  5949. }
  5950. hl[iter.row].push(iter.point);
  5951. }
  5952. // Constructs vertical lines
  5953. if (vertical && iter.col < colCount - 1)
  5954. {
  5955. if (vl[iter.col] == null)
  5956. {
  5957. vl[iter.col] = [new mxPoint(iter.point.x, y0)];
  5958. }
  5959. if (iter.colspan > 1)
  5960. {
  5961. vl[iter.col].push(null);
  5962. }
  5963. vl[iter.col].push(iter.point);
  5964. }
  5965. }));
  5966. }
  5967. return hl.concat(vl);
  5968. };
  5969. /**
  5970. * Returns true if the given cell is a table cell.
  5971. */
  5972. Graph.prototype.isTableCell = function(cell)
  5973. {
  5974. return this.model.isVertex(cell) && this.isTableRow(this.model.getParent(cell));
  5975. };
  5976. /**
  5977. * Returns true if the given cell is a table row.
  5978. */
  5979. Graph.prototype.isTableRow = function(cell)
  5980. {
  5981. return this.model.isVertex(cell) && this.isTable(this.model.getParent(cell));
  5982. };
  5983. /**
  5984. * Returns true if the given cell is a table.
  5985. */
  5986. Graph.prototype.isTable = function(cell)
  5987. {
  5988. var style = this.getCellStyle(cell);
  5989. return style != null && style['childLayout'] == 'tableLayout';
  5990. };
  5991. /**
  5992. * Returns true if the given cell is a table.
  5993. */
  5994. Graph.prototype.isStack = function(cell)
  5995. {
  5996. var style = this.getCellStyle(cell);
  5997. return style != null && style['childLayout'] == 'stackLayout';
  5998. };
  5999. /**
  6000. * Returns true if the given cell is a table row.
  6001. */
  6002. Graph.prototype.isStackChild = function(cell)
  6003. {
  6004. return this.model.isVertex(cell) && this.isStack(this.model.getParent(cell));
  6005. };
  6006. /**
  6007. * Updates the row and table heights.
  6008. */
  6009. Graph.prototype.setTableRowHeight = function(row, dy, extend)
  6010. {
  6011. extend = (extend != null) ? extend : true;
  6012. var model = this.getModel();
  6013. model.beginUpdate();
  6014. try
  6015. {
  6016. var rgeo = this.getCellGeometry(row);
  6017. // Sets height of row
  6018. if (rgeo != null)
  6019. {
  6020. rgeo = rgeo.clone();
  6021. rgeo.height += dy;
  6022. model.setGeometry(row, rgeo);
  6023. var table = model.getParent(row);
  6024. var rows = model.getChildCells(table, true);
  6025. // Shifts and resizes neighbor row
  6026. if (!extend)
  6027. {
  6028. var index = mxUtils.indexOf(rows, row);
  6029. if (index < rows.length - 1)
  6030. {
  6031. var nextRow = rows[index + 1];
  6032. var geo = this.getCellGeometry(nextRow);
  6033. if (geo != null)
  6034. {
  6035. geo = geo.clone();
  6036. geo.y += dy;
  6037. geo.height -= dy;
  6038. model.setGeometry(nextRow, geo);
  6039. }
  6040. }
  6041. }
  6042. // Updates height of table
  6043. var tgeo = this.getCellGeometry(table);
  6044. if (tgeo != null)
  6045. {
  6046. // Always extends for last row
  6047. if (!extend)
  6048. {
  6049. extend = row == rows[rows.length - 1];
  6050. }
  6051. if (extend)
  6052. {
  6053. tgeo = tgeo.clone();
  6054. tgeo.height += dy;
  6055. model.setGeometry(table, tgeo);
  6056. }
  6057. }
  6058. }
  6059. }
  6060. finally
  6061. {
  6062. model.endUpdate();
  6063. }
  6064. };
  6065. /**
  6066. * Updates column width and row height.
  6067. */
  6068. Graph.prototype.setTableColumnWidth = function(col, dx, extend)
  6069. {
  6070. extend = (extend != null) ? extend : false;
  6071. var model = this.getModel();
  6072. var row = model.getParent(col);
  6073. var table = model.getParent(row);
  6074. var cells = model.getChildCells(row, true);
  6075. var index = mxUtils.indexOf(cells, col);
  6076. var lastColumn = index == cells.length - 1;
  6077. model.beginUpdate();
  6078. try
  6079. {
  6080. // Sets width of child cell
  6081. var rows = model.getChildCells(table, true);
  6082. for (var i = 0; i < rows.length; i++)
  6083. {
  6084. row = rows[i];
  6085. cells = model.getChildCells(row, true);
  6086. var cell = cells[index];
  6087. var geo = this.getCellGeometry(cell);
  6088. if (geo != null)
  6089. {
  6090. geo = geo.clone();
  6091. geo.width += dx;
  6092. if (geo.alternateBounds != null)
  6093. {
  6094. geo.alternateBounds.width += dx;
  6095. }
  6096. model.setGeometry(cell, geo);
  6097. }
  6098. // Shifts and resizes neighbor column
  6099. if (index < cells.length - 1)
  6100. {
  6101. cell = cells[index + 1];
  6102. var geo = this.getCellGeometry(cell);
  6103. if (geo != null)
  6104. {
  6105. geo = geo.clone();
  6106. geo.x += dx;
  6107. if (!extend)
  6108. {
  6109. geo.width -= dx;
  6110. if (geo.alternateBounds != null)
  6111. {
  6112. geo.alternateBounds.width -= dx;
  6113. }
  6114. }
  6115. model.setGeometry(cell, geo);
  6116. }
  6117. }
  6118. }
  6119. if (lastColumn || extend)
  6120. {
  6121. // Updates width of table
  6122. var tgeo = this.getCellGeometry(table);
  6123. if (tgeo != null)
  6124. {
  6125. tgeo = tgeo.clone();
  6126. tgeo.width += dx;
  6127. model.setGeometry(table, tgeo);
  6128. }
  6129. }
  6130. if (this.layoutManager != null)
  6131. {
  6132. this.layoutManager.executeLayout(table);
  6133. }
  6134. }
  6135. finally
  6136. {
  6137. model.endUpdate();
  6138. }
  6139. };
  6140. /**
  6141. * Special Layout for tables.
  6142. */
  6143. function TableLayout(graph)
  6144. {
  6145. mxGraphLayout.call(this, graph);
  6146. };
  6147. /**
  6148. * Extends mxGraphLayout.
  6149. */
  6150. TableLayout.prototype = new mxStackLayout();
  6151. TableLayout.prototype.constructor = TableLayout;
  6152. /**
  6153. * Function: isHorizontal
  6154. *
  6155. * Overrides stack layout to handle row reorder.
  6156. */
  6157. TableLayout.prototype.isHorizontal = function()
  6158. {
  6159. return false;
  6160. };
  6161. /**
  6162. * Function: isVertexIgnored
  6163. *
  6164. * Overrides to allow for table rows and cells.
  6165. */
  6166. TableLayout.prototype.isVertexIgnored = function(vertex)
  6167. {
  6168. return !this.graph.getModel().isVertex(vertex) ||
  6169. !this.graph.isCellVisible(vertex);
  6170. };
  6171. /**
  6172. * Function: getSize
  6173. *
  6174. * Returns the total vertical or horizontal size of the given cells.
  6175. */
  6176. TableLayout.prototype.getSize = function(cells, horizontal)
  6177. {
  6178. var total = 0;
  6179. for (var i = 0; i < cells.length; i++)
  6180. {
  6181. if (!this.isVertexIgnored(cells[i]))
  6182. {
  6183. var geo = this.graph.getCellGeometry(cells[i]);
  6184. if (geo != null)
  6185. {
  6186. total += (horizontal) ? geo.width : geo.height;
  6187. }
  6188. }
  6189. }
  6190. return total;
  6191. };
  6192. /**
  6193. * Function: getRowLayout
  6194. *
  6195. * Returns the column positions for the given row and table width.
  6196. */
  6197. TableLayout.prototype.getRowLayout = function(row, width)
  6198. {
  6199. var cells = this.graph.model.getChildCells(row, true);
  6200. var off = this.graph.getActualStartSize(row, true);
  6201. var sw = this.getSize(cells, true);
  6202. var rw = width - off.x - off.width;
  6203. var result = [];
  6204. var x = off.x;
  6205. for (var i = 0; i < cells.length; i++)
  6206. {
  6207. var geo = this.graph.getCellGeometry(cells[i]);
  6208. if (geo != null)
  6209. {
  6210. x += (geo.alternateBounds != null ?
  6211. geo.alternateBounds.width :
  6212. geo.width) * rw / sw;
  6213. result.push(Math.round(x));
  6214. }
  6215. }
  6216. return result;
  6217. };
  6218. /**
  6219. * Function: layoutRow
  6220. *
  6221. * Places the cells at the given positions in the given row.
  6222. */
  6223. TableLayout.prototype.layoutRow = function(row, positions, height, tw)
  6224. {
  6225. var model = this.graph.getModel();
  6226. var cells = model.getChildCells(row, true);
  6227. var off = this.graph.getActualStartSize(row, true);
  6228. var x = off.x;
  6229. var sw = 0;
  6230. if (positions != null)
  6231. {
  6232. positions = positions.slice();
  6233. positions.splice(0, 0, off.x);
  6234. }
  6235. for (var i = 0; i < cells.length; i++)
  6236. {
  6237. var geo = this.graph.getCellGeometry(cells[i]);
  6238. if (geo != null)
  6239. {
  6240. geo = geo.clone();
  6241. geo.y = off.y;
  6242. geo.height = height - off.y - off.height;
  6243. if (positions != null)
  6244. {
  6245. geo.x = positions[i];
  6246. geo.width = positions[i + 1] - geo.x;
  6247. // Fills with last geo if not enough cells
  6248. if (i == cells.length - 1 && i < positions.length - 2)
  6249. {
  6250. geo.width = tw - geo.x - off.x - off.width;
  6251. }
  6252. }
  6253. else
  6254. {
  6255. geo.x = x;
  6256. x += geo.width;
  6257. if (i == cells.length - 1)
  6258. {
  6259. geo.width = tw - off.x - off.width - sw;
  6260. }
  6261. else
  6262. {
  6263. sw += geo.width;
  6264. }
  6265. }
  6266. geo.alternateBounds = new mxRectangle(0, 0, geo.width, geo.height);
  6267. model.setGeometry(cells[i], geo);
  6268. }
  6269. }
  6270. return sw;
  6271. };
  6272. /**
  6273. * Function: execute
  6274. *
  6275. * Implements <mxGraphLayout.execute>.
  6276. */
  6277. TableLayout.prototype.execute = function(parent)
  6278. {
  6279. if (parent != null)
  6280. {
  6281. var offset = this.graph.getActualStartSize(parent, true);
  6282. var table = this.graph.getCellGeometry(parent);
  6283. var style = this.graph.getCellStyle(parent);
  6284. var resizeLastRow = mxUtils.getValue(style,
  6285. 'resizeLastRow', '0') == '1';
  6286. var resizeLast = mxUtils.getValue(style,
  6287. 'resizeLast', '0') == '1';
  6288. var fixedRows = mxUtils.getValue(style,
  6289. 'fixedRows', '0') == '1';
  6290. var model = this.graph.getModel();
  6291. var sw = 0;
  6292. model.beginUpdate();
  6293. try
  6294. {
  6295. var th = table.height - offset.y - offset.height;
  6296. var tw = table.width - offset.x - offset.width;
  6297. var rows = model.getChildCells(parent, true);
  6298. // Updates row visibilities
  6299. for (var i = 0; i < rows.length; i++)
  6300. {
  6301. model.setVisible(rows[i], true);
  6302. }
  6303. var sh = this.getSize(rows, false);
  6304. if (th > 0 && tw > 0 && rows.length > 0 && sh > 0)
  6305. {
  6306. if (resizeLastRow)
  6307. {
  6308. var row = this.graph.getCellGeometry(rows[rows.length - 1]);
  6309. if (row != null)
  6310. {
  6311. row = row.clone();
  6312. row.height = th - sh + row.height;
  6313. model.setGeometry(rows[rows.length - 1], row);
  6314. }
  6315. }
  6316. var pos = (resizeLast) ? null : this.getRowLayout(rows[0], tw);
  6317. var lastCells = [];
  6318. var y = offset.y;
  6319. // Updates row geometries
  6320. for (var i = 0; i < rows.length; i++)
  6321. {
  6322. var row = this.graph.getCellGeometry(rows[i]);
  6323. if (row != null)
  6324. {
  6325. row = row.clone();
  6326. row.x = offset.x;
  6327. row.width = tw;
  6328. row.y = Math.round(y);
  6329. if (resizeLastRow || fixedRows)
  6330. {
  6331. y += row.height;
  6332. }
  6333. else
  6334. {
  6335. y += (row.height / sh) * th;
  6336. }
  6337. row.height = Math.round(y) - row.y;
  6338. model.setGeometry(rows[i], row);
  6339. }
  6340. // Updates cell geometries
  6341. sw = Math.max(sw, this.layoutRow(rows[i], pos, row.height, tw, lastCells));
  6342. }
  6343. if (fixedRows && th < sh)
  6344. {
  6345. table = table.clone();
  6346. table.height = y + offset.height;
  6347. model.setGeometry(parent, table);
  6348. }
  6349. if (resizeLast && tw < sw + Graph.minTableColumnWidth)
  6350. {
  6351. table = table.clone();
  6352. table.width = sw + offset.width + offset.x + Graph.minTableColumnWidth;
  6353. model.setGeometry(parent, table);
  6354. }
  6355. // All geometries cloned at this point so can change in-place below
  6356. this.graph.visitTableCells(parent, mxUtils.bind(this, function(iter)
  6357. {
  6358. model.setVisible(iter.cell, iter.actual.cell == iter.cell);
  6359. if (iter.actual.cell != iter.cell)
  6360. {
  6361. if (iter.actual.row == iter.row)
  6362. {
  6363. var g = (iter.geo.alternateBounds != null) ?
  6364. iter.geo.alternateBounds : iter.geo;
  6365. iter.actual.geo.width += g.width;
  6366. }
  6367. if (iter.actual.col == iter.col)
  6368. {
  6369. var g = (iter.geo.alternateBounds != null) ?
  6370. iter.geo.alternateBounds : iter.geo;
  6371. iter.actual.geo.height += g.height;
  6372. }
  6373. }
  6374. }));
  6375. }
  6376. else
  6377. {
  6378. // Updates row visibilities
  6379. for (var i = 0; i < rows.length; i++)
  6380. {
  6381. model.setVisible(rows[i], false);
  6382. }
  6383. }
  6384. }
  6385. finally
  6386. {
  6387. model.endUpdate();
  6388. }
  6389. }
  6390. };
  6391. (function()
  6392. {
  6393. /**
  6394. * Reset the list of processed edges.
  6395. */
  6396. var mxGraphViewResetValidationState = mxGraphView.prototype.resetValidationState;
  6397. mxGraphView.prototype.resetValidationState = function()
  6398. {
  6399. mxGraphViewResetValidationState.apply(this, arguments);
  6400. this.validEdges = [];
  6401. };
  6402. /**
  6403. * Updates jumps for valid edges and repaints if needed.
  6404. */
  6405. var mxGraphViewValidateCellState = mxGraphView.prototype.validateCellState;
  6406. mxGraphView.prototype.validateCellState = function(cell, recurse)
  6407. {
  6408. recurse = (recurse != null) ? recurse : true;
  6409. var state = this.getState(cell);
  6410. // Forces repaint if jumps change on a valid edge
  6411. if (state != null && recurse && this.graph.model.isEdge(state.cell) &&
  6412. state.style != null && state.style[mxConstants.STYLE_CURVED] != 1 &&
  6413. !state.invalid && this.updateLineJumps(state))
  6414. {
  6415. this.graph.cellRenderer.redraw(state, false, this.isRendering());
  6416. }
  6417. state = mxGraphViewValidateCellState.apply(this, arguments);
  6418. // Adds to the list of edges that may intersect with later edges
  6419. if (state != null && recurse && this.graph.model.isEdge(state.cell) &&
  6420. state.style != null && state.style[mxConstants.STYLE_CURVED] != 1)
  6421. {
  6422. // LATER: Reuse jumps for valid edges
  6423. this.validEdges.push(state);
  6424. }
  6425. return state;
  6426. };
  6427. /**
  6428. * Overrides paint to add flowAnimation style.
  6429. */
  6430. var mxShapePaint = mxShape.prototype.paint;
  6431. mxShape.prototype.paint = function()
  6432. {
  6433. mxShapePaint.apply(this, arguments);
  6434. if (this.state != null && this.node != null &&
  6435. this.state.view.graph.enableFlowAnimation &&
  6436. this.state.view.graph.model.isEdge(this.state.cell) &&
  6437. mxUtils.getValue(this.state.style, 'flowAnimation', '0') == '1')
  6438. {
  6439. var paths = this.node.getElementsByTagName('path');
  6440. if (paths.length > 1)
  6441. {
  6442. if (mxUtils.getValue(this.state.style, mxConstants.STYLE_DASHED, '0') != '1')
  6443. {
  6444. paths[1].setAttribute('stroke-dasharray', (this.state.view.scale * 8));
  6445. }
  6446. var anim = this.state.view.graph.getFlowAnimationStyle();
  6447. if (anim != null)
  6448. {
  6449. paths[1].setAttribute('class', anim.getAttribute('id'));
  6450. }
  6451. }
  6452. }
  6453. };
  6454. /**
  6455. * Forces repaint if routed points have changed.
  6456. */
  6457. var mxCellRendererIsShapeInvalid = mxCellRenderer.prototype.isShapeInvalid;
  6458. mxCellRenderer.prototype.isShapeInvalid = function(state, shape)
  6459. {
  6460. return mxCellRendererIsShapeInvalid.apply(this, arguments) ||
  6461. (state.routedPoints != null && shape.routedPoints != null &&
  6462. !mxUtils.equalPoints(shape.routedPoints, state.routedPoints))
  6463. };
  6464. /**
  6465. * Updates jumps for invalid edges.
  6466. */
  6467. var mxGraphViewUpdateCellState = mxGraphView.prototype.updateCellState;
  6468. mxGraphView.prototype.updateCellState = function(state)
  6469. {
  6470. mxGraphViewUpdateCellState.apply(this, arguments);
  6471. // Updates jumps on invalid edge before repaint
  6472. if (this.graph.model.isEdge(state.cell) &&
  6473. state.style[mxConstants.STYLE_CURVED] != 1)
  6474. {
  6475. this.updateLineJumps(state);
  6476. }
  6477. };
  6478. /**
  6479. * Updates the jumps between given state and processed edges.
  6480. */
  6481. mxGraphView.prototype.updateLineJumps = function(state)
  6482. {
  6483. var pts = state.absolutePoints;
  6484. if (Graph.lineJumpsEnabled)
  6485. {
  6486. var changed = state.routedPoints != null;
  6487. var actual = null;
  6488. if (pts != null && this.validEdges != null &&
  6489. mxUtils.getValue(state.style, 'jumpStyle', 'none') !== 'none')
  6490. {
  6491. var thresh = 0.5 * this.scale;
  6492. changed = false;
  6493. actual = [];
  6494. // Type 0 means normal waypoint, 1 means jump
  6495. function addPoint(type, x, y)
  6496. {
  6497. var rpt = new mxPoint(x, y);
  6498. rpt.type = type;
  6499. actual.push(rpt);
  6500. var curr = (state.routedPoints != null) ? state.routedPoints[actual.length - 1] : null;
  6501. return curr == null || curr.type != type || curr.x != x || curr.y != y;
  6502. };
  6503. for (var i = 0; i < pts.length - 1; i++)
  6504. {
  6505. var p1 = pts[i + 1];
  6506. var p0 = pts[i];
  6507. var list = [];
  6508. // Ignores waypoints on straight segments
  6509. var pn = pts[i + 2];
  6510. while (i < pts.length - 2 &&
  6511. mxUtils.ptSegDistSq(p0.x, p0.y, pn.x, pn.y,
  6512. p1.x, p1.y) < 1 * this.scale * this.scale)
  6513. {
  6514. p1 = pn;
  6515. i++;
  6516. pn = pts[i + 2];
  6517. }
  6518. changed = addPoint(0, p0.x, p0.y) || changed;
  6519. // Processes all previous edges
  6520. for (var e = 0; e < this.validEdges.length; e++)
  6521. {
  6522. var state2 = this.validEdges[e];
  6523. var pts2 = state2.absolutePoints;
  6524. if (pts2 != null && mxUtils.intersects(state, state2) && state2.style['noJump'] != '1')
  6525. {
  6526. // Compares each segment of the edge with the current segment
  6527. for (var j = 0; j < pts2.length - 1; j++)
  6528. {
  6529. var p3 = pts2[j + 1];
  6530. var p2 = pts2[j];
  6531. // Ignores waypoints on straight segments
  6532. pn = pts2[j + 2];
  6533. while (j < pts2.length - 2 &&
  6534. mxUtils.ptSegDistSq(p2.x, p2.y, pn.x, pn.y,
  6535. p3.x, p3.y) < 1 * this.scale * this.scale)
  6536. {
  6537. p3 = pn;
  6538. j++;
  6539. pn = pts2[j + 2];
  6540. }
  6541. var pt = mxUtils.intersection(p0.x, p0.y, p1.x, p1.y, p2.x, p2.y, p3.x, p3.y);
  6542. // Handles intersection between two segments
  6543. if (pt != null && (Math.abs(pt.x - p0.x) > thresh ||
  6544. Math.abs(pt.y - p0.y) > thresh) &&
  6545. (Math.abs(pt.x - p1.x) > thresh ||
  6546. Math.abs(pt.y - p1.y) > thresh))
  6547. {
  6548. var dx = pt.x - p0.x;
  6549. var dy = pt.y - p0.y;
  6550. var temp = {distSq: dx * dx + dy * dy, x: pt.x, y: pt.y};
  6551. // Intersections must be ordered by distance from start of segment
  6552. for (var t = 0; t < list.length; t++)
  6553. {
  6554. if (list[t].distSq > temp.distSq)
  6555. {
  6556. list.splice(t, 0, temp);
  6557. temp = null;
  6558. break;
  6559. }
  6560. }
  6561. // Ignores multiple intersections at segment joint
  6562. if (temp != null && (list.length == 0 ||
  6563. list[list.length - 1].x !== temp.x ||
  6564. list[list.length - 1].y !== temp.y))
  6565. {
  6566. list.push(temp);
  6567. }
  6568. }
  6569. }
  6570. }
  6571. }
  6572. // Adds ordered intersections to routed points
  6573. for (var j = 0; j < list.length; j++)
  6574. {
  6575. changed = addPoint(1, list[j].x, list[j].y) || changed;
  6576. }
  6577. }
  6578. var pt = pts[pts.length - 1];
  6579. changed = addPoint(0, pt.x, pt.y) || changed;
  6580. }
  6581. state.routedPoints = actual;
  6582. return changed;
  6583. }
  6584. else
  6585. {
  6586. return false;
  6587. }
  6588. };
  6589. /**
  6590. * Overrides painting the actual shape for taking into account jump style.
  6591. */
  6592. var mxConnectorPaintLine = mxConnector.prototype.paintLine;
  6593. mxConnector.prototype.paintLine = function (c, absPts, rounded)
  6594. {
  6595. // Required for checking dirty state
  6596. this.routedPoints = (this.state != null) ? this.state.routedPoints : null;
  6597. if (this.outline || this.state == null || this.style == null ||
  6598. this.state.routedPoints == null || this.state.routedPoints.length == 0)
  6599. {
  6600. mxConnectorPaintLine.apply(this, arguments);
  6601. }
  6602. else
  6603. {
  6604. var arcSize = mxUtils.getValue(this.style, mxConstants.STYLE_ARCSIZE,
  6605. mxConstants.LINE_ARCSIZE) / 2;
  6606. var size = (parseInt(mxUtils.getValue(this.style, 'jumpSize',
  6607. Graph.defaultJumpSize)) - 2) / 2 + this.strokewidth;
  6608. var style = mxUtils.getValue(this.style, 'jumpStyle', 'none');
  6609. var moveTo = true;
  6610. var last = null;
  6611. var len = null;
  6612. var pts = [];
  6613. var n = null;
  6614. c.begin();
  6615. for (var i = 0; i < this.state.routedPoints.length; i++)
  6616. {
  6617. var rpt = this.state.routedPoints[i];
  6618. var pt = new mxPoint(rpt.x / this.scale, rpt.y / this.scale);
  6619. // Takes first and last point from passed-in array
  6620. if (i == 0)
  6621. {
  6622. pt = absPts[0];
  6623. }
  6624. else if (i == this.state.routedPoints.length - 1)
  6625. {
  6626. pt = absPts[absPts.length - 1];
  6627. }
  6628. var done = false;
  6629. // Type 1 is an intersection
  6630. if (last != null && rpt.type == 1)
  6631. {
  6632. // Checks if next/previous points are too close
  6633. var next = this.state.routedPoints[i + 1];
  6634. var dx = next.x / this.scale - pt.x;
  6635. var dy = next.y / this.scale - pt.y;
  6636. var dist = dx * dx + dy * dy;
  6637. if (n == null)
  6638. {
  6639. n = new mxPoint(pt.x - last.x, pt.y - last.y);
  6640. len = Math.sqrt(n.x * n.x + n.y * n.y);
  6641. if (len > 0)
  6642. {
  6643. n.x = n.x * size / len;
  6644. n.y = n.y * size / len;
  6645. }
  6646. else
  6647. {
  6648. n = null;
  6649. }
  6650. }
  6651. if (dist > size * size && len > 0)
  6652. {
  6653. var dx = last.x - pt.x;
  6654. var dy = last.y - pt.y;
  6655. var dist = dx * dx + dy * dy;
  6656. if (dist > size * size)
  6657. {
  6658. var p0 = new mxPoint(pt.x - n.x, pt.y - n.y);
  6659. var p1 = new mxPoint(pt.x + n.x, pt.y + n.y);
  6660. pts.push(p0);
  6661. this.addPoints(c, pts, rounded, arcSize, false, null, moveTo);
  6662. var f = (Math.round(n.x) < 0 || (Math.round(n.x) == 0
  6663. && Math.round(n.y) <= 0)) ? 1 : -1;
  6664. moveTo = false;
  6665. if (style == 'sharp')
  6666. {
  6667. c.lineTo(p0.x - n.y * f, p0.y + n.x * f);
  6668. c.lineTo(p1.x - n.y * f, p1.y + n.x * f);
  6669. c.lineTo(p1.x, p1.y);
  6670. }
  6671. else if (style == 'line')
  6672. {
  6673. c.moveTo(p0.x + n.y * f, p0.y - n.x * f);
  6674. c.lineTo(p0.x - n.y * f, p0.y + n.x * f);
  6675. c.moveTo(p1.x - n.y * f, p1.y + n.x * f);
  6676. c.lineTo(p1.x + n.y * f, p1.y - n.x * f);
  6677. c.moveTo(p1.x, p1.y);
  6678. }
  6679. else if (style == 'arc')
  6680. {
  6681. f *= 1.3;
  6682. c.curveTo(p0.x - n.y * f, p0.y + n.x * f,
  6683. p1.x - n.y * f, p1.y + n.x * f,
  6684. p1.x, p1.y);
  6685. }
  6686. else
  6687. {
  6688. c.moveTo(p1.x, p1.y);
  6689. moveTo = true;
  6690. }
  6691. pts = [p1];
  6692. done = true;
  6693. }
  6694. }
  6695. }
  6696. else
  6697. {
  6698. n = null;
  6699. }
  6700. if (!done)
  6701. {
  6702. pts.push(pt);
  6703. last = pt;
  6704. }
  6705. }
  6706. this.addPoints(c, pts, rounded, arcSize, false, null, moveTo);
  6707. c.stroke();
  6708. }
  6709. };
  6710. /**
  6711. * Adds support for centerPerimeter which is a special case of a fixed point perimeter.
  6712. */
  6713. var mxGraphViewGetFixedTerminalPoint = mxGraphView.prototype.getFixedTerminalPoint;
  6714. mxGraphView.prototype.getFixedTerminalPoint = function(edge, terminal, source, constraint)
  6715. {
  6716. if (terminal != null && terminal.style[mxConstants.STYLE_PERIMETER] == 'centerPerimeter')
  6717. {
  6718. return new mxPoint(terminal.getCenterX(), terminal.getCenterY());
  6719. }
  6720. else
  6721. {
  6722. return mxGraphViewGetFixedTerminalPoint.apply(this, arguments);
  6723. }
  6724. };
  6725. /**
  6726. * Adds support for snapToPoint style.
  6727. */
  6728. var mxGraphViewUpdateFloatingTerminalPoint = mxGraphView.prototype.updateFloatingTerminalPoint;
  6729. mxGraphView.prototype.updateFloatingTerminalPoint = function(edge, start, end, source)
  6730. {
  6731. if (start != null && edge != null &&
  6732. (start.style['snapToPoint'] == '1' ||
  6733. edge.style['snapToPoint'] == '1'))
  6734. {
  6735. start = this.getTerminalPort(edge, start, source);
  6736. var next = this.getNextPoint(edge, end, source);
  6737. var orth = this.graph.isOrthogonal(edge);
  6738. var alpha = mxUtils.toRadians(Number(start.style[mxConstants.STYLE_ROTATION] || '0'));
  6739. var center = new mxPoint(start.getCenterX(), start.getCenterY());
  6740. if (alpha != 0)
  6741. {
  6742. var cos = Math.cos(-alpha);
  6743. var sin = Math.sin(-alpha);
  6744. next = mxUtils.getRotatedPoint(next, cos, sin, center);
  6745. }
  6746. var border = parseFloat(edge.style[mxConstants.STYLE_PERIMETER_SPACING] || 0);
  6747. border += parseFloat(edge.style[(source) ?
  6748. mxConstants.STYLE_SOURCE_PERIMETER_SPACING :
  6749. mxConstants.STYLE_TARGET_PERIMETER_SPACING] || 0);
  6750. var pt = this.getPerimeterPoint(start, next, alpha == 0 && orth, border);
  6751. if (alpha != 0)
  6752. {
  6753. var cos = Math.cos(alpha);
  6754. var sin = Math.sin(alpha);
  6755. pt = mxUtils.getRotatedPoint(pt, cos, sin, center);
  6756. }
  6757. edge.setAbsoluteTerminalPoint(this.snapToAnchorPoint(edge, start, end, source, pt), source);
  6758. }
  6759. else
  6760. {
  6761. mxGraphViewUpdateFloatingTerminalPoint.apply(this, arguments);
  6762. }
  6763. };
  6764. mxGraphView.prototype.snapToAnchorPoint = function(edge, start, end, source, pt)
  6765. {
  6766. if (start != null && edge != null)
  6767. {
  6768. var constraints = this.graph.getAllConnectionConstraints(start)
  6769. var nearest = null;
  6770. var dist = null;
  6771. if (constraints != null)
  6772. {
  6773. for (var i = 0; i < constraints.length; i++)
  6774. {
  6775. var cp = this.graph.getConnectionPoint(start, constraints[i]);
  6776. if (cp != null)
  6777. {
  6778. var tmp = (cp.x - pt.x) * (cp.x - pt.x) + (cp.y - pt.y) * (cp.y - pt.y);
  6779. if (dist == null || tmp < dist)
  6780. {
  6781. nearest = cp;
  6782. dist = tmp;
  6783. }
  6784. }
  6785. }
  6786. }
  6787. if (nearest != null)
  6788. {
  6789. pt = nearest;
  6790. }
  6791. }
  6792. return pt;
  6793. };
  6794. /**
  6795. * Adds support for placeholders in text elements of shapes.
  6796. */
  6797. var mxStencilEvaluateTextAttribute = mxStencil.prototype.evaluateTextAttribute;
  6798. mxStencil.prototype.evaluateTextAttribute = function(node, attribute, shape)
  6799. {
  6800. var result = mxStencilEvaluateTextAttribute.apply(this, arguments);
  6801. var placeholders = node.getAttribute('placeholders');
  6802. if (placeholders == '1' && shape.state != null)
  6803. {
  6804. result = shape.state.view.graph.replacePlaceholders(shape.state.cell, result);
  6805. }
  6806. return result;
  6807. };
  6808. /**
  6809. * Adds custom stencils defined via shape=stencil(value) style. The value is a base64 encoded, compressed and
  6810. * URL encoded XML definition of the shape according to the stencil definition language of mxGraph.
  6811. *
  6812. * Needs to be in this file to make sure its part of the embed client code. Also the check for ZLib is
  6813. * different than for the Editor code.
  6814. */
  6815. var mxCellRendererCreateShape = mxCellRenderer.prototype.createShape;
  6816. mxCellRenderer.prototype.createShape = function(state)
  6817. {
  6818. if (state.style != null && typeof(pako) !== 'undefined')
  6819. {
  6820. var shape = mxUtils.getValue(state.style, mxConstants.STYLE_SHAPE, null);
  6821. // Extracts and decodes stencil XML if shape has the form shape=stencil(value)
  6822. if (shape != null && typeof shape === 'string' && shape.substring(0, 8) == 'stencil(')
  6823. {
  6824. try
  6825. {
  6826. var stencil = shape.substring(8, shape.length - 1);
  6827. var doc = mxUtils.parseXml(Graph.decompress(stencil));
  6828. return new mxShape(new mxStencil(doc.documentElement));
  6829. }
  6830. catch (e)
  6831. {
  6832. if (window.console != null)
  6833. {
  6834. console.log('Error in shape: ' + e);
  6835. }
  6836. }
  6837. }
  6838. }
  6839. return mxCellRendererCreateShape.apply(this, arguments);
  6840. };
  6841. })();
  6842. /**
  6843. * Overrides stencil registry for dynamic loading of stencils.
  6844. */
  6845. /**
  6846. * Maps from library names to an array of Javascript filenames,
  6847. * which are synchronously loaded. Currently only stencil files
  6848. * (.xml) and JS files (.js) are supported.
  6849. * IMPORTANT: For embedded diagrams to work entries must also
  6850. * be added in EmbedServlet.java.
  6851. */
  6852. mxStencilRegistry.libraries = {};
  6853. /**
  6854. * Global switch to disable dynamic loading.
  6855. */
  6856. mxStencilRegistry.dynamicLoading = true;
  6857. /**
  6858. * Global switch to disable eval for JS (preload all JS instead).
  6859. */
  6860. mxStencilRegistry.allowEval = true;
  6861. /**
  6862. * Stores all package names that have been dynamically loaded.
  6863. * Each package is only loaded once.
  6864. */
  6865. mxStencilRegistry.packages = [];
  6866. /**
  6867. * Stores all package names that have been dynamically loaded.
  6868. * Each package is only loaded once.
  6869. */
  6870. mxStencilRegistry.filesLoaded = {};
  6871. // Extends the default stencil registry to add dynamic loading
  6872. mxStencilRegistry.getStencil = function(name)
  6873. {
  6874. var result = mxStencilRegistry.stencils[name];
  6875. if (result == null && mxCellRenderer.defaultShapes[name] == null && mxStencilRegistry.dynamicLoading)
  6876. {
  6877. var basename = mxStencilRegistry.getBasenameForStencil(name);
  6878. // Loads stencil files and tries again
  6879. if (basename != null)
  6880. {
  6881. var libs = mxStencilRegistry.libraries[basename];
  6882. if (libs != null)
  6883. {
  6884. if (mxStencilRegistry.packages[basename] == null)
  6885. {
  6886. for (var i = 0; i < libs.length; i++)
  6887. {
  6888. var fname = libs[i];
  6889. if (!mxStencilRegistry.filesLoaded[fname])
  6890. {
  6891. mxStencilRegistry.filesLoaded[fname] = true;
  6892. if (fname.toLowerCase().substring(fname.length - 4, fname.length) == '.xml')
  6893. {
  6894. mxStencilRegistry.loadStencilSet(fname, null);
  6895. }
  6896. else if (fname.toLowerCase().substring(fname.length - 3, fname.length) == '.js')
  6897. {
  6898. try
  6899. {
  6900. if (mxStencilRegistry.allowEval)
  6901. {
  6902. var req = mxUtils.load(fname);
  6903. if (req != null && req.getStatus() >= 200 && req.getStatus() <= 299)
  6904. {
  6905. eval.call(window, req.getText());
  6906. }
  6907. }
  6908. }
  6909. catch (e)
  6910. {
  6911. if (window.console != null)
  6912. {
  6913. console.log('error in getStencil:', name, basename, libs, fname, e);
  6914. }
  6915. }
  6916. }
  6917. else
  6918. {
  6919. // FIXME: This does not yet work as the loading is triggered after
  6920. // the shape was used in the graph, at which point the keys have
  6921. // typically been translated in the calling method.
  6922. //mxResources.add(fname);
  6923. }
  6924. }
  6925. }
  6926. mxStencilRegistry.packages[basename] = 1;
  6927. }
  6928. }
  6929. else
  6930. {
  6931. // Replaces '_-_' with '_'
  6932. basename = basename.replace('_-_', '_');
  6933. mxStencilRegistry.loadStencilSet(STENCIL_PATH + '/' + basename + '.xml', null);
  6934. }
  6935. result = mxStencilRegistry.stencils[name];
  6936. }
  6937. }
  6938. return result;
  6939. };
  6940. // Returns the basename for the given stencil or null if no file must be
  6941. // loaded to render the given stencil.
  6942. mxStencilRegistry.getBasenameForStencil = function(name)
  6943. {
  6944. var tmp = null;
  6945. if (name != null && typeof name === 'string')
  6946. {
  6947. var parts = name.split('.');
  6948. if (parts.length > 0 && parts[0] == 'mxgraph')
  6949. {
  6950. tmp = parts[1];
  6951. for (var i = 2; i < parts.length - 1; i++)
  6952. {
  6953. tmp += '/' + parts[i];
  6954. }
  6955. }
  6956. }
  6957. return tmp;
  6958. };
  6959. // Loads the given stencil set
  6960. mxStencilRegistry.loadStencilSet = function(stencilFile, postStencilLoad, force, async)
  6961. {
  6962. force = (force != null) ? force : false;
  6963. // Uses additional cache for detecting previous load attempts
  6964. var xmlDoc = mxStencilRegistry.packages[stencilFile];
  6965. if (force || xmlDoc == null)
  6966. {
  6967. var install = false;
  6968. if (xmlDoc == null)
  6969. {
  6970. try
  6971. {
  6972. if (async)
  6973. {
  6974. mxStencilRegistry.loadStencil(stencilFile, mxUtils.bind(this, function(xmlDoc2)
  6975. {
  6976. if (xmlDoc2 != null && xmlDoc2.documentElement != null)
  6977. {
  6978. mxStencilRegistry.packages[stencilFile] = xmlDoc2;
  6979. install = true;
  6980. mxStencilRegistry.parseStencilSet(xmlDoc2.documentElement, postStencilLoad, install);
  6981. }
  6982. }));
  6983. return;
  6984. }
  6985. else
  6986. {
  6987. xmlDoc = mxStencilRegistry.loadStencil(stencilFile);
  6988. mxStencilRegistry.packages[stencilFile] = xmlDoc;
  6989. install = true;
  6990. }
  6991. }
  6992. catch (e)
  6993. {
  6994. if (window.console != null)
  6995. {
  6996. console.log('error in loadStencilSet:', stencilFile, e);
  6997. }
  6998. }
  6999. }
  7000. if (xmlDoc != null && xmlDoc.documentElement != null)
  7001. {
  7002. mxStencilRegistry.parseStencilSet(xmlDoc.documentElement, postStencilLoad, install);
  7003. }
  7004. }
  7005. };
  7006. // Loads the given stencil XML file.
  7007. mxStencilRegistry.loadStencil = function(filename, fn)
  7008. {
  7009. if (fn != null)
  7010. {
  7011. var req = mxUtils.get(filename, mxUtils.bind(this, function(req)
  7012. {
  7013. fn((req.getStatus() >= 200 && req.getStatus() <= 299) ? req.getXml() : null);
  7014. }), mxUtils.bind(this, function(req)
  7015. {
  7016. fn(null);
  7017. }));
  7018. }
  7019. else
  7020. {
  7021. return mxUtils.load(filename).getXml();
  7022. }
  7023. };
  7024. // Takes array of strings
  7025. mxStencilRegistry.parseStencilSets = function(stencils)
  7026. {
  7027. for (var i = 0; i < stencils.length; i++)
  7028. {
  7029. mxStencilRegistry.parseStencilSet(mxUtils.parseXml(stencils[i]).documentElement);
  7030. }
  7031. };
  7032. // Parses the given stencil set
  7033. mxStencilRegistry.parseStencilSet = function(root, postStencilLoad, install)
  7034. {
  7035. if (root.nodeName == 'stencils')
  7036. {
  7037. var shapes = root.firstChild;
  7038. while (shapes != null)
  7039. {
  7040. if (shapes.nodeName == 'shapes')
  7041. {
  7042. mxStencilRegistry.parseStencilSet(shapes, postStencilLoad, install);
  7043. }
  7044. shapes = shapes.nextSibling;
  7045. }
  7046. }
  7047. else
  7048. {
  7049. install = (install != null) ? install : true;
  7050. var shape = root.firstChild;
  7051. var packageName = '';
  7052. var name = root.getAttribute('name');
  7053. if (name != null)
  7054. {
  7055. packageName = name + '.';
  7056. }
  7057. while (shape != null)
  7058. {
  7059. if (shape.nodeType == mxConstants.NODETYPE_ELEMENT)
  7060. {
  7061. name = shape.getAttribute('name');
  7062. if (name != null)
  7063. {
  7064. packageName = packageName.toLowerCase();
  7065. var stencilName = name.replace(/ /g,"_");
  7066. if (install)
  7067. {
  7068. mxStencilRegistry.addStencil(packageName + stencilName.toLowerCase(), new mxStencil(shape));
  7069. }
  7070. if (postStencilLoad != null)
  7071. {
  7072. var w = shape.getAttribute('w');
  7073. var h = shape.getAttribute('h');
  7074. w = (w == null) ? 80 : parseInt(w, 10);
  7075. h = (h == null) ? 80 : parseInt(h, 10);
  7076. postStencilLoad(packageName, stencilName, name, w, h);
  7077. }
  7078. }
  7079. }
  7080. shape = shape.nextSibling;
  7081. }
  7082. }
  7083. };
  7084. /**
  7085. * These overrides are only added if mxVertexHandler is defined (ie. not in embedded graph)
  7086. */
  7087. if (typeof mxVertexHandler !== 'undefined')
  7088. {
  7089. (function()
  7090. {
  7091. // Sets colors for handles
  7092. mxConstants.HANDLE_FILLCOLOR = '#29b6f2';
  7093. mxConstants.HANDLE_STROKECOLOR = '#0088cf';
  7094. mxConstants.VERTEX_SELECTION_COLOR = '#00a8ff';
  7095. mxConstants.OUTLINE_COLOR = '#00a8ff';
  7096. mxConstants.OUTLINE_HANDLE_FILLCOLOR = '#99ccff';
  7097. mxConstants.OUTLINE_HANDLE_STROKECOLOR = '#00a8ff';
  7098. mxConstants.CONNECT_HANDLE_FILLCOLOR = '#cee7ff';
  7099. mxConstants.EDGE_SELECTION_COLOR = '#00a8ff';
  7100. mxConstants.DEFAULT_VALID_COLOR = '#00a8ff';
  7101. mxConstants.LABEL_HANDLE_FILLCOLOR = '#cee7ff';
  7102. mxConstants.GUIDE_COLOR = '#0088cf';
  7103. mxConstants.HIGHLIGHT_STROKEWIDTH = 5;
  7104. mxConstants.HIGHLIGHT_OPACITY = 50;
  7105. mxConstants.HIGHLIGHT_SIZE = 5;
  7106. // Sets window decoration icons
  7107. mxWindow.prototype.closeImage = Graph.createSvgImage(18, 10,
  7108. '<path d="M 5 1 L 13 9 M 13 1 L 5 9" stroke="#707070" stroke-width="2"/>').src;
  7109. mxWindow.prototype.minimizeImage = Graph.createSvgImage(14, 10,
  7110. '<path d="M 3 7 L 7 3 L 11 7" stroke="#707070" stroke-width="2" fill="none"/>').src;
  7111. mxWindow.prototype.normalizeImage = Graph.createSvgImage(14, 10,
  7112. '<path d="M 3 3 L 7 7 L 11 3" stroke="#707070" stroke-width="2" fill="none"/>').src;
  7113. mxWindow.prototype.resizeImage = Graph.createSvgImage(10, 10,
  7114. '<path d="Z" stroke="#C0C0C0" stroke-width="1" fill="none"/>').src;
  7115. // Enables snapping to off-grid terminals for edge waypoints
  7116. mxEdgeHandler.prototype.snapToTerminals = true;
  7117. // Enables guides
  7118. mxGraphHandler.prototype.guidesEnabled = true;
  7119. // Removes parents where all child cells are moved out
  7120. mxGraphHandler.prototype.removeEmptyParents = true;
  7121. // Enables fading of rubberband
  7122. mxRubberband.prototype.fadeOut = true;
  7123. // Alt-move disables guides
  7124. mxGuide.prototype.isEnabledForEvent = function(evt)
  7125. {
  7126. return !mxEvent.isAltDown(evt);
  7127. };
  7128. // Ignores all table cells in layouts
  7129. var graphLayoutIsVertexIgnored = mxGraphLayout.prototype.isVertexIgnored;
  7130. mxGraphLayout.prototype.isVertexIgnored = function(vertex)
  7131. {
  7132. return graphLayoutIsVertexIgnored.apply(this, arguments) ||
  7133. this.graph.isTableRow(vertex) || this.graph.isTableCell(vertex);
  7134. };
  7135. // Adds support for ignoreEdge style
  7136. var graphLayoutIsEdgeIgnored = mxGraphLayout.prototype.isEdgeIgnored;
  7137. mxGraphLayout.prototype.isEdgeIgnored = function(edge)
  7138. {
  7139. return graphLayoutIsEdgeIgnored.apply(this, arguments) ||
  7140. this.graph.isEdgeIgnored(edge);
  7141. };
  7142. // Extends connection handler to enable ctrl+drag for cloning source cell
  7143. // since copyOnConnect is now disabled by default
  7144. var mxConnectionHandlerCreateTarget = mxConnectionHandler.prototype.isCreateTarget;
  7145. mxConnectionHandler.prototype.isCreateTarget = function(evt)
  7146. {
  7147. return this.graph.isCloneEvent(evt) != mxConnectionHandlerCreateTarget.apply(this, arguments);
  7148. };
  7149. // Overrides highlight shape for connection points
  7150. mxConstraintHandler.prototype.createHighlightShape = function()
  7151. {
  7152. var hl = new mxEllipse(null, this.highlightColor, this.highlightColor, 0);
  7153. hl.opacity = mxConstants.HIGHLIGHT_OPACITY;
  7154. return hl;
  7155. };
  7156. // Overrides edge preview to use current edge shape and default style
  7157. mxConnectionHandler.prototype.livePreview = true;
  7158. mxConnectionHandler.prototype.cursor = 'crosshair';
  7159. // Uses current edge style for connect preview
  7160. mxConnectionHandler.prototype.createEdgeState = function(me)
  7161. {
  7162. var style = this.graph.createCurrentEdgeStyle();
  7163. var edge = this.graph.createEdge(null, null, null, null, null, style);
  7164. var state = new mxCellState(this.graph.view, edge, this.graph.getCellStyle(edge));
  7165. for (var key in this.graph.currentEdgeStyle)
  7166. {
  7167. state.style[key] = this.graph.currentEdgeStyle[key];
  7168. }
  7169. // Applies newEdgeStyle for preview
  7170. if (this.previous != null)
  7171. {
  7172. var temp = this.previous.style['newEdgeStyle'];
  7173. if (temp != null)
  7174. {
  7175. try
  7176. {
  7177. var styles = JSON.parse(temp);
  7178. for (var key in styles)
  7179. {
  7180. state.style[key] = styles[key];
  7181. }
  7182. }
  7183. catch (e)
  7184. {
  7185. // ignore
  7186. }
  7187. }
  7188. }
  7189. state.style = this.graph.postProcessCellStyle(state.cell, state.style);
  7190. return state;
  7191. };
  7192. // Overrides dashed state with current edge style
  7193. var connectionHandlerCreateShape = mxConnectionHandler.prototype.createShape;
  7194. mxConnectionHandler.prototype.createShape = function()
  7195. {
  7196. var shape = connectionHandlerCreateShape.apply(this, arguments);
  7197. shape.isDashed = this.graph.currentEdgeStyle[mxConstants.STYLE_DASHED] == '1';
  7198. return shape;
  7199. }
  7200. // Overrides live preview to keep current style
  7201. mxConnectionHandler.prototype.updatePreview = function(valid)
  7202. {
  7203. // do not change color of preview
  7204. };
  7205. // Overrides connection handler to ignore edges instead of not allowing connections
  7206. var mxConnectionHandlerCreateMarker = mxConnectionHandler.prototype.createMarker;
  7207. mxConnectionHandler.prototype.createMarker = function()
  7208. {
  7209. var marker = mxConnectionHandlerCreateMarker.apply(this, arguments);
  7210. var markerGetCell = marker.getCell;
  7211. marker.getCell = mxUtils.bind(this, function(me)
  7212. {
  7213. var result = markerGetCell.apply(this, arguments);
  7214. this.error = null;
  7215. return result;
  7216. });
  7217. return marker;
  7218. };
  7219. /**
  7220. *
  7221. */
  7222. Graph.prototype.defaultVertexStyle = {};
  7223. /**
  7224. * Contains the default style for edges.
  7225. */
  7226. Graph.prototype.defaultEdgeStyle = {'edgeStyle': 'orthogonalEdgeStyle', 'rounded': '0',
  7227. 'jettySize': 'auto', 'orthogonalLoop': '1'};
  7228. /**
  7229. * Returns the current edge style as a string.
  7230. */
  7231. Graph.prototype.createCurrentEdgeStyle = function()
  7232. {
  7233. var style = 'edgeStyle=' + (this.currentEdgeStyle['edgeStyle'] || 'none') + ';';
  7234. var keys = ['shape', 'curved', 'rounded', 'comic', 'sketch', 'fillWeight', 'hachureGap',
  7235. 'hachureAngle', 'jiggle', 'disableMultiStroke', 'disableMultiStrokeFill', 'fillStyle',
  7236. 'curveFitting', 'simplification', 'comicStyle', 'jumpStyle', 'jumpSize'];
  7237. for (var i = 0; i < keys.length; i++)
  7238. {
  7239. if (this.currentEdgeStyle[keys[i]] != null)
  7240. {
  7241. style += keys[i] + '=' + this.currentEdgeStyle[keys[i]] + ';';
  7242. }
  7243. }
  7244. // Overrides the global default to match the default edge style
  7245. if (this.currentEdgeStyle['orthogonalLoop'] != null)
  7246. {
  7247. style += 'orthogonalLoop=' + this.currentEdgeStyle['orthogonalLoop'] + ';';
  7248. }
  7249. else if (Graph.prototype.defaultEdgeStyle['orthogonalLoop'] != null)
  7250. {
  7251. style += 'orthogonalLoop=' + Graph.prototype.defaultEdgeStyle['orthogonalLoop'] + ';';
  7252. }
  7253. // Overrides the global default to match the default edge style
  7254. if (this.currentEdgeStyle['jettySize'] != null)
  7255. {
  7256. style += 'jettySize=' + this.currentEdgeStyle['jettySize'] + ';';
  7257. }
  7258. else if (Graph.prototype.defaultEdgeStyle['jettySize'] != null)
  7259. {
  7260. style += 'jettySize=' + Graph.prototype.defaultEdgeStyle['jettySize'] + ';';
  7261. }
  7262. // Special logic for custom property of elbowEdgeStyle
  7263. if (this.currentEdgeStyle['edgeStyle'] == 'elbowEdgeStyle' && this.currentEdgeStyle['elbow'] != null)
  7264. {
  7265. style += 'elbow=' + this.currentEdgeStyle['elbow'] + ';';
  7266. }
  7267. if (this.currentEdgeStyle['html'] != null)
  7268. {
  7269. style += 'html=' + this.currentEdgeStyle['html'] + ';';
  7270. }
  7271. else
  7272. {
  7273. style += 'html=1;';
  7274. }
  7275. return style;
  7276. };
  7277. /**
  7278. * Hook for subclassers.
  7279. */
  7280. Graph.prototype.getPagePadding = function()
  7281. {
  7282. return new mxPoint(0, 0);
  7283. };
  7284. /**
  7285. * Loads the stylesheet for this graph.
  7286. */
  7287. Graph.prototype.loadStylesheet = function()
  7288. {
  7289. var node = (this.themes != null) ? this.themes[this.defaultThemeName] :
  7290. (!mxStyleRegistry.dynamicLoading) ? null :
  7291. mxUtils.load(STYLE_PATH + '/default.xml').getDocumentElement();
  7292. if (node != null)
  7293. {
  7294. var dec = new mxCodec(node.ownerDocument);
  7295. dec.decode(node, this.getStylesheet());
  7296. }
  7297. };
  7298. /**
  7299. * Creates lookup from object IDs to cell IDs.
  7300. */
  7301. Graph.prototype.createCellLookup = function(cells, lookup)
  7302. {
  7303. lookup = (lookup != null) ? lookup : new Object();
  7304. for (var i = 0; i < cells.length; i++)
  7305. {
  7306. var cell = cells[i];
  7307. lookup[mxObjectIdentity.get(cell)] = cell.getId();
  7308. var childCount = this.model.getChildCount(cell);
  7309. for (var j = 0; j < childCount; j++)
  7310. {
  7311. this.createCellLookup([this.model.getChildAt(cell, j)], lookup);
  7312. }
  7313. }
  7314. return lookup;
  7315. };
  7316. /**
  7317. * Creates lookup from original to cloned cell IDs where mapping is
  7318. * the mapping used in cloneCells and lookup is a mapping from
  7319. * object IDs to cell IDs.
  7320. */
  7321. Graph.prototype.createCellMapping = function(mapping, lookup, cellMapping)
  7322. {
  7323. cellMapping = (cellMapping != null) ? cellMapping : new Object();
  7324. for (var objectId in mapping)
  7325. {
  7326. var cellId = lookup[objectId];
  7327. if (cellMapping[cellId] == null)
  7328. {
  7329. // Uses empty string if clone ID was null which means
  7330. // the cell was cloned but not inserted into the model.
  7331. cellMapping[cellId] = mapping[objectId].getId() || '';
  7332. }
  7333. }
  7334. return cellMapping;
  7335. };
  7336. /**
  7337. *
  7338. */
  7339. Graph.prototype.importGraphModel = function(node, dx, dy, crop)
  7340. {
  7341. dx = (dx != null) ? dx : 0;
  7342. dy = (dy != null) ? dy : 0;
  7343. var codec = new mxCodec(node.ownerDocument);
  7344. var tempModel = new mxGraphModel();
  7345. codec.decode(node, tempModel);
  7346. var cells = []
  7347. // Clones cells to remove invalid edges
  7348. var cloneMap = new Object();
  7349. var cellMapping = new Object();
  7350. var layers = tempModel.getChildren(this.cloneCell(tempModel.root,
  7351. this.isCloneInvalidEdges(), cloneMap));
  7352. if (layers != null)
  7353. {
  7354. // Creates lookup from object IDs to cell IDs
  7355. var lookup = this.createCellLookup([tempModel.root]);
  7356. // Uses copy as layers are removed from array inside loop
  7357. layers = layers.slice();
  7358. this.model.beginUpdate();
  7359. try
  7360. {
  7361. // Merges into unlocked current layer if one layer is pasted
  7362. if (layers.length == 1 && !this.isCellLocked(this.getDefaultParent()))
  7363. {
  7364. var children = tempModel.getChildren(layers[0]);
  7365. if (children != null)
  7366. {
  7367. cells = this.moveCells(children,
  7368. dx, dy, false, this.getDefaultParent());
  7369. // Imported default parent maps to local default parent
  7370. cellMapping[tempModel.getChildAt(tempModel.root, 0).getId()] =
  7371. this.getDefaultParent().getId();
  7372. }
  7373. }
  7374. else
  7375. {
  7376. for (var i = 0; i < layers.length; i++)
  7377. {
  7378. var children = this.model.getChildren(this.moveCells(
  7379. [layers[i]], dx, dy, false, this.model.getRoot())[0]);
  7380. if (children != null)
  7381. {
  7382. cells = cells.concat(children);
  7383. }
  7384. }
  7385. }
  7386. if (cells != null)
  7387. {
  7388. // Adds mapping for all cloned entries from imported to local cell ID
  7389. this.createCellMapping(cloneMap, lookup, cellMapping);
  7390. this.updateCustomLinks(cellMapping, cells);
  7391. if (crop)
  7392. {
  7393. if (this.isGridEnabled())
  7394. {
  7395. dx = this.snap(dx);
  7396. dy = this.snap(dy);
  7397. }
  7398. var bounds = this.getBoundingBoxFromGeometry(cells, true);
  7399. if (bounds != null)
  7400. {
  7401. this.moveCells(cells, dx - bounds.x, dy - bounds.y);
  7402. }
  7403. }
  7404. }
  7405. }
  7406. finally
  7407. {
  7408. this.model.endUpdate();
  7409. }
  7410. }
  7411. return cells;
  7412. };
  7413. /**
  7414. * Translates this point by the given vector.
  7415. *
  7416. * @param {number} dx X-coordinate of the translation.
  7417. * @param {number} dy Y-coordinate of the translation.
  7418. */
  7419. Graph.prototype.encodeCells = function(cells)
  7420. {
  7421. var cloneMap = new Object();
  7422. var clones = this.cloneCells(cells, null, cloneMap);
  7423. // Creates a dictionary for fast lookups
  7424. var dict = new mxDictionary();
  7425. for (var i = 0; i < cells.length; i++)
  7426. {
  7427. dict.put(cells[i], true);
  7428. }
  7429. var codec = new mxCodec();
  7430. var model = new mxGraphModel();
  7431. var parent = model.getChildAt(model.getRoot(), 0);
  7432. for (var i = 0; i < clones.length; i++)
  7433. {
  7434. model.add(parent, clones[i]);
  7435. // Checks for orphaned relative children and makes absolute
  7436. var state = this.view.getState(cells[i]);
  7437. if (state != null)
  7438. {
  7439. var geo = this.getCellGeometry(clones[i]);
  7440. if (geo != null && geo.relative && !this.model.isEdge(cells[i]) &&
  7441. dict.get(this.model.getParent(cells[i])) == null)
  7442. {
  7443. geo.offset = null;
  7444. geo.relative = false;
  7445. geo.x = state.x / state.view.scale - state.view.translate.x;
  7446. geo.y = state.y / state.view.scale - state.view.translate.y;
  7447. }
  7448. }
  7449. }
  7450. this.updateCustomLinks(this.createCellMapping(cloneMap,
  7451. this.createCellLookup(cells)), clones);
  7452. return codec.encode(model);
  7453. };
  7454. /**
  7455. * Overridden to use table cell instead of table as parent.
  7456. */
  7457. Graph.prototype.isSwimlane = function(cell, ignoreState)
  7458. {
  7459. var shape = null;
  7460. if (cell != null && !this.model.isEdge(cell) &&
  7461. this.model.getParent(cell) !=
  7462. this.model.getRoot())
  7463. {
  7464. var style = this.getCurrentCellStyle(cell, ignoreState)
  7465. shape = style[mxConstants.STYLE_SHAPE];
  7466. }
  7467. return shape == mxConstants.SHAPE_SWIMLANE ||
  7468. shape == 'table' || shape == 'tableRow';
  7469. };
  7470. /**
  7471. * Overridden to check table cells and rows.
  7472. */
  7473. var graphIsCellEditable = Graph.prototype.isCellEditable;
  7474. Graph.prototype.isCellEditable = function(cell)
  7475. {
  7476. if (cell == null || !graphIsCellEditable.apply(this, arguments))
  7477. {
  7478. return false;
  7479. }
  7480. else if (this.isTableCell(cell) || this.isTableRow(cell))
  7481. {
  7482. return this.isCellEditable(this.model.getParent(cell));
  7483. }
  7484. else
  7485. {
  7486. return true;
  7487. }
  7488. };
  7489. /**
  7490. * Overridden to check table cells and rows.
  7491. */
  7492. var graphIsCellMovable = Graph.prototype.isCellMovable;
  7493. Graph.prototype.isCellMovable = function(cell)
  7494. {
  7495. if (cell == null || !graphIsCellMovable.apply(this, arguments))
  7496. {
  7497. return false;
  7498. }
  7499. else if (this.isTableCell(cell) || this.isTableRow(cell))
  7500. {
  7501. return this.isCellMovable(this.model.getParent(cell));
  7502. }
  7503. else
  7504. {
  7505. return true;
  7506. }
  7507. };
  7508. /**
  7509. * Overridden to add expand style.
  7510. */
  7511. var graphIsExtendParent = Graph.prototype.isExtendParent;
  7512. Graph.prototype.isExtendParent = function(cell)
  7513. {
  7514. var parent = this.model.getParent(cell);
  7515. if (parent != null)
  7516. {
  7517. var style = this.getCurrentCellStyle(parent);
  7518. if (style['expand'] != null)
  7519. {
  7520. return style['expand'] != '0';
  7521. }
  7522. }
  7523. return graphIsExtendParent.apply(this, arguments) &&
  7524. (parent == null || !this.isTable(parent));
  7525. };
  7526. /**
  7527. * Overridden to use table cell instead of table as parent.
  7528. */
  7529. var graphSplitEdge = Graph.prototype.splitEdge;
  7530. Graph.prototype.splitEdge = function(edge, cells, newEdge, dx, dy, x, y, parent)
  7531. {
  7532. if (parent == null)
  7533. {
  7534. parent = this.model.getParent(edge);
  7535. if (this.isTable(parent) || this.isTableRow(parent))
  7536. {
  7537. parent = this.getCellAt(x, y, null, true, false);
  7538. }
  7539. }
  7540. var newEdge = null;
  7541. this.model.beginUpdate();
  7542. try
  7543. {
  7544. var newEdge = graphSplitEdge.apply(this, [edge, cells, newEdge, dx, dy, x, y, parent]);
  7545. // Removes cloned value on first segment
  7546. this.model.setValue(newEdge, '');
  7547. // Removes child labels on first or second segment depending on coordinate
  7548. // LATER: Split and reposition labels based on x and y
  7549. var sourceLabels = this.getChildCells(newEdge, true);
  7550. for (var i = 0; i < sourceLabels.length; i++)
  7551. {
  7552. var geo = this.getCellGeometry(sourceLabels[i]);
  7553. if (geo != null && geo.relative && geo.x > 0)
  7554. {
  7555. this.model.remove(sourceLabels[i]);
  7556. }
  7557. }
  7558. var targetLabels = this.getChildCells(edge, true);
  7559. for (var i = 0; i < targetLabels.length; i++)
  7560. {
  7561. var geo = this.getCellGeometry(targetLabels[i]);
  7562. if (geo != null && geo.relative && geo.x <= 0)
  7563. {
  7564. this.model.remove(targetLabels[i]);
  7565. }
  7566. }
  7567. // Removes entryX/Y and exitX/Y if snapToPoint is used
  7568. var target = this.model.getTerminal(newEdge, false);
  7569. if (target != null)
  7570. {
  7571. var style = this.getCurrentCellStyle(target);
  7572. if (style != null && style['snapToPoint'] == '1')
  7573. {
  7574. this.setCellStyles(mxConstants.STYLE_EXIT_X, null, [edge]);
  7575. this.setCellStyles(mxConstants.STYLE_EXIT_Y, null, [edge]);
  7576. this.setCellStyles(mxConstants.STYLE_ENTRY_X, null, [newEdge]);
  7577. this.setCellStyles(mxConstants.STYLE_ENTRY_Y, null, [newEdge]);
  7578. }
  7579. }
  7580. }
  7581. finally
  7582. {
  7583. this.model.endUpdate();
  7584. }
  7585. return newEdge;
  7586. };
  7587. /**
  7588. * Overridden to flatten cell hierarchy for selecting next and previous.
  7589. */
  7590. var graphSelectCell = Graph.prototype.selectCell;
  7591. Graph.prototype.selectCell = function(isNext, isParent, isChild)
  7592. {
  7593. if (isParent || isChild)
  7594. {
  7595. graphSelectCell.apply(this, arguments);
  7596. }
  7597. else
  7598. {
  7599. var cell = this.getSelectionCell();
  7600. var index = null;
  7601. var cells = [];
  7602. // LATER: Reverse traverse order for !isNext
  7603. var flatten = mxUtils.bind(this, function(temp)
  7604. {
  7605. if (this.view.getState(temp) != null &&
  7606. (this.model.isVertex(temp) ||
  7607. this.model.isEdge(temp)))
  7608. {
  7609. cells.push(temp);
  7610. if (temp == cell)
  7611. {
  7612. index = cells.length - 1;
  7613. }
  7614. else if ((isNext && cell == null && cells.length > 0) ||
  7615. (index != null && ((isNext && cells.length > index)) ||
  7616. (!isNext && index > 0)))
  7617. {
  7618. return;
  7619. }
  7620. }
  7621. for (var i = 0; i < this.model.getChildCount(temp); i++)
  7622. {
  7623. flatten(this.model.getChildAt(temp, i));
  7624. }
  7625. });
  7626. flatten(this.model.root);
  7627. if (cells.length > 0)
  7628. {
  7629. if (index != null)
  7630. {
  7631. index = mxUtils.mod(index + ((isNext) ? 1 : -1), cells.length)
  7632. }
  7633. else
  7634. {
  7635. index = 0;
  7636. }
  7637. this.setSelectionCell(cells[index]);
  7638. }
  7639. }
  7640. };
  7641. /**
  7642. * Swaps the given shapes.
  7643. */
  7644. Graph.prototype.swapShapes = function(cells, dx, dy, clone, target, evt, mapping)
  7645. {
  7646. var result = false;
  7647. if (!clone && target != null && cells.length == 1)
  7648. {
  7649. var targetState = this.view.getState(target);
  7650. var sourceState = this.view.getState(cells[0]);
  7651. if (targetState != null && sourceState != null &&
  7652. (evt != null && mxEvent.isShiftDown(evt)))
  7653. {
  7654. var g1 = this.getCellGeometry(target);
  7655. var g2 = this.getCellGeometry(cells[0]);
  7656. if (g1 != null && g2 != null)
  7657. {
  7658. var ng1 = g1.clone();
  7659. var ng2 = g2.clone();
  7660. ng2.x = ng1.x;
  7661. ng2.y = ng1.y;
  7662. ng1.x = g2.x;
  7663. ng1.y = g2.y;
  7664. this.model.beginUpdate();
  7665. try
  7666. {
  7667. this.model.setGeometry(target, ng1);
  7668. this.model.setGeometry(cells[0], ng2);
  7669. }
  7670. finally
  7671. {
  7672. this.model.endUpdate();
  7673. }
  7674. result = true;
  7675. }
  7676. }
  7677. }
  7678. return result;
  7679. };
  7680. /**
  7681. * Overrides cloning cells in moveCells.
  7682. */
  7683. var graphMoveCells = Graph.prototype.moveCells;
  7684. Graph.prototype.moveCells = function(cells, dx, dy, clone, target, evt, mapping)
  7685. {
  7686. if (this.swapShapes(cells, dx, dy, clone, target, evt, mapping))
  7687. {
  7688. return cells;
  7689. }
  7690. mapping = (mapping != null) ? mapping : new Object();
  7691. // Replaces source tables with rows
  7692. if (this.isTable(target))
  7693. {
  7694. var newCells = [];
  7695. for (var i = 0; i < cells.length; i++)
  7696. {
  7697. if (this.isTable(cells[i]))
  7698. {
  7699. newCells = newCells.concat(this.model.getChildCells(cells[i], true).reverse());
  7700. }
  7701. else
  7702. {
  7703. newCells.push(cells[i]);
  7704. }
  7705. }
  7706. cells = newCells;
  7707. }
  7708. this.model.beginUpdate();
  7709. try
  7710. {
  7711. // Updates source and target table heights and matches
  7712. // column count for moving rows between tables
  7713. var sourceTables = [];
  7714. for (var i = 0; i < cells.length; i++)
  7715. {
  7716. if (target != null && this.isTableRow(cells[i]))
  7717. {
  7718. var parent = this.model.getParent(cells[i]);
  7719. var row = this.getCellGeometry(cells[i]);
  7720. if (this.isTable(parent))
  7721. {
  7722. sourceTables.push(parent);
  7723. }
  7724. if (parent != null && row != null &&
  7725. this.isTable(parent) &&
  7726. this.isTable(target) &&
  7727. (clone || parent != target))
  7728. {
  7729. if (!clone)
  7730. {
  7731. var table = this.getCellGeometry(parent);
  7732. if (table != null)
  7733. {
  7734. table = table.clone();
  7735. table.height -= row.height;
  7736. this.model.setGeometry(parent, table);
  7737. }
  7738. }
  7739. var table = this.getCellGeometry(target);
  7740. if (table != null)
  7741. {
  7742. table = table.clone();
  7743. table.height += row.height;
  7744. this.model.setGeometry(target, table);
  7745. }
  7746. // Matches column count
  7747. var rows = this.model.getChildCells(target, true);
  7748. if (rows.length > 0)
  7749. {
  7750. cells[i] = (clone) ? this.cloneCell(cells[i]) : cells[i];
  7751. var sourceCols = this.model.getChildCells(cells[i], true);
  7752. var cols = this.model.getChildCells(rows[0], true);
  7753. var count = cols.length - sourceCols.length;
  7754. if (count > 0)
  7755. {
  7756. for (var j = 0; j < count; j++)
  7757. {
  7758. var col = this.cloneCell(sourceCols[sourceCols.length - 1]);
  7759. if (col != null)
  7760. {
  7761. col.value = '';
  7762. this.model.add(cells[i], col);
  7763. }
  7764. }
  7765. }
  7766. else if (count < 0)
  7767. {
  7768. for (var j = 0; j > count; j--)
  7769. {
  7770. this.model.remove(sourceCols[sourceCols.length + j - 1]);
  7771. }
  7772. }
  7773. // Updates column widths
  7774. sourceCols = this.model.getChildCells(cells[i], true);
  7775. for (var j = 0; j < cols.length; j++)
  7776. {
  7777. var geo = this.getCellGeometry(cols[j]);
  7778. var geo2 = this.getCellGeometry(sourceCols[j]);
  7779. if (geo != null && geo2 != null)
  7780. {
  7781. geo2 = geo2.clone();
  7782. geo2.width = geo.width;
  7783. this.model.setGeometry(sourceCols[j], geo2);
  7784. }
  7785. }
  7786. }
  7787. }
  7788. }
  7789. }
  7790. var result = graphMoveCells.apply(this, arguments);
  7791. // Removes empty tables
  7792. for (var i = 0; i < sourceTables.length; i++)
  7793. {
  7794. if (!clone && this.model.contains(sourceTables[i]) &&
  7795. this.model.getChildCount(sourceTables[i]) == 0)
  7796. {
  7797. this.model.remove(sourceTables[i]);
  7798. }
  7799. }
  7800. if (clone)
  7801. {
  7802. this.updateCustomLinks(this.createCellMapping(mapping,
  7803. this.createCellLookup(cells)), result);
  7804. }
  7805. }
  7806. finally
  7807. {
  7808. this.model.endUpdate();
  7809. }
  7810. return result;
  7811. };
  7812. /**
  7813. * Overriddes to delete label for table cells.
  7814. */
  7815. var graphRemoveCells = Graph.prototype.removeCells;
  7816. Graph.prototype.removeCells = function(cells, includeEdges)
  7817. {
  7818. var result = [];
  7819. this.model.beginUpdate();
  7820. try
  7821. {
  7822. // Clears labels on table cells
  7823. for (var i = 0; i < cells.length; i++)
  7824. {
  7825. if (this.isTableCell(cells[i]))
  7826. {
  7827. var row = this.model.getParent(cells[i]);
  7828. var table = this.model.getParent(row);
  7829. // Removes table if one cell in one row left
  7830. if (this.model.getChildCount(row) == 1 &&
  7831. this.model.getChildCount(table) == 1)
  7832. {
  7833. if (mxUtils.indexOf(cells, table) < 0 &&
  7834. mxUtils.indexOf(result, table) < 0)
  7835. {
  7836. result.push(table);
  7837. }
  7838. }
  7839. else
  7840. {
  7841. this.labelChanged(cells[i], '');
  7842. }
  7843. }
  7844. else
  7845. {
  7846. // Deletes table if all rows are removed
  7847. if (this.isTableRow(cells[i]))
  7848. {
  7849. var table = this.model.getParent(cells[i]);
  7850. if (mxUtils.indexOf(cells, table) < 0 &&
  7851. mxUtils.indexOf(result, table) < 0)
  7852. {
  7853. var rows = this.model.getChildCells(table, true);
  7854. var deleteCount = 0;
  7855. for (var j = 0; j < rows.length; j++)
  7856. {
  7857. if (mxUtils.indexOf(cells, rows[j]) >= 0)
  7858. {
  7859. deleteCount++;
  7860. }
  7861. }
  7862. if (deleteCount == rows.length)
  7863. {
  7864. result.push(table);
  7865. }
  7866. }
  7867. }
  7868. result.push(cells[i]);
  7869. }
  7870. }
  7871. result = graphRemoveCells.apply(this, [result, includeEdges]);
  7872. }
  7873. finally
  7874. {
  7875. this.model.endUpdate();
  7876. }
  7877. return result;
  7878. };
  7879. /**
  7880. * Updates cells IDs for custom links in the given cells using an
  7881. * optional graph to avoid changing the undo history.
  7882. */
  7883. Graph.prototype.updateCustomLinks = function(mapping, cells, graph)
  7884. {
  7885. graph = (graph != null) ? graph : new Graph();
  7886. for (var i = 0; i < cells.length; i++)
  7887. {
  7888. if (cells[i] != null)
  7889. {
  7890. graph.updateCustomLinksForCell(mapping, cells[i], graph);
  7891. }
  7892. }
  7893. };
  7894. /**
  7895. * Updates cell IDs in custom links on the given cell and its label.
  7896. */
  7897. Graph.prototype.updateCustomLinksForCell = function(mapping, cell)
  7898. {
  7899. this.doUpdateCustomLinksForCell(mapping, cell);
  7900. var childCount = this.model.getChildCount(cell);
  7901. for (var i = 0; i < childCount; i++)
  7902. {
  7903. this.updateCustomLinksForCell(mapping,
  7904. this.model.getChildAt(cell, i));
  7905. }
  7906. };
  7907. /**
  7908. * Updates cell IDs in custom links on the given cell and its label.
  7909. */
  7910. Graph.prototype.doUpdateCustomLinksForCell = function(mapping, cell)
  7911. {
  7912. // Hook for subclassers
  7913. };
  7914. /**
  7915. * Overrides method to provide connection constraints for shapes.
  7916. */
  7917. Graph.prototype.getAllConnectionConstraints = function(terminal, source)
  7918. {
  7919. if (terminal != null)
  7920. {
  7921. var constraints = mxUtils.getValue(terminal.style, 'points', null);
  7922. if (constraints != null)
  7923. {
  7924. // Requires an array of arrays with x, y (0..1), an optional
  7925. // [perimeter (0 or 1), dx, and dy] eg. points=[[0,0,1,-10,10],[0,1,0],[1,1]]
  7926. var result = [];
  7927. try
  7928. {
  7929. var c = JSON.parse(constraints);
  7930. for (var i = 0; i < c.length; i++)
  7931. {
  7932. var tmp = c[i];
  7933. result.push(new mxConnectionConstraint(new mxPoint(tmp[0], tmp[1]), (tmp.length > 2) ? tmp[2] != '0' : true,
  7934. null, (tmp.length > 3) ? tmp[3] : 0, (tmp.length > 4) ? tmp[4] : 0));
  7935. }
  7936. }
  7937. catch (e)
  7938. {
  7939. // ignore
  7940. }
  7941. return result;
  7942. }
  7943. else if (terminal.shape != null && terminal.shape.bounds != null)
  7944. {
  7945. var dir = terminal.shape.direction;
  7946. var bounds = terminal.shape.bounds;
  7947. var scale = terminal.shape.scale;
  7948. var w = bounds.width / scale;
  7949. var h = bounds.height / scale;
  7950. if (dir == mxConstants.DIRECTION_NORTH || dir == mxConstants.DIRECTION_SOUTH)
  7951. {
  7952. var tmp = w;
  7953. w = h;
  7954. h = tmp;
  7955. }
  7956. constraints = terminal.shape.getConstraints(terminal.style, w, h);
  7957. if (constraints != null)
  7958. {
  7959. return constraints;
  7960. }
  7961. else if (terminal.shape.stencil != null && terminal.shape.stencil.constraints != null)
  7962. {
  7963. return terminal.shape.stencil.constraints;
  7964. }
  7965. else if (terminal.shape.constraints != null)
  7966. {
  7967. return terminal.shape.constraints;
  7968. }
  7969. }
  7970. }
  7971. return null;
  7972. };
  7973. /**
  7974. * Inverts the elbow edge style without removing existing styles.
  7975. */
  7976. Graph.prototype.flipEdge = function(edge)
  7977. {
  7978. if (edge != null)
  7979. {
  7980. var style = this.getCurrentCellStyle(edge);
  7981. var elbow = mxUtils.getValue(style, mxConstants.STYLE_ELBOW,
  7982. mxConstants.ELBOW_HORIZONTAL);
  7983. var value = (elbow == mxConstants.ELBOW_HORIZONTAL) ?
  7984. mxConstants.ELBOW_VERTICAL : mxConstants.ELBOW_HORIZONTAL;
  7985. this.setCellStyles(mxConstants.STYLE_ELBOW, value, [edge]);
  7986. }
  7987. };
  7988. /**
  7989. * Disables drill-down for non-swimlanes.
  7990. */
  7991. Graph.prototype.isValidRoot = function(cell)
  7992. {
  7993. // Counts non-relative children
  7994. var childCount = this.model.getChildCount(cell);
  7995. var realChildCount = 0;
  7996. for (var i = 0; i < childCount; i++)
  7997. {
  7998. var child = this.model.getChildAt(cell, i);
  7999. if (this.model.isVertex(child))
  8000. {
  8001. var geometry = this.getCellGeometry(child);
  8002. if (geometry != null && !geometry.relative)
  8003. {
  8004. realChildCount++;
  8005. }
  8006. }
  8007. }
  8008. return realChildCount > 0 || this.isContainer(cell);
  8009. };
  8010. /**
  8011. * Disables drill-down for non-swimlanes.
  8012. */
  8013. Graph.prototype.isValidDropTarget = function(cell, cells, evt)
  8014. {
  8015. var style = this.getCurrentCellStyle(cell);
  8016. var tables = true;
  8017. var rows = true;
  8018. for (var i = 0; i < cells.length && rows; i++)
  8019. {
  8020. tables = tables && this.isTable(cells[i]);
  8021. rows = rows && this.isTableRow(cells[i]);
  8022. }
  8023. return !this.isCellLocked(cell) && ((cells.length == 1 && evt != null &&
  8024. mxEvent.isShiftDown(evt) && !mxEvent.isControlDown(evt) &&
  8025. !mxEvent.isAltDown(evt)) || this.isTargetShape(cell, cells, evt) ||
  8026. ((mxUtils.getValue(style, 'part', '0') != '1' || this.isContainer(cell)) &&
  8027. mxUtils.getValue(style, 'dropTarget', '1') != '0' && (mxGraph.prototype.
  8028. isValidDropTarget.apply(this, arguments) || this.isContainer(cell)) &&
  8029. !this.isTableRow(cell) && (!this.isTable(cell) || rows || tables)));
  8030. };
  8031. /**
  8032. * Overrides createGroupCell to set the group style for new groups to 'group'.
  8033. */
  8034. Graph.prototype.createGroupCell = function()
  8035. {
  8036. var group = mxGraph.prototype.createGroupCell.apply(this, arguments);
  8037. group.setStyle('group');
  8038. return group;
  8039. };
  8040. /**
  8041. * Disables extending parents with stack layouts on add
  8042. */
  8043. Graph.prototype.isExtendParentsOnAdd = function(cell)
  8044. {
  8045. var result = mxGraph.prototype.isExtendParentsOnAdd.apply(this, arguments);
  8046. if (result && cell != null && this.layoutManager != null)
  8047. {
  8048. var parent = this.model.getParent(cell);
  8049. if (parent != null)
  8050. {
  8051. var layout = this.layoutManager.getLayout(parent);
  8052. if (layout != null && layout.constructor == mxStackLayout)
  8053. {
  8054. result = false;
  8055. }
  8056. }
  8057. }
  8058. return result;
  8059. };
  8060. /**
  8061. * Overrides autosize to add a border.
  8062. */
  8063. Graph.prototype.getPreferredSizeForCell = function(cell)
  8064. {
  8065. var result = mxGraph.prototype.getPreferredSizeForCell.apply(this, arguments);
  8066. // Adds buffer
  8067. if (result != null)
  8068. {
  8069. result.width += 10;
  8070. result.height += 4;
  8071. if (this.gridEnabled)
  8072. {
  8073. result.width = this.snap(result.width);
  8074. result.height = this.snap(result.height);
  8075. }
  8076. }
  8077. return result;
  8078. }
  8079. /**
  8080. * Turns the given cells and returns the changed cells.
  8081. */
  8082. Graph.prototype.turnShapes = function(cells, backwards)
  8083. {
  8084. var model = this.getModel();
  8085. var select = [];
  8086. model.beginUpdate();
  8087. try
  8088. {
  8089. for (var i = 0; i < cells.length; i++)
  8090. {
  8091. var cell = cells[i];
  8092. if (model.isEdge(cell))
  8093. {
  8094. var src = model.getTerminal(cell, true);
  8095. var trg = model.getTerminal(cell, false);
  8096. model.setTerminal(cell, trg, true);
  8097. model.setTerminal(cell, src, false);
  8098. var geo = model.getGeometry(cell);
  8099. if (geo != null)
  8100. {
  8101. geo = geo.clone();
  8102. if (geo.points != null)
  8103. {
  8104. geo.points.reverse();
  8105. }
  8106. var sp = geo.getTerminalPoint(true);
  8107. var tp = geo.getTerminalPoint(false)
  8108. geo.setTerminalPoint(sp, false);
  8109. geo.setTerminalPoint(tp, true);
  8110. model.setGeometry(cell, geo);
  8111. // Inverts constraints
  8112. var edgeState = this.view.getState(cell);
  8113. var sourceState = this.view.getState(src);
  8114. var targetState = this.view.getState(trg);
  8115. if (edgeState != null)
  8116. {
  8117. var sc = (sourceState != null) ? this.getConnectionConstraint(edgeState, sourceState, true) : null;
  8118. var tc = (targetState != null) ? this.getConnectionConstraint(edgeState, targetState, false) : null;
  8119. this.setConnectionConstraint(cell, src, true, tc);
  8120. this.setConnectionConstraint(cell, trg, false, sc);
  8121. // Inverts perimeter spacings
  8122. var temp = mxUtils.getValue(edgeState.style, mxConstants.STYLE_SOURCE_PERIMETER_SPACING);
  8123. this.setCellStyles(mxConstants.STYLE_SOURCE_PERIMETER_SPACING, mxUtils.getValue(
  8124. edgeState.style, mxConstants.STYLE_TARGET_PERIMETER_SPACING), [cell]);
  8125. this.setCellStyles(mxConstants.STYLE_TARGET_PERIMETER_SPACING, temp, [cell]);
  8126. }
  8127. select.push(cell);
  8128. }
  8129. }
  8130. else if (model.isVertex(cell))
  8131. {
  8132. var geo = this.getCellGeometry(cell);
  8133. if (geo != null)
  8134. {
  8135. // Rotates the size and position in the geometry
  8136. if (!this.isTable(cell) && !this.isTableRow(cell) &&
  8137. !this.isTableCell(cell) && !this.isSwimlane(cell))
  8138. {
  8139. geo = geo.clone();
  8140. geo.x += geo.width / 2 - geo.height / 2;
  8141. geo.y += geo.height / 2 - geo.width / 2;
  8142. var tmp = geo.width;
  8143. geo.width = geo.height;
  8144. geo.height = tmp;
  8145. model.setGeometry(cell, geo);
  8146. }
  8147. // Reads the current direction and advances by 90 degrees
  8148. var state = this.view.getState(cell);
  8149. if (state != null)
  8150. {
  8151. var dirs = [mxConstants.DIRECTION_EAST, mxConstants.DIRECTION_SOUTH,
  8152. mxConstants.DIRECTION_WEST, mxConstants.DIRECTION_NORTH];
  8153. var dir = mxUtils.getValue(state.style, mxConstants.STYLE_DIRECTION,
  8154. mxConstants.DIRECTION_EAST);
  8155. this.setCellStyles(mxConstants.STYLE_DIRECTION,
  8156. dirs[mxUtils.mod(mxUtils.indexOf(dirs, dir) +
  8157. ((backwards) ? -1 : 1), dirs.length)], [cell]);
  8158. }
  8159. select.push(cell);
  8160. }
  8161. }
  8162. }
  8163. }
  8164. finally
  8165. {
  8166. model.endUpdate();
  8167. }
  8168. return select;
  8169. };
  8170. /**
  8171. * Returns true if the given stencil contains any placeholder text.
  8172. */
  8173. Graph.prototype.stencilHasPlaceholders = function(stencil)
  8174. {
  8175. if (stencil != null && stencil.fgNode != null)
  8176. {
  8177. var node = stencil.fgNode.firstChild;
  8178. while (node != null)
  8179. {
  8180. if (node.nodeName == 'text' && node.getAttribute('placeholders') == '1')
  8181. {
  8182. return true;
  8183. }
  8184. node = node.nextSibling;
  8185. }
  8186. }
  8187. return false;
  8188. };
  8189. /**
  8190. * Updates the child cells with placeholders if metadata of a
  8191. * cell has changed and propagates geometry changes in tables.
  8192. */
  8193. var graphProcessChange = Graph.prototype.processChange;
  8194. Graph.prototype.processChange = function(change)
  8195. {
  8196. if (change instanceof mxGeometryChange &&
  8197. (this.isTableCell(change.cell) || this.isTableRow(change.cell)) &&
  8198. ((change.previous == null && change.geometry != null) ||
  8199. (change.previous != null && !change.previous.equals(change.geometry))))
  8200. {
  8201. var cell = change.cell;
  8202. if (this.isTableCell(cell))
  8203. {
  8204. cell = this.model.getParent(cell);
  8205. }
  8206. if (this.isTableRow(cell))
  8207. {
  8208. cell = this.model.getParent(cell);
  8209. }
  8210. // Forces repaint of table with unchanged style and geometry
  8211. var state = this.view.getState(cell);
  8212. if (state != null && state.shape != null)
  8213. {
  8214. this.view.invalidate(cell);
  8215. state.shape.bounds = null;
  8216. }
  8217. }
  8218. graphProcessChange.apply(this, arguments);
  8219. if (change instanceof mxValueChange && change.cell != null &&
  8220. change.cell.value != null && typeof(change.cell.value) == 'object')
  8221. {
  8222. this.invalidateDescendantsWithPlaceholders(change.cell);
  8223. }
  8224. };
  8225. /**
  8226. * Replaces the given element with a span.
  8227. */
  8228. Graph.prototype.invalidateDescendantsWithPlaceholders = function(cell)
  8229. {
  8230. // Invalidates all descendants with placeholders
  8231. var desc = this.model.getDescendants(cell);
  8232. // LATER: Check if only label or tooltip have changed
  8233. if (desc.length > 0)
  8234. {
  8235. for (var i = 0; i < desc.length; i++)
  8236. {
  8237. var state = this.view.getState(desc[i]);
  8238. if (state != null && state.shape != null && state.shape.stencil != null &&
  8239. this.stencilHasPlaceholders(state.shape.stencil))
  8240. {
  8241. this.removeStateForCell(desc[i]);
  8242. }
  8243. else if (this.isReplacePlaceholders(desc[i]))
  8244. {
  8245. this.view.invalidate(desc[i], false, false);
  8246. }
  8247. }
  8248. }
  8249. };
  8250. /**
  8251. * Replaces the given element with a span.
  8252. */
  8253. Graph.prototype.replaceElement = function(elt, tagName)
  8254. {
  8255. var span = elt.ownerDocument.createElement((tagName != null) ? tagName : 'span');
  8256. var attributes = Array.prototype.slice.call(elt.attributes);
  8257. while (attr = attributes.pop())
  8258. {
  8259. span.setAttribute(attr.nodeName, attr.nodeValue);
  8260. }
  8261. span.innerHTML = elt.innerHTML;
  8262. elt.parentNode.replaceChild(span, elt);
  8263. };
  8264. /**
  8265. *
  8266. */
  8267. Graph.prototype.processElements = function(elt, fn)
  8268. {
  8269. if (elt != null)
  8270. {
  8271. var elts = elt.getElementsByTagName('*');
  8272. for (var i = 0; i < elts.length; i++)
  8273. {
  8274. fn(elts[i]);
  8275. }
  8276. }
  8277. };
  8278. /**
  8279. * Handles label changes for XML user objects.
  8280. */
  8281. Graph.prototype.updateLabelElements = function(cells, fn, tagName)
  8282. {
  8283. cells = (cells != null) ? cells : this.getSelectionCells();
  8284. var div = document.createElement('div');
  8285. for (var i = 0; i < cells.length; i++)
  8286. {
  8287. // Changes font tags inside HTML labels
  8288. var style = this.getCurrentCellStyle(cells[i]);
  8289. if (style != null && style['html'] == '1')
  8290. {
  8291. var label = this.convertValueToString(cells[i]);
  8292. if (label != null && label.length > 0)
  8293. {
  8294. div.innerHTML = label;
  8295. var elts = div.getElementsByTagName((tagName != null) ? tagName : '*');
  8296. for (var j = 0; j < elts.length; j++)
  8297. {
  8298. fn(elts[j]);
  8299. }
  8300. if (div.innerHTML != label)
  8301. {
  8302. this.cellLabelChanged(cells[i], div.innerHTML);
  8303. }
  8304. }
  8305. }
  8306. }
  8307. };
  8308. /**
  8309. * Handles label changes for XML user objects.
  8310. */
  8311. Graph.prototype.cellLabelChanged = function(cell, value, autoSize)
  8312. {
  8313. // Removes all illegal control characters in user input
  8314. value = Graph.zapGremlins(value);
  8315. this.model.beginUpdate();
  8316. try
  8317. {
  8318. if (cell.value != null && typeof cell.value == 'object')
  8319. {
  8320. if (this.isReplacePlaceholders(cell) &&
  8321. cell.getAttribute('placeholder') != null)
  8322. {
  8323. // LATER: Handle delete, name change
  8324. var name = cell.getAttribute('placeholder');
  8325. var current = cell;
  8326. while (current != null)
  8327. {
  8328. if (current == this.model.getRoot() || (current.value != null &&
  8329. typeof(current.value) == 'object' && current.hasAttribute(name)))
  8330. {
  8331. this.setAttributeForCell(current, name, value);
  8332. break;
  8333. }
  8334. current = this.model.getParent(current);
  8335. }
  8336. }
  8337. var tmp = cell.value.cloneNode(true);
  8338. if (Graph.translateDiagram && Graph.diagramLanguage != null &&
  8339. tmp.hasAttribute('label_' + Graph.diagramLanguage))
  8340. {
  8341. tmp.setAttribute('label_' + Graph.diagramLanguage, value);
  8342. }
  8343. else
  8344. {
  8345. tmp.setAttribute('label', value);
  8346. }
  8347. value = tmp;
  8348. }
  8349. mxGraph.prototype.cellLabelChanged.apply(this, arguments);
  8350. }
  8351. finally
  8352. {
  8353. this.model.endUpdate();
  8354. }
  8355. };
  8356. /**
  8357. * Removes transparent empty groups if all children are removed.
  8358. */
  8359. Graph.prototype.cellsRemoved = function(cells)
  8360. {
  8361. if (cells != null)
  8362. {
  8363. var dict = new mxDictionary();
  8364. for (var i = 0; i < cells.length; i++)
  8365. {
  8366. dict.put(cells[i], true);
  8367. }
  8368. // LATER: Recurse up the cell hierarchy
  8369. var parents = [];
  8370. for (var i = 0; i < cells.length; i++)
  8371. {
  8372. var parent = this.model.getParent(cells[i]);
  8373. if (parent != null && !dict.get(parent))
  8374. {
  8375. dict.put(parent, true);
  8376. parents.push(parent);
  8377. }
  8378. }
  8379. for (var i = 0; i < parents.length; i++)
  8380. {
  8381. var state = this.view.getState(parents[i]);
  8382. if (state != null && (this.model.isEdge(state.cell) ||
  8383. this.model.isVertex(state.cell)) &&
  8384. this.isCellDeletable(state.cell) &&
  8385. this.isTransparentState(state))
  8386. {
  8387. var allChildren = true;
  8388. for (var j = 0; j < this.model.getChildCount(state.cell) && allChildren; j++)
  8389. {
  8390. if (!dict.get(this.model.getChildAt(state.cell, j)))
  8391. {
  8392. allChildren = false;
  8393. }
  8394. }
  8395. if (allChildren)
  8396. {
  8397. cells.push(state.cell);
  8398. }
  8399. }
  8400. }
  8401. }
  8402. mxGraph.prototype.cellsRemoved.apply(this, arguments);
  8403. };
  8404. /**
  8405. * Overrides ungroup to check if group should be removed.
  8406. */
  8407. Graph.prototype.removeCellsAfterUngroup = function(cells)
  8408. {
  8409. var cellsToRemove = [];
  8410. for (var i = 0; i < cells.length; i++)
  8411. {
  8412. if (this.isCellDeletable(cells[i]) &&
  8413. this.isTransparentState(
  8414. this.view.getState(cells[i])))
  8415. {
  8416. cellsToRemove.push(cells[i]);
  8417. }
  8418. }
  8419. cells = cellsToRemove;
  8420. mxGraph.prototype.removeCellsAfterUngroup.apply(this, arguments);
  8421. };
  8422. /**
  8423. * Sets the link for the given cell.
  8424. */
  8425. Graph.prototype.setLinkForCell = function(cell, link)
  8426. {
  8427. this.setAttributeForCell(cell, 'link', link);
  8428. };
  8429. /**
  8430. * Sets the link for the given cell.
  8431. */
  8432. Graph.prototype.setTooltipForCell = function(cell, link)
  8433. {
  8434. var key = 'tooltip';
  8435. if (Graph.translateDiagram && Graph.diagramLanguage != null &&
  8436. mxUtils.isNode(cell.value) && cell.value.hasAttribute('tooltip_' + Graph.diagramLanguage))
  8437. {
  8438. key = 'tooltip_' + Graph.diagramLanguage;
  8439. }
  8440. this.setAttributeForCell(cell, key, link);
  8441. };
  8442. /**
  8443. * Returns the cells in the model (or given array) that have all of the
  8444. * given tags in their tags property.
  8445. */
  8446. Graph.prototype.getAttributeForCell = function(cell, attributeName, defaultValue)
  8447. {
  8448. var value = (cell.value != null && typeof cell.value === 'object') ?
  8449. cell.value.getAttribute(attributeName) : null;
  8450. return (value != null) ? value : defaultValue;
  8451. };
  8452. /**
  8453. * Sets the link for the given cell.
  8454. */
  8455. Graph.prototype.setAttributeForCell = function(cell, attributeName, attributeValue)
  8456. {
  8457. var value = null;
  8458. if (cell.value != null && typeof(cell.value) == 'object')
  8459. {
  8460. value = cell.value.cloneNode(true);
  8461. }
  8462. else
  8463. {
  8464. var doc = mxUtils.createXmlDocument();
  8465. value = doc.createElement('UserObject');
  8466. value.setAttribute('label', cell.value || '');
  8467. }
  8468. if (attributeValue != null)
  8469. {
  8470. value.setAttribute(attributeName, attributeValue);
  8471. }
  8472. else
  8473. {
  8474. value.removeAttribute(attributeName);
  8475. }
  8476. this.model.setValue(cell, value);
  8477. };
  8478. /**
  8479. *
  8480. */
  8481. Graph.prototype.isTargetShape = function(target, cells, evt)
  8482. {
  8483. var shape = mxUtils.getValue(
  8484. this.getCurrentCellStyle(target),
  8485. mxConstants.STYLE_SHAPE, '');
  8486. for (var i = 0; i < cells.length; i++)
  8487. {
  8488. var shapes = mxUtils.getValue(
  8489. this.getCurrentCellStyle(cells[i]),
  8490. 'targetShapes', '').split(',');
  8491. if (mxUtils.indexOf(shapes, shape) >= 0)
  8492. {
  8493. return true;
  8494. }
  8495. }
  8496. return false;
  8497. };
  8498. /**
  8499. * Overridden to stop moving edge labels between cells.
  8500. */
  8501. var graphGetDropTarget = Graph.prototype.getDropTarget;
  8502. Graph.prototype.getDropTarget = function(cells, evt, cell, clone)
  8503. {
  8504. // Disables drop into group if alt is pressed
  8505. if (mxEvent.isAltDown(evt))
  8506. {
  8507. return null;
  8508. }
  8509. // Disables dragging edge labels out of edges
  8510. for (var i = 0; i < cells.length; i++)
  8511. {
  8512. var parent = this.model.getParent(cells[i]);
  8513. if (this.model.isEdge(parent) && mxUtils.indexOf(cells, parent) < 0)
  8514. {
  8515. return null;
  8516. }
  8517. }
  8518. var target = graphGetDropTarget.apply(this, arguments);
  8519. // Always drops rows to tables
  8520. var rows = true;
  8521. for (var i = 0; i < cells.length && rows; i++)
  8522. {
  8523. rows = rows && this.isTableRow(cells[i]);
  8524. }
  8525. if (rows)
  8526. {
  8527. if (this.isTableCell(target))
  8528. {
  8529. target = this.model.getParent(target);
  8530. }
  8531. if (this.isTableRow(target))
  8532. {
  8533. target = this.model.getParent(target);
  8534. }
  8535. if (!this.isTable(target))
  8536. {
  8537. target = null;
  8538. }
  8539. }
  8540. return target;
  8541. };
  8542. /**
  8543. * Overrides double click handling to avoid accidental inserts of new labels in dblClick below.
  8544. */
  8545. Graph.prototype.click = function(me)
  8546. {
  8547. mxGraph.prototype.click.call(this, me);
  8548. // Stores state and source for checking in dblClick
  8549. this.firstClickState = me.getState();
  8550. this.firstClickSource = me.getSource();
  8551. };
  8552. /**
  8553. * Overrides double click handling to add the tolerance and inserting text.
  8554. */
  8555. Graph.prototype.dblClick = function(evt, cell)
  8556. {
  8557. if (this.isEnabled())
  8558. {
  8559. cell = this.insertTextForEvent(evt, cell);
  8560. mxGraph.prototype.dblClick.call(this, evt, cell);
  8561. }
  8562. };
  8563. /**
  8564. * Overrides double click handling to add the tolerance and inserting text.
  8565. */
  8566. Graph.prototype.insertTextForEvent = function(evt, cell)
  8567. {
  8568. var pt = mxUtils.convertPoint(this.container, mxEvent.getClientX(evt), mxEvent.getClientY(evt));
  8569. // Automatically adds new child cells to edges on double click
  8570. if (evt != null && !this.model.isVertex(cell))
  8571. {
  8572. var state = (this.model.isEdge(cell)) ? this.view.getState(cell) : null;
  8573. var src = mxEvent.getSource(evt);
  8574. if ((this.firstClickState == state && this.firstClickSource == src) &&
  8575. (state == null || (state.text == null || state.text.node == null ||
  8576. state.text.boundingBox == null || (!mxUtils.contains(state.text.boundingBox,
  8577. pt.x, pt.y) && !mxUtils.isAncestorNode(state.text.node, mxEvent.getSource(evt))))) &&
  8578. ((state == null && !this.isCellLocked(this.getDefaultParent())) ||
  8579. (state != null && !this.isCellLocked(state.cell))) &&
  8580. (state != null ||
  8581. (mxClient.IS_SVG && src == this.view.getCanvas().ownerSVGElement)))
  8582. {
  8583. if (state == null)
  8584. {
  8585. state = this.view.getState(this.getCellAt(pt.x, pt.y));
  8586. }
  8587. cell = this.addText(pt.x, pt.y, state);
  8588. }
  8589. }
  8590. return cell;
  8591. };
  8592. /**
  8593. * Returns a point that specifies the location for inserting cells.
  8594. */
  8595. Graph.prototype.getInsertPoint = function()
  8596. {
  8597. var gs = this.getGridSize();
  8598. var dx = this.container.scrollLeft / this.view.scale - this.view.translate.x;
  8599. var dy = this.container.scrollTop / this.view.scale - this.view.translate.y;
  8600. if (this.pageVisible)
  8601. {
  8602. var layout = this.getPageLayout();
  8603. var page = this.getPageSize();
  8604. dx = Math.max(dx, layout.x * page.width);
  8605. dy = Math.max(dy, layout.y * page.height);
  8606. }
  8607. return new mxPoint(this.snap(dx + gs), this.snap(dy + gs));
  8608. };
  8609. /**
  8610. *
  8611. */
  8612. Graph.prototype.getFreeInsertPoint = function()
  8613. {
  8614. var view = this.view;
  8615. var bds = this.getGraphBounds();
  8616. var pt = this.getInsertPoint();
  8617. // Places at same x-coord and 2 grid sizes below existing graph
  8618. var x = this.snap(Math.round(Math.max(pt.x, bds.x / view.scale - view.translate.x +
  8619. ((bds.width == 0) ? 2 * this.gridSize : 0))));
  8620. var y = this.snap(Math.round(Math.max(pt.y, (bds.y + bds.height) / view.scale - view.translate.y +
  8621. 2 * this.gridSize)));
  8622. return new mxPoint(x, y);
  8623. };
  8624. /**
  8625. *
  8626. */
  8627. Graph.prototype.getCenterInsertPoint = function(bbox)
  8628. {
  8629. bbox = (bbox != null) ? bbox : new mxRectangle();
  8630. if (mxUtils.hasScrollbars(this.container))
  8631. {
  8632. return new mxPoint(
  8633. this.snap(Math.round((this.container.scrollLeft + this.container.clientWidth / 2) /
  8634. this.view.scale - this.view.translate.x - bbox.width / 2)),
  8635. this.snap(Math.round((this.container.scrollTop + this.container.clientHeight / 2) /
  8636. this.view.scale - this.view.translate.y - bbox.height / 2)));
  8637. }
  8638. else
  8639. {
  8640. return new mxPoint(
  8641. this.snap(Math.round(this.container.clientWidth / 2 / this.view.scale -
  8642. this.view.translate.x - bbox.width / 2)),
  8643. this.snap(Math.round(this.container.clientHeight / 2 / this.view.scale -
  8644. this.view.translate.y - bbox.height / 2)));
  8645. }
  8646. };
  8647. /**
  8648. * Hook for subclassers to return true if the current insert point was defined
  8649. * using a mouse hover event.
  8650. */
  8651. Graph.prototype.isMouseInsertPoint = function()
  8652. {
  8653. return false;
  8654. };
  8655. /**
  8656. * Adds a new label at the given position and returns the new cell. State is
  8657. * an optional edge state to be used as the parent for the label. Vertices
  8658. * are not allowed currently as states.
  8659. */
  8660. Graph.prototype.addText = function(x, y, state)
  8661. {
  8662. // Creates a new edge label with a predefined text
  8663. var label = new mxCell();
  8664. label.value = 'Text';
  8665. label.geometry = new mxGeometry(0, 0, 0, 0);
  8666. label.vertex = true;
  8667. var style = 'html=1;align=center;verticalAlign=middle;resizable=0;points=[];';
  8668. if (state != null && this.model.isEdge(state.cell))
  8669. {
  8670. label.style = 'edgeLabel;' + style;
  8671. label.geometry.relative = true;
  8672. label.connectable = false;
  8673. // Resets the relative location stored inside the geometry
  8674. var pt2 = this.view.getRelativePoint(state, x, y);
  8675. label.geometry.x = Math.round(pt2.x * 10000) / 10000;
  8676. label.geometry.y = Math.round(pt2.y);
  8677. // Resets the offset inside the geometry to find the offset from the resulting point
  8678. label.geometry.offset = new mxPoint(0, 0);
  8679. pt2 = this.view.getPoint(state, label.geometry);
  8680. var scale = this.view.scale;
  8681. label.geometry.offset = new mxPoint(Math.round((x - pt2.x) / scale), Math.round((y - pt2.y) / scale));
  8682. }
  8683. else
  8684. {
  8685. var tr = this.view.translate;
  8686. label.style = 'text;' + style;
  8687. label.geometry.width = 40;
  8688. label.geometry.height = 20;
  8689. label.geometry.x = Math.round(x / this.view.scale) -
  8690. tr.x - ((state != null) ? state.origin.x : 0);
  8691. label.geometry.y = Math.round(y / this.view.scale) -
  8692. tr.y - ((state != null) ? state.origin.y : 0);
  8693. label.style += 'autosize=1;'
  8694. }
  8695. this.getModel().beginUpdate();
  8696. try
  8697. {
  8698. this.addCells([label], (state != null) ? state.cell : null);
  8699. this.fireEvent(new mxEventObject('textInserted', 'cells', [label]));
  8700. // Updates size of text after possible change of style via event
  8701. this.autoSizeCell(label);
  8702. }
  8703. finally
  8704. {
  8705. this.getModel().endUpdate();
  8706. }
  8707. return label;
  8708. };
  8709. /**
  8710. * Adds a handler for clicking on shapes with links. This replaces all links in labels.
  8711. */
  8712. Graph.prototype.addClickHandler = function(highlight, beforeClick, onClick)
  8713. {
  8714. // Replaces links in labels for consistent right-clicks
  8715. var checkLinks = mxUtils.bind(this, function()
  8716. {
  8717. var links = this.container.getElementsByTagName('a');
  8718. if (links != null)
  8719. {
  8720. for (var i = 0; i < links.length; i++)
  8721. {
  8722. var href = this.getAbsoluteUrl(links[i].getAttribute('href'));
  8723. if (href != null)
  8724. {
  8725. links[i].setAttribute('rel', this.linkRelation);
  8726. links[i].setAttribute('href', href);
  8727. if (beforeClick != null)
  8728. {
  8729. mxEvent.addGestureListeners(links[i], null, null, beforeClick);
  8730. }
  8731. }
  8732. }
  8733. }
  8734. });
  8735. this.model.addListener(mxEvent.CHANGE, checkLinks);
  8736. checkLinks();
  8737. var cursor = this.container.style.cursor;
  8738. var tol = this.getTolerance();
  8739. var graph = this;
  8740. var mouseListener =
  8741. {
  8742. currentState: null,
  8743. currentLink: null,
  8744. currentTarget: null,
  8745. highlight: (highlight != null && highlight != '' && highlight != mxConstants.NONE) ?
  8746. new mxCellHighlight(graph, highlight, 4) : null,
  8747. startX: 0,
  8748. startY: 0,
  8749. scrollLeft: 0,
  8750. scrollTop: 0,
  8751. updateCurrentState: function(me)
  8752. {
  8753. var tmp = me.sourceState;
  8754. // Gets first intersecting ancestor with link
  8755. if (tmp == null || graph.getLinkForCell(tmp.cell) == null)
  8756. {
  8757. var cell = graph.getCellAt(me.getGraphX(), me.getGraphY(), null, null, null, function(state, x, y)
  8758. {
  8759. return graph.getLinkForCell(state.cell) == null;
  8760. });
  8761. tmp = (tmp != null && !graph.model.isAncestor(cell, tmp.cell)) ? null : graph.view.getState(cell);
  8762. }
  8763. if (tmp != this.currentState)
  8764. {
  8765. if (this.currentState != null)
  8766. {
  8767. this.clear();
  8768. }
  8769. this.currentState = tmp;
  8770. if (this.currentState != null)
  8771. {
  8772. this.activate(this.currentState);
  8773. }
  8774. }
  8775. },
  8776. mouseDown: function(sender, me)
  8777. {
  8778. this.startX = me.getGraphX();
  8779. this.startY = me.getGraphY();
  8780. this.scrollLeft = graph.container.scrollLeft;
  8781. this.scrollTop = graph.container.scrollTop;
  8782. if (this.currentLink == null && graph.container.style.overflow == 'auto')
  8783. {
  8784. graph.container.style.cursor = 'move';
  8785. }
  8786. this.updateCurrentState(me);
  8787. },
  8788. mouseMove: function(sender, me)
  8789. {
  8790. if (graph.isMouseDown)
  8791. {
  8792. if (this.currentLink != null)
  8793. {
  8794. var dx = Math.abs(this.startX - me.getGraphX());
  8795. var dy = Math.abs(this.startY - me.getGraphY());
  8796. if (dx > tol || dy > tol)
  8797. {
  8798. this.clear();
  8799. }
  8800. }
  8801. }
  8802. else
  8803. {
  8804. // Checks for parent link
  8805. var linkNode = me.getSource();
  8806. while (linkNode != null && linkNode.nodeName.toLowerCase() != 'a')
  8807. {
  8808. linkNode = linkNode.parentNode;
  8809. }
  8810. if (linkNode != null)
  8811. {
  8812. this.clear();
  8813. }
  8814. else
  8815. {
  8816. if (graph.tooltipHandler != null && this.currentLink != null && this.currentState != null)
  8817. {
  8818. graph.tooltipHandler.reset(me, true, this.currentState);
  8819. }
  8820. if (this.currentState != null && (me.getState() == this.currentState || me.sourceState == null) &&
  8821. graph.intersects(this.currentState, me.getGraphX(), me.getGraphY()))
  8822. {
  8823. return;
  8824. }
  8825. this.updateCurrentState(me);
  8826. }
  8827. }
  8828. },
  8829. mouseUp: function(sender, me)
  8830. {
  8831. var source = me.getSource();
  8832. var evt = me.getEvent();
  8833. // Checks for parent link
  8834. var linkNode = source;
  8835. while (linkNode != null && linkNode.nodeName.toLowerCase() != 'a')
  8836. {
  8837. linkNode = linkNode.parentNode;
  8838. }
  8839. // Ignores clicks on links and collapse/expand icon
  8840. if (linkNode == null &&
  8841. (((Math.abs(this.scrollLeft - graph.container.scrollLeft) < tol &&
  8842. Math.abs(this.scrollTop - graph.container.scrollTop) < tol) &&
  8843. (me.sourceState == null || !me.isSource(me.sourceState.control))) &&
  8844. (((mxEvent.isLeftMouseButton(evt) || mxEvent.isMiddleMouseButton(evt)) &&
  8845. !mxEvent.isPopupTrigger(evt)) || mxEvent.isTouchEvent(evt))))
  8846. {
  8847. if (this.currentLink != null)
  8848. {
  8849. var blank = graph.isBlankLink(this.currentLink);
  8850. if ((this.currentLink.substring(0, 5) === 'data:' ||
  8851. !blank) && beforeClick != null)
  8852. {
  8853. beforeClick(evt, this.currentLink);
  8854. }
  8855. if (!mxEvent.isConsumed(evt))
  8856. {
  8857. var target = (this.currentTarget != null) ?
  8858. this.currentTarget : ((mxEvent.isMiddleMouseButton(evt)) ? '_blank' :
  8859. ((blank) ? graph.linkTarget : '_top'));
  8860. graph.openLink(this.currentLink, target);
  8861. me.consume();
  8862. }
  8863. }
  8864. else if (onClick != null && !me.isConsumed() &&
  8865. (Math.abs(this.scrollLeft - graph.container.scrollLeft) < tol &&
  8866. Math.abs(this.scrollTop - graph.container.scrollTop) < tol) &&
  8867. (Math.abs(this.startX - me.getGraphX()) < tol &&
  8868. Math.abs(this.startY - me.getGraphY()) < tol))
  8869. {
  8870. onClick(me.getEvent());
  8871. }
  8872. }
  8873. this.clear();
  8874. },
  8875. activate: function(state)
  8876. {
  8877. this.currentLink = graph.getAbsoluteUrl(graph.getLinkForCell(state.cell));
  8878. if (this.currentLink != null)
  8879. {
  8880. this.currentTarget = graph.getLinkTargetForCell(state.cell)
  8881. graph.container.style.cursor = 'pointer';
  8882. if (this.highlight != null)
  8883. {
  8884. this.highlight.highlight(state);
  8885. }
  8886. }
  8887. },
  8888. clear: function()
  8889. {
  8890. if (graph.container != null)
  8891. {
  8892. graph.container.style.cursor = cursor;
  8893. }
  8894. this.currentTarget = null;
  8895. this.currentState = null;
  8896. this.currentLink = null;
  8897. if (this.highlight != null)
  8898. {
  8899. this.highlight.hide();
  8900. }
  8901. if (graph.tooltipHandler != null)
  8902. {
  8903. graph.tooltipHandler.hide();
  8904. }
  8905. }
  8906. };
  8907. // Ignores built-in click handling
  8908. graph.click = function(me) {};
  8909. graph.addMouseListener(mouseListener);
  8910. mxEvent.addListener(document, 'mouseleave', function(evt)
  8911. {
  8912. mouseListener.clear();
  8913. });
  8914. };
  8915. /**
  8916. * Duplicates the given cells and returns the duplicates.
  8917. */
  8918. Graph.prototype.duplicateCells = function(cells, append)
  8919. {
  8920. cells = (cells != null) ? cells : this.getSelectionCells();
  8921. append = (append != null) ? append : true;
  8922. // Duplicates rows for table cells
  8923. for (var i = 0; i < cells.length; i++)
  8924. {
  8925. if (this.isTableCell(cells[i]))
  8926. {
  8927. cells[i] = this.model.getParent(cells[i]);
  8928. }
  8929. }
  8930. cells = this.model.getTopmostCells(cells);
  8931. var model = this.getModel();
  8932. var s = this.gridSize;
  8933. var select = [];
  8934. model.beginUpdate();
  8935. try
  8936. {
  8937. var cloneMap = new Object();
  8938. var lookup = this.createCellLookup(cells);
  8939. var clones = this.cloneCells(cells, false, cloneMap, true);
  8940. for (var i = 0; i < cells.length; i++)
  8941. {
  8942. var parent = model.getParent(cells[i]);
  8943. if (parent != null)
  8944. {
  8945. var child = this.moveCells([clones[i]], s, s, false)[0];
  8946. select.push(child);
  8947. if (append)
  8948. {
  8949. model.add(parent, clones[i]);
  8950. }
  8951. else
  8952. {
  8953. // Maintains child index by inserting after clone in parent
  8954. var index = parent.getIndex(cells[i]);
  8955. model.add(parent, clones[i], index + 1);
  8956. }
  8957. // Extends tables
  8958. if (this.isTable(parent))
  8959. {
  8960. var row = this.getCellGeometry(clones[i]);
  8961. var table = this.getCellGeometry(parent);
  8962. if (row != null && table != null)
  8963. {
  8964. table = table.clone();
  8965. table.height += row.height;
  8966. model.setGeometry(parent, table);
  8967. }
  8968. }
  8969. }
  8970. else
  8971. {
  8972. select.push(clones[i]);
  8973. }
  8974. }
  8975. // Updates custom links after inserting into the model for cells to have new IDs
  8976. this.updateCustomLinks(this.createCellMapping(cloneMap, lookup), clones, this);
  8977. this.fireEvent(new mxEventObject(mxEvent.CELLS_ADDED, 'cells', clones));
  8978. }
  8979. finally
  8980. {
  8981. model.endUpdate();
  8982. }
  8983. return select;
  8984. };
  8985. /**
  8986. * Inserts the given image at the cursor in a content editable text box using
  8987. * the insertimage command on the document instance.
  8988. */
  8989. Graph.prototype.insertImage = function(newValue, w, h)
  8990. {
  8991. // To find the new image, we create a list of all existing links first
  8992. if (newValue != null && this.cellEditor.textarea != null)
  8993. {
  8994. var tmp = this.cellEditor.textarea.getElementsByTagName('img');
  8995. var oldImages = [];
  8996. for (var i = 0; i < tmp.length; i++)
  8997. {
  8998. oldImages.push(tmp[i]);
  8999. }
  9000. // LATER: Fix inserting link/image in IE8/quirks after focus lost
  9001. document.execCommand('insertimage', false, newValue);
  9002. // Sets size of new image
  9003. var newImages = this.cellEditor.textarea.getElementsByTagName('img');
  9004. if (newImages.length == oldImages.length + 1)
  9005. {
  9006. // Inverse order in favor of appended images
  9007. for (var i = newImages.length - 1; i >= 0; i--)
  9008. {
  9009. if (i == 0 || newImages[i] != oldImages[i - 1])
  9010. {
  9011. // Workaround for lost styles during undo and redo is using attributes
  9012. newImages[i].setAttribute('width', w);
  9013. newImages[i].setAttribute('height', h);
  9014. break;
  9015. }
  9016. }
  9017. }
  9018. }
  9019. };
  9020. /**
  9021. * Inserts the given image at the cursor in a content editable text box using
  9022. * the insertimage command on the document instance.
  9023. */
  9024. Graph.prototype.insertLink = function(value)
  9025. {
  9026. if (this.cellEditor.textarea != null)
  9027. {
  9028. if (value.length == 0)
  9029. {
  9030. document.execCommand('unlink', false);
  9031. }
  9032. else if (mxClient.IS_FF)
  9033. {
  9034. // Workaround for Firefox that adds a new link and removes
  9035. // the href from the inner link if its parent is a span is
  9036. // to remove all inner links inside the new outer link
  9037. var tmp = this.cellEditor.textarea.getElementsByTagName('a');
  9038. var oldLinks = [];
  9039. for (var i = 0; i < tmp.length; i++)
  9040. {
  9041. oldLinks.push(tmp[i]);
  9042. }
  9043. document.execCommand('createlink', false, mxUtils.trim(value));
  9044. // Finds the new link element
  9045. var newLinks = this.cellEditor.textarea.getElementsByTagName('a');
  9046. if (newLinks.length == oldLinks.length + 1)
  9047. {
  9048. // Inverse order in favor of appended links
  9049. for (var i = newLinks.length - 1; i >= 0; i--)
  9050. {
  9051. if (newLinks[i] != oldLinks[i - 1])
  9052. {
  9053. // Removes all inner links from the new link and
  9054. // moves the children to the inner link parent
  9055. var tmp = newLinks[i].getElementsByTagName('a');
  9056. while (tmp.length > 0)
  9057. {
  9058. var parent = tmp[0].parentNode;
  9059. while (tmp[0].firstChild != null)
  9060. {
  9061. parent.insertBefore(tmp[0].firstChild, tmp[0]);
  9062. }
  9063. parent.removeChild(tmp[0]);
  9064. }
  9065. break;
  9066. }
  9067. }
  9068. }
  9069. }
  9070. else
  9071. {
  9072. // LATER: Fix inserting link/image in IE8/quirks after focus lost
  9073. document.execCommand('createlink', false, mxUtils.trim(value));
  9074. }
  9075. }
  9076. };
  9077. /**
  9078. *
  9079. * @param cell
  9080. * @returns {Boolean}
  9081. */
  9082. Graph.prototype.isCellResizable = function(cell)
  9083. {
  9084. var result = mxGraph.prototype.isCellResizable.apply(this, arguments);
  9085. var style = this.getCurrentCellStyle(cell);
  9086. return !this.isTableCell(cell) && !this.isTableRow(cell) && (result ||
  9087. (mxUtils.getValue(style, mxConstants.STYLE_RESIZABLE, '1') != '0' &&
  9088. style[mxConstants.STYLE_WHITE_SPACE] == 'wrap'));
  9089. };
  9090. /**
  9091. * Function: distributeCells
  9092. *
  9093. * Distribuets the centers of the given cells equally along the available
  9094. * horizontal or vertical space.
  9095. *
  9096. * Parameters:
  9097. *
  9098. * horizontal - Boolean that specifies the direction of the distribution.
  9099. * cells - Optional array of <mxCells> to be distributed. Edges are ignored.
  9100. */
  9101. Graph.prototype.distributeCells = function(horizontal, cells, spacing)
  9102. {
  9103. if (cells == null)
  9104. {
  9105. cells = this.getSelectionCells();
  9106. }
  9107. if (cells != null && cells.length > 1)
  9108. {
  9109. var vertices = [];
  9110. var max = null;
  9111. var min = null;
  9112. var cellsSize = 0;
  9113. for (var i = 0; i < cells.length; i++)
  9114. {
  9115. if (this.getModel().isVertex(cells[i]))
  9116. {
  9117. var state = this.view.getState(cells[i]);
  9118. if (state != null)
  9119. {
  9120. var tmp = (horizontal) ? state.getCenterX() : state.getCenterY();
  9121. max = (max != null) ? Math.max(max, tmp) : tmp;
  9122. min = (min != null) ? Math.min(min, tmp) : tmp;
  9123. if (spacing)
  9124. {
  9125. cellsSize += (horizontal) ? state.width : state.height;
  9126. }
  9127. vertices.push(state);
  9128. }
  9129. }
  9130. }
  9131. if (vertices.length > 2)
  9132. {
  9133. vertices.sort(function(a, b)
  9134. {
  9135. return (horizontal) ? a.x - b.x : a.y - b.y;
  9136. });
  9137. if (spacing)
  9138. {
  9139. cellsSize -= (horizontal? (vertices[0].width / 2 + vertices[vertices.length - 1].width / 2) :
  9140. (vertices[0].height / 2 + vertices[vertices.length - 1].height / 2))
  9141. }
  9142. var t = this.view.translate;
  9143. var s = this.view.scale;
  9144. min = min / s - ((horizontal) ? t.x : t.y);
  9145. max = max / s - ((horizontal) ? t.x : t.y);
  9146. this.getModel().beginUpdate();
  9147. try
  9148. {
  9149. var dt = (max - min - cellsSize) / (vertices.length - 1);
  9150. var t0 = min + (spacing? (horizontal? vertices[0].width / 2 : vertices[0].height / 2) : 0);
  9151. for (var i = 1; i < vertices.length - 1; i++)
  9152. {
  9153. var pstate = this.view.getState(this.model.getParent(vertices[i].cell));
  9154. var geo = this.getCellGeometry(vertices[i].cell);
  9155. t0 += dt;
  9156. if (geo != null && pstate != null)
  9157. {
  9158. geo = geo.clone();
  9159. if (horizontal)
  9160. {
  9161. geo.x = Math.round(t0 - (spacing? 0 : geo.width / 2)) - pstate.origin.x;
  9162. }
  9163. else
  9164. {
  9165. geo.y = Math.round(t0 - (spacing? 0 : geo.height / 2)) - pstate.origin.y;
  9166. }
  9167. this.getModel().setGeometry(vertices[i].cell, geo);
  9168. }
  9169. if (spacing)
  9170. {
  9171. t0 += horizontal? vertices[i].width : vertices[i].height;
  9172. }
  9173. }
  9174. }
  9175. finally
  9176. {
  9177. this.getModel().endUpdate();
  9178. }
  9179. }
  9180. }
  9181. return cells;
  9182. };
  9183. /**
  9184. * Adds meta-drag an Mac.
  9185. * @param evt
  9186. * @returns
  9187. */
  9188. Graph.prototype.isCloneEvent = function(evt)
  9189. {
  9190. return (mxClient.IS_MAC && mxEvent.isMetaDown(evt)) || mxEvent.isControlDown(evt);
  9191. };
  9192. /**
  9193. * Translates this point by the given vector.
  9194. *
  9195. * @param {number} dx X-coordinate of the translation.
  9196. * @param {number} dy Y-coordinate of the translation.
  9197. */
  9198. Graph.prototype.createSvgImageExport = function()
  9199. {
  9200. var exp = new mxImageExport();
  9201. // Adds hyperlinks (experimental)
  9202. exp.getLinkForCellState = mxUtils.bind(this, function(state, canvas)
  9203. {
  9204. return this.getLinkForCell(state.cell);
  9205. });
  9206. // Adds tooltips (experimental)
  9207. exp.getTitleForCellState = mxUtils.bind(this, function(state, canvas)
  9208. {
  9209. return Editor.convertHtmlToText(this.convertValueToTooltip(state.cell));
  9210. });
  9211. return exp;
  9212. };
  9213. /**
  9214. * Parses the given background image.
  9215. */
  9216. Graph.prototype.parseBackgroundImage = function(json)
  9217. {
  9218. var result = null;
  9219. if (json != null && json.length > 0)
  9220. {
  9221. var obj = JSON.parse(json);
  9222. result = new mxImage(obj.src, obj.width, obj.height)
  9223. }
  9224. return result;
  9225. };
  9226. /**
  9227. * Parses the given background image.
  9228. */
  9229. Graph.prototype.getBackgroundImageObject = function(obj)
  9230. {
  9231. return obj;
  9232. };
  9233. /**
  9234. * Translates this point by the given vector.
  9235. *
  9236. * @param {number} dx X-coordinate of the translation.
  9237. * @param {number} dy Y-coordinate of the translation.
  9238. */
  9239. Graph.prototype.getSvg = function(background, scale, border, nocrop, crisp,
  9240. ignoreSelection, showText, imgExport, linkTarget, hasShadow, incExtFonts,
  9241. keepTheme, exportType, cells)
  9242. {
  9243. var lookup = null;
  9244. if (cells != null)
  9245. {
  9246. lookup = new mxDictionary();
  9247. for (var i = 0; i < cells.length; i++)
  9248. {
  9249. lookup.put(cells[i], true);
  9250. }
  9251. }
  9252. //Disable Css Transforms if it is used
  9253. var origUseCssTrans = this.useCssTransforms;
  9254. if (origUseCssTrans)
  9255. {
  9256. this.useCssTransforms = false;
  9257. this.view.revalidate();
  9258. this.sizeDidChange();
  9259. }
  9260. try
  9261. {
  9262. scale = (scale != null) ? scale : 1;
  9263. border = (border != null) ? border : 0;
  9264. crisp = (crisp != null) ? crisp : true;
  9265. ignoreSelection = (ignoreSelection != null) ? ignoreSelection : true;
  9266. showText = (showText != null) ? showText : true;
  9267. hasShadow = (hasShadow != null) ? hasShadow : false;
  9268. var bounds = (exportType == 'page') ? this.view.getBackgroundPageBounds() :
  9269. (((ignoreSelection && lookup == null) || nocrop ||
  9270. exportType == 'diagram') ? this.getGraphBounds() :
  9271. this.getBoundingBox(this.getSelectionCells()));
  9272. var vs = this.view.scale;
  9273. if (exportType == 'diagram' && this.backgroundImage != null)
  9274. {
  9275. bounds = mxRectangle.fromRectangle(bounds);
  9276. bounds.add(new mxRectangle(
  9277. (this.view.translate.x + this.backgroundImage.x) * vs,
  9278. (this.view.translate.y + this.backgroundImage.y) * vs,
  9279. this.backgroundImage.width * vs,
  9280. this.backgroundImage.height * vs));
  9281. }
  9282. if (bounds == null)
  9283. {
  9284. throw Error(mxResources.get('drawingEmpty'));
  9285. }
  9286. // Prepares SVG document that holds the output
  9287. var s = scale / vs;
  9288. var w = Math.max(1, Math.ceil(bounds.width * s) + 2 * border) +
  9289. ((hasShadow && border == 0) ? 5 : 0);
  9290. var h = Math.max(1, Math.ceil(bounds.height * s) + 2 * border) +
  9291. ((hasShadow && border == 0) ? 5 : 0);
  9292. var tmp = (crisp) ? -0.5 : 0;
  9293. var root = Graph.createSvgNode(tmp, tmp, w, h, background);
  9294. var svgDoc = root.ownerDocument;
  9295. // Renders graph. Offset will be multiplied with state's scale when painting state.
  9296. // TextOffset only seems to affect FF output but used everywhere for consistency.
  9297. var group = (svgDoc.createElementNS != null) ?
  9298. svgDoc.createElementNS(mxConstants.NS_SVG, 'g') : svgDoc.createElement('g');
  9299. root.appendChild(group);
  9300. var svgCanvas = this.createSvgCanvas(group);
  9301. svgCanvas.foOffset = (crisp) ? -0.5 : 0;
  9302. svgCanvas.textOffset = (crisp) ? -0.5 : 0;
  9303. svgCanvas.imageOffset = (crisp) ? -0.5 : 0;
  9304. svgCanvas.translate(Math.floor(border / scale - bounds.x / vs),
  9305. Math.floor(border / scale - bounds.y / vs));
  9306. // Convert HTML entities
  9307. var htmlConverter = document.createElement('div');
  9308. // Adds simple text fallback for viewers with no support for foreignObjects
  9309. var getAlternateText = svgCanvas.getAlternateText;
  9310. svgCanvas.getAlternateText = function(fo, x, y, w, h, str,
  9311. align, valign, wrap, format, overflow, clip, rotation)
  9312. {
  9313. // Assumes a max character width of 0.5em
  9314. if (str != null && this.state.fontSize > 0)
  9315. {
  9316. try
  9317. {
  9318. if (mxUtils.isNode(str))
  9319. {
  9320. str = str.innerText;
  9321. }
  9322. else
  9323. {
  9324. htmlConverter.innerHTML = str;
  9325. str = mxUtils.extractTextWithWhitespace(htmlConverter.childNodes);
  9326. }
  9327. // Workaround for substring breaking double byte UTF
  9328. var exp = Math.ceil(2 * w / this.state.fontSize);
  9329. var result = [];
  9330. var length = 0;
  9331. var index = 0;
  9332. while ((exp == 0 || length < exp) && index < str.length)
  9333. {
  9334. var char = str.charCodeAt(index);
  9335. if (char == 10 || char == 13)
  9336. {
  9337. if (length > 0)
  9338. {
  9339. break;
  9340. }
  9341. }
  9342. else
  9343. {
  9344. result.push(str.charAt(index));
  9345. if (char < 255)
  9346. {
  9347. length++;
  9348. }
  9349. }
  9350. index++;
  9351. }
  9352. // Uses result and adds ellipsis if more than 1 char remains
  9353. if (result.length < str.length && str.length - result.length > 1)
  9354. {
  9355. str = mxUtils.trim(result.join('')) + '...';
  9356. }
  9357. return str;
  9358. }
  9359. catch (e)
  9360. {
  9361. return getAlternateText.apply(this, arguments);
  9362. }
  9363. }
  9364. else
  9365. {
  9366. return getAlternateText.apply(this, arguments);
  9367. }
  9368. };
  9369. // Paints background image
  9370. var bgImg = this.backgroundImage;
  9371. if (bgImg != null)
  9372. {
  9373. var s2 = vs / scale;
  9374. var tr = this.view.translate;
  9375. var tmp = new mxRectangle((bgImg.x + tr.x) * s2, (bgImg.y + tr.y) * s2,
  9376. bgImg.width * s2, bgImg.height * s2);
  9377. // Checks if visible
  9378. if (mxUtils.intersects(bounds, tmp))
  9379. {
  9380. svgCanvas.image(bgImg.x + tr.x, bgImg.y + tr.y,
  9381. bgImg.width, bgImg.height, bgImg.src, true);
  9382. }
  9383. }
  9384. svgCanvas.scale(s);
  9385. svgCanvas.textEnabled = showText;
  9386. imgExport = (imgExport != null) ? imgExport : this.createSvgImageExport();
  9387. var imgExportDrawCellState = imgExport.drawCellState;
  9388. // Ignores custom links
  9389. var imgExportGetLinkForCellState = imgExport.getLinkForCellState;
  9390. imgExport.getLinkForCellState = function(state, canvas)
  9391. {
  9392. var result = imgExportGetLinkForCellState.apply(this, arguments);
  9393. return (result != null && !state.view.graph.isCustomLink(result)) ? result : null;
  9394. };
  9395. imgExport.getLinkTargetForCellState = function(state, canvas)
  9396. {
  9397. return state.view.graph.getLinkTargetForCell(state.cell);
  9398. };
  9399. // Implements ignoreSelection flag
  9400. imgExport.drawCellState = function(state, canvas)
  9401. {
  9402. var graph = state.view.graph;
  9403. var selected = (lookup != null) ? lookup.get(state.cell) :
  9404. graph.isCellSelected(state.cell);
  9405. var parent = graph.model.getParent(state.cell);
  9406. // Checks if parent cell is selected
  9407. while ((!ignoreSelection || lookup != null) &&
  9408. !selected && parent != null)
  9409. {
  9410. selected = (lookup != null) ? lookup.get(parent) :
  9411. graph.isCellSelected(parent);
  9412. parent = graph.model.getParent(parent);
  9413. }
  9414. if ((ignoreSelection && lookup == null) || selected)
  9415. {
  9416. graph.view.redrawEnumerationState(state);
  9417. imgExportDrawCellState.apply(this, arguments);
  9418. this.doDrawShape(state.secondLabel, canvas);
  9419. }
  9420. };
  9421. var viewRoot = (this.view.currentRoot != null) ?
  9422. this.view.currentRoot : this.model.root;
  9423. imgExport.drawState(this.getView().getState(viewRoot), svgCanvas);
  9424. this.updateSvgLinks(root, linkTarget, true);
  9425. this.addForeignObjectWarning(svgCanvas, root);
  9426. return root;
  9427. }
  9428. finally
  9429. {
  9430. if (origUseCssTrans)
  9431. {
  9432. this.useCssTransforms = true;
  9433. this.view.revalidate();
  9434. this.sizeDidChange();
  9435. }
  9436. }
  9437. };
  9438. /**
  9439. * Adds warning for truncated labels in older viewers.
  9440. */
  9441. Graph.prototype.addForeignObjectWarning = function(canvas, root)
  9442. {
  9443. if (urlParams['svg-warning'] != '0' && root.getElementsByTagName('foreignObject').length > 0)
  9444. {
  9445. var sw = canvas.createElement('switch');
  9446. var g1 = canvas.createElement('g');
  9447. g1.setAttribute('requiredFeatures', 'http://www.w3.org/TR/SVG11/feature#Extensibility');
  9448. var a = canvas.createElement('a');
  9449. a.setAttribute('transform', 'translate(0,-5)');
  9450. // Workaround for implicit namespace handling in HTML5 export, IE adds NS1 namespace so use code below
  9451. // in all IE versions except quirks mode. KNOWN: Adds xlink namespace to each image tag in output.
  9452. if (a.setAttributeNS == null || (root.ownerDocument != document && document.documentMode == null))
  9453. {
  9454. a.setAttribute('xlink:href', Graph.foreignObjectWarningLink);
  9455. a.setAttribute('target', '_blank');
  9456. }
  9457. else
  9458. {
  9459. a.setAttributeNS(mxConstants.NS_XLINK, 'xlink:href', Graph.foreignObjectWarningLink);
  9460. a.setAttributeNS(mxConstants.NS_XLINK, 'target', '_blank');
  9461. }
  9462. var text = canvas.createElement('text');
  9463. text.setAttribute('text-anchor', 'middle');
  9464. text.setAttribute('font-size', '10px');
  9465. text.setAttribute('x', '50%');
  9466. text.setAttribute('y', '100%');
  9467. mxUtils.write(text, Graph.foreignObjectWarningText);
  9468. sw.appendChild(g1);
  9469. a.appendChild(text);
  9470. sw.appendChild(a);
  9471. root.appendChild(sw);
  9472. }
  9473. };
  9474. /**
  9475. * Hook for creating the canvas used in getSvg.
  9476. */
  9477. Graph.prototype.updateSvgLinks = function(node, target, removeCustom)
  9478. {
  9479. var links = node.getElementsByTagName('a');
  9480. for (var i = 0; i < links.length; i++)
  9481. {
  9482. if (links[i].getAttribute('target') == null)
  9483. {
  9484. var href = links[i].getAttribute('href');
  9485. if (href == null)
  9486. {
  9487. href = links[i].getAttribute('xlink:href');
  9488. }
  9489. if (href != null)
  9490. {
  9491. if (target != null && /^https?:\/\//.test(href))
  9492. {
  9493. links[i].setAttribute('target', target);
  9494. }
  9495. else if (removeCustom && this.isCustomLink(href))
  9496. {
  9497. links[i].setAttribute('href', 'javascript:void(0);');
  9498. }
  9499. }
  9500. }
  9501. }
  9502. };
  9503. /**
  9504. * Hook for creating the canvas used in getSvg.
  9505. */
  9506. Graph.prototype.createSvgCanvas = function(node)
  9507. {
  9508. var canvas = new mxSvgCanvas2D(node);
  9509. canvas.minStrokeWidth = this.cellRenderer.minSvgStrokeWidth;
  9510. canvas.pointerEvents = true;
  9511. return canvas;
  9512. };
  9513. /**
  9514. *
  9515. */
  9516. Graph.prototype.getSelectedTextBlocks = function()
  9517. {
  9518. // See https://stackoverflow.com/questions/667951/how-to-get-nodes-lying-inside-a-range-with-javascript
  9519. function getNextNode(node)
  9520. {
  9521. if (node.firstChild)
  9522. return node.firstChild;
  9523. while (node)
  9524. {
  9525. if (node.nextSibling)
  9526. return node.nextSibling;
  9527. node = node.parentNode;
  9528. }
  9529. };
  9530. function getNodesInRange(range)
  9531. {
  9532. var start = range.startContainer;
  9533. var end = range.endContainer;
  9534. var commonAncestor = range.commonAncestorContainer;
  9535. var nodes = [];
  9536. var node;
  9537. // walk parent nodes from start to common ancestor
  9538. for (node = start.parentNode; node; node = node.parentNode)
  9539. {
  9540. nodes.push(node);
  9541. if (node == commonAncestor)
  9542. break;
  9543. }
  9544. nodes.reverse();
  9545. // walk children and siblings from start until end is found
  9546. for (node = start; node; node = getNextNode(node))
  9547. {
  9548. nodes.push(node);
  9549. if (node == end)
  9550. break;
  9551. }
  9552. return nodes;
  9553. };
  9554. var nodes = [this.getSelectedElement()];
  9555. if (window.getSelection)
  9556. {
  9557. var sel = window.getSelection();
  9558. if (sel.getRangeAt && sel.rangeCount)
  9559. {
  9560. nodes = getNodesInRange(sel.getRangeAt(0));
  9561. }
  9562. }
  9563. var result = [];
  9564. for (var i = 0; i < nodes.length; i++)
  9565. {
  9566. var node = nodes[i];
  9567. while (this.cellEditor.textarea != null &&
  9568. this.cellEditor.textarea.contains(node) &&
  9569. node != this.cellEditor.textarea &&
  9570. node.parentNode != null)
  9571. {
  9572. if (node.nodeType == mxConstants.NODETYPE_ELEMENT &&
  9573. mxUtils.getCurrentStyle(node).display == 'block')
  9574. {
  9575. if (mxUtils.indexOf(result, node) < 0)
  9576. {
  9577. result.push(node);
  9578. }
  9579. break;
  9580. }
  9581. else
  9582. {
  9583. node = node.parentNode;
  9584. }
  9585. }
  9586. }
  9587. return result;
  9588. };
  9589. /**
  9590. * Returns the first ancestor of the current selection with the given name.
  9591. */
  9592. Graph.prototype.getSelectedElement = function()
  9593. {
  9594. var node = null;
  9595. if (window.getSelection)
  9596. {
  9597. var sel = window.getSelection();
  9598. if (sel.getRangeAt && sel.rangeCount)
  9599. {
  9600. var range = sel.getRangeAt(0);
  9601. node = range.commonAncestorContainer;
  9602. }
  9603. }
  9604. else if (document.selection)
  9605. {
  9606. node = document.selection.createRange().parentElement();
  9607. }
  9608. return node;
  9609. };
  9610. /**
  9611. * Returns the text editing element.
  9612. */
  9613. Graph.prototype.getSelectedEditingElement = function()
  9614. {
  9615. var node = this.getSelectedElement();
  9616. while (node != null && node.nodeType != mxConstants.NODETYPE_ELEMENT)
  9617. {
  9618. node = node.parentNode;
  9619. }
  9620. if (node != null)
  9621. {
  9622. // Workaround for commonAncestor on range in IE11 returning parent of common ancestor
  9623. if (node == this.cellEditor.textarea && this.cellEditor.textarea.children.length == 1 &&
  9624. this.cellEditor.textarea.firstChild.nodeType == mxConstants.NODETYPE_ELEMENT)
  9625. {
  9626. node = this.cellEditor.textarea.firstChild;
  9627. }
  9628. }
  9629. return node;
  9630. };
  9631. /**
  9632. * Returns the first ancestor of the current selection with the given name.
  9633. */
  9634. Graph.prototype.getParentByName = function(node, name, stopAt)
  9635. {
  9636. while (node != null)
  9637. {
  9638. if (node.nodeName == name)
  9639. {
  9640. return node;
  9641. }
  9642. if (node == stopAt)
  9643. {
  9644. return null;
  9645. }
  9646. node = node.parentNode;
  9647. }
  9648. return node;
  9649. };
  9650. /**
  9651. * Returns the first ancestor of the current selection with the given name.
  9652. */
  9653. Graph.prototype.getParentByNames = function(node, names, stopAt)
  9654. {
  9655. while (node != null)
  9656. {
  9657. if (mxUtils.indexOf(names, node.nodeName) >= 0)
  9658. {
  9659. return node;
  9660. }
  9661. if (node == stopAt)
  9662. {
  9663. return null;
  9664. }
  9665. node = node.parentNode;
  9666. }
  9667. return node;
  9668. };
  9669. /**
  9670. * Selects the given node.
  9671. */
  9672. Graph.prototype.selectNode = function(node)
  9673. {
  9674. var sel = null;
  9675. // IE9 and non-IE
  9676. if (window.getSelection)
  9677. {
  9678. sel = window.getSelection();
  9679. if (sel.getRangeAt && sel.rangeCount)
  9680. {
  9681. var range = document.createRange();
  9682. range.selectNode(node);
  9683. sel.removeAllRanges();
  9684. sel.addRange(range);
  9685. }
  9686. }
  9687. // IE < 9
  9688. else if ((sel = document.selection) && sel.type != 'Control')
  9689. {
  9690. var originalRange = sel.createRange();
  9691. originalRange.collapse(true);
  9692. var range = sel.createRange();
  9693. range.setEndPoint('StartToStart', originalRange);
  9694. range.select();
  9695. }
  9696. };
  9697. /**
  9698. * Flips the given cells horizontally or vertically.
  9699. */
  9700. Graph.prototype.flipEdgePoints = function(cell, horizontal, c)
  9701. {
  9702. var geo = this.getCellGeometry(cell);
  9703. if (geo != null)
  9704. {
  9705. geo = geo.clone();
  9706. if (geo.points != null)
  9707. {
  9708. for (var i = 0; i < geo.points.length; i++)
  9709. {
  9710. if (horizontal)
  9711. {
  9712. geo.points[i].x = c + (c - geo.points[i].x);
  9713. }
  9714. else
  9715. {
  9716. geo.points[i].y = c + (c - geo.points[i].y);
  9717. }
  9718. }
  9719. }
  9720. var flipTerminalPoint = function(pt)
  9721. {
  9722. if (pt != null)
  9723. {
  9724. if (horizontal)
  9725. {
  9726. pt.x = c + (c - pt.x);
  9727. }
  9728. else
  9729. {
  9730. pt.y = c + (c - pt.y);
  9731. }
  9732. }
  9733. };
  9734. flipTerminalPoint(geo.getTerminalPoint(true));
  9735. flipTerminalPoint(geo.getTerminalPoint(false));
  9736. this.model.setGeometry(cell, geo);
  9737. }
  9738. };
  9739. /**
  9740. * Flips the given cells horizontally or vertically.
  9741. */
  9742. Graph.prototype.flipChildren = function(cell, horizontal, c)
  9743. {
  9744. this.model.beginUpdate();
  9745. try
  9746. {
  9747. var childCount = this.model.getChildCount(cell);
  9748. for (var i = 0; i < childCount; i++)
  9749. {
  9750. var child = this.model.getChildAt(cell, i);
  9751. if (this.model.isEdge(child))
  9752. {
  9753. this.flipEdgePoints(child, horizontal, c);
  9754. }
  9755. else
  9756. {
  9757. var geo = this.getCellGeometry(child);
  9758. if (geo != null)
  9759. {
  9760. geo = geo.clone();
  9761. if (horizontal)
  9762. {
  9763. geo.x = c + (c - geo.x - geo.width);
  9764. }
  9765. else
  9766. {
  9767. geo.y = c + (c - geo.y - geo.height);
  9768. }
  9769. this.model.setGeometry(child, geo);
  9770. }
  9771. }
  9772. }
  9773. }
  9774. finally
  9775. {
  9776. this.model.endUpdate();
  9777. }
  9778. };
  9779. /**
  9780. * Flips the given cells horizontally or vertically.
  9781. */
  9782. Graph.prototype.flipCells = function(cells, horizontal)
  9783. {
  9784. this.model.beginUpdate();
  9785. try
  9786. {
  9787. cells = this.model.getTopmostCells(cells);
  9788. var vertices = [];
  9789. for (var i = 0; i < cells.length; i++)
  9790. {
  9791. if (this.model.isEdge(cells[i]))
  9792. {
  9793. var state = this.view.getState(cells[i]);
  9794. if (state != null)
  9795. {
  9796. this.flipEdgePoints(cells[i], horizontal, ((horizontal ? state.getCenterX() :
  9797. state.getCenterY()) / this.view.scale) - ((horizontal) ?
  9798. state.origin.x : state.origin.y) - ((horizontal) ?
  9799. this.view.translate.x : this.view.translate.y));
  9800. }
  9801. }
  9802. else
  9803. {
  9804. var geo = this.getCellGeometry(cells[i]);
  9805. if (geo != null)
  9806. {
  9807. this.flipChildren(cells[i], horizontal, horizontal ?
  9808. geo.getCenterX() - geo.x :
  9809. geo.getCenterY() - geo.y);
  9810. }
  9811. vertices.push(cells[i]);
  9812. }
  9813. }
  9814. this.toggleCellStyles(horizontal ? mxConstants.STYLE_FLIPH :
  9815. mxConstants.STYLE_FLIPV, false, vertices);
  9816. }
  9817. finally
  9818. {
  9819. this.model.endUpdate();
  9820. }
  9821. };
  9822. /**
  9823. * Deletes the given cells and returns the cells to be selected.
  9824. */
  9825. Graph.prototype.deleteCells = function(cells, includeEdges)
  9826. {
  9827. var select = null;
  9828. if (cells != null && cells.length > 0)
  9829. {
  9830. this.model.beginUpdate();
  9831. try
  9832. {
  9833. // Shrinks tables
  9834. for (var i = 0; i < cells.length; i++)
  9835. {
  9836. var parent = this.model.getParent(cells[i]);
  9837. if (this.isTable(parent))
  9838. {
  9839. var row = this.getCellGeometry(cells[i]);
  9840. var table = this.getCellGeometry(parent);
  9841. if (row != null && table != null)
  9842. {
  9843. table = table.clone();
  9844. table.height -= row.height;
  9845. this.model.setGeometry(parent, table);
  9846. }
  9847. }
  9848. }
  9849. var parents = (this.selectParentAfterDelete) ? this.model.getParents(cells) : null;
  9850. this.removeCells(cells, includeEdges);
  9851. }
  9852. finally
  9853. {
  9854. this.model.endUpdate();
  9855. }
  9856. // Selects parents for easier editing of groups
  9857. if (parents != null)
  9858. {
  9859. select = [];
  9860. for (var i = 0; i < parents.length; i++)
  9861. {
  9862. if (this.model.contains(parents[i]) &&
  9863. (this.model.isVertex(parents[i]) ||
  9864. this.model.isEdge(parents[i])))
  9865. {
  9866. select.push(parents[i]);
  9867. }
  9868. }
  9869. }
  9870. }
  9871. return select;
  9872. };
  9873. /**
  9874. * Inserts a column in the table for the given cell.
  9875. */
  9876. Graph.prototype.insertTableColumn = function(cell, before)
  9877. {
  9878. var model = this.getModel();
  9879. model.beginUpdate();
  9880. try
  9881. {
  9882. var table = cell;
  9883. var index = 0;
  9884. if (this.isTableCell(cell))
  9885. {
  9886. var row = model.getParent(cell);
  9887. table = model.getParent(row);
  9888. index = mxUtils.indexOf(model.getChildCells(row, true), cell);
  9889. }
  9890. else
  9891. {
  9892. if (this.isTableRow(cell))
  9893. {
  9894. table = model.getParent(cell);
  9895. }
  9896. else
  9897. {
  9898. cell = model.getChildCells(table, true)[0];
  9899. }
  9900. if (!before)
  9901. {
  9902. index = model.getChildCells(cell, true).length - 1;
  9903. }
  9904. }
  9905. var rows = model.getChildCells(table, true);
  9906. var dw = Graph.minTableColumnWidth;
  9907. for (var i = 0; i < rows.length; i++)
  9908. {
  9909. var child = model.getChildCells(rows[i], true)[index];
  9910. var clone = model.cloneCell(child, false);
  9911. // Handles possible missing child in row
  9912. if (clone == null)
  9913. {
  9914. clone = this.createVertex();
  9915. }
  9916. var geo = this.getCellGeometry(clone);
  9917. // Removes value, col/rowspan and alternate bounds
  9918. clone.value = null;
  9919. clone.style = mxUtils.setStyle(mxUtils.setStyle(
  9920. clone.style, 'rowspan', null), 'colspan', null);
  9921. if (geo != null)
  9922. {
  9923. if (geo.alternateBounds != null)
  9924. {
  9925. geo.width = geo.alternateBounds.width;
  9926. geo.height = geo.alternateBounds.height;
  9927. geo.alternateBounds = null;
  9928. }
  9929. dw = geo.width;
  9930. var rowGeo = this.getCellGeometry(rows[i]);
  9931. if (rowGeo != null)
  9932. {
  9933. geo.height = rowGeo.height;
  9934. }
  9935. }
  9936. model.add(rows[i], clone, index + ((before) ? 0 : 1));
  9937. }
  9938. var tableGeo = this.getCellGeometry(table);
  9939. if (tableGeo != null)
  9940. {
  9941. tableGeo = tableGeo.clone();
  9942. tableGeo.width += dw;
  9943. model.setGeometry(table, tableGeo);
  9944. }
  9945. }
  9946. finally
  9947. {
  9948. model.endUpdate();
  9949. }
  9950. };
  9951. /**
  9952. * Inserts a row in the table for the given cell.
  9953. */
  9954. Graph.prototype.deleteLane = function(cell)
  9955. {
  9956. var model = this.getModel();
  9957. model.beginUpdate();
  9958. try
  9959. {
  9960. var pool = null;
  9961. var lane = cell;
  9962. var style = this.getCurrentCellStyle(lane);
  9963. if (style['childLayout'] == 'stackLayout')
  9964. {
  9965. pool = lane;
  9966. }
  9967. else
  9968. {
  9969. pool = model.getParent(lane);
  9970. }
  9971. var lanes = model.getChildCells(pool, true);
  9972. if (lanes.length == 0)
  9973. {
  9974. model.remove(pool);
  9975. }
  9976. else
  9977. {
  9978. if (pool == lane)
  9979. {
  9980. lane = lanes[lanes.length - 1];
  9981. }
  9982. model.remove(lane);
  9983. }
  9984. }
  9985. finally
  9986. {
  9987. model.endUpdate();
  9988. }
  9989. };
  9990. /**
  9991. * Inserts a row in the table for the given cell.
  9992. */
  9993. Graph.prototype.insertLane = function(cell, before)
  9994. {
  9995. var model = this.getModel();
  9996. model.beginUpdate();
  9997. try
  9998. {
  9999. var pool = null;
  10000. var lane = cell;
  10001. var style = this.getCurrentCellStyle(lane);
  10002. if (style['childLayout'] == 'stackLayout')
  10003. {
  10004. pool = lane;
  10005. var lanes = model.getChildCells(pool, true);
  10006. lane = lanes[(before) ? 0 : lanes.length - 1];
  10007. }
  10008. else
  10009. {
  10010. pool = model.getParent(lane);
  10011. }
  10012. var index = pool.getIndex(lane);
  10013. lane = model.cloneCell(lane, false);
  10014. lane.value = null;
  10015. model.add(pool, lane, index + ((before) ? 0 : 1));
  10016. }
  10017. finally
  10018. {
  10019. model.endUpdate();
  10020. }
  10021. };
  10022. /**
  10023. * Inserts a row in the table for the given cell.
  10024. */
  10025. Graph.prototype.insertTableRow = function(cell, before)
  10026. {
  10027. var model = this.getModel();
  10028. model.beginUpdate();
  10029. try
  10030. {
  10031. var table = cell;
  10032. var row = cell;
  10033. if (this.isTableCell(cell))
  10034. {
  10035. row = model.getParent(cell);
  10036. table = model.getParent(row);
  10037. }
  10038. else if (this.isTableRow(cell))
  10039. {
  10040. table = model.getParent(cell);
  10041. }
  10042. else
  10043. {
  10044. var rows = model.getChildCells(table, true);
  10045. row = rows[(before) ? 0 : rows.length - 1];
  10046. }
  10047. var cells = model.getChildCells(row, true);
  10048. var index = table.getIndex(row);
  10049. row = model.cloneCell(row, false);
  10050. row.value = null;
  10051. var rowGeo = this.getCellGeometry(row);
  10052. if (rowGeo != null)
  10053. {
  10054. for (var i = 0; i < cells.length; i++)
  10055. {
  10056. var cell = model.cloneCell(cells[i], false);
  10057. // Removes value, col/rowspan and alternate bounds
  10058. cell.value = null;
  10059. cell.style = mxUtils.setStyle(mxUtils.setStyle(
  10060. cell.style, 'rowspan', null), 'colspan', null);
  10061. var geo = this.getCellGeometry(cell);
  10062. if (geo != null)
  10063. {
  10064. if (geo.alternateBounds != null)
  10065. {
  10066. geo.width = geo.alternateBounds.width;
  10067. geo.height = geo.alternateBounds.height;
  10068. geo.alternateBounds = null;
  10069. }
  10070. geo.height = rowGeo.height;
  10071. }
  10072. row.insert(cell);
  10073. }
  10074. model.add(table, row, index + ((before) ? 0 : 1));
  10075. var tableGeo = this.getCellGeometry(table);
  10076. if (tableGeo != null)
  10077. {
  10078. tableGeo = tableGeo.clone();
  10079. tableGeo.height += rowGeo.height;
  10080. model.setGeometry(table, tableGeo);
  10081. }
  10082. }
  10083. }
  10084. finally
  10085. {
  10086. model.endUpdate();
  10087. }
  10088. };
  10089. /**
  10090. *
  10091. */
  10092. Graph.prototype.deleteTableColumn = function(cell)
  10093. {
  10094. var model = this.getModel();
  10095. model.beginUpdate();
  10096. try
  10097. {
  10098. var table = cell;
  10099. var row = cell;
  10100. if (this.isTableCell(cell))
  10101. {
  10102. row = model.getParent(cell);
  10103. }
  10104. if (this.isTableRow(row))
  10105. {
  10106. table = model.getParent(row);
  10107. }
  10108. var rows = model.getChildCells(table, true);
  10109. if (rows.length == 0)
  10110. {
  10111. model.remove(table);
  10112. }
  10113. else
  10114. {
  10115. if (!this.isTableRow(row))
  10116. {
  10117. row = rows[0];
  10118. }
  10119. var cells = model.getChildCells(row, true);
  10120. if (cells.length <= 1)
  10121. {
  10122. model.remove(table);
  10123. }
  10124. else
  10125. {
  10126. var index = cells.length - 1;
  10127. if (this.isTableCell(cell))
  10128. {
  10129. index = mxUtils.indexOf(cells, cell);
  10130. }
  10131. var width = 0;
  10132. for (var i = 0; i < rows.length; i++)
  10133. {
  10134. var child = model.getChildCells(rows[i], true)[index];
  10135. model.remove(child);
  10136. var geo = this.getCellGeometry(child);
  10137. if (geo != null)
  10138. {
  10139. width = Math.max(width, geo.width);
  10140. }
  10141. }
  10142. var tableGeo = this.getCellGeometry(table);
  10143. if (tableGeo != null)
  10144. {
  10145. tableGeo = tableGeo.clone();
  10146. tableGeo.width -= width;
  10147. model.setGeometry(table, tableGeo);
  10148. }
  10149. }
  10150. }
  10151. }
  10152. finally
  10153. {
  10154. model.endUpdate();
  10155. }
  10156. };
  10157. /**
  10158. *
  10159. */
  10160. Graph.prototype.deleteTableRow = function(cell)
  10161. {
  10162. var model = this.getModel();
  10163. model.beginUpdate();
  10164. try
  10165. {
  10166. var table = cell;
  10167. var row = cell;
  10168. if (this.isTableCell(cell))
  10169. {
  10170. row = model.getParent(cell);
  10171. cell = row;
  10172. }
  10173. if (this.isTableRow(cell))
  10174. {
  10175. table = model.getParent(row);
  10176. }
  10177. var rows = model.getChildCells(table, true);
  10178. if (rows.length <= 1)
  10179. {
  10180. model.remove(table);
  10181. }
  10182. else
  10183. {
  10184. if (!this.isTableRow(row))
  10185. {
  10186. row = rows[rows.length - 1];
  10187. }
  10188. model.remove(row);
  10189. var height = 0;
  10190. var geo = this.getCellGeometry(row);
  10191. if (geo != null)
  10192. {
  10193. height = geo.height;
  10194. }
  10195. var tableGeo = this.getCellGeometry(table);
  10196. if (tableGeo != null)
  10197. {
  10198. tableGeo = tableGeo.clone();
  10199. tableGeo.height -= height;
  10200. model.setGeometry(table, tableGeo);
  10201. }
  10202. }
  10203. }
  10204. finally
  10205. {
  10206. model.endUpdate();
  10207. }
  10208. };
  10209. /**
  10210. * Inserts a new row into the given table.
  10211. */
  10212. Graph.prototype.insertRow = function(table, index)
  10213. {
  10214. var bd = table.tBodies[0];
  10215. var cells = bd.rows[0].cells;
  10216. var cols = 0;
  10217. // Counts columns including colspans
  10218. for (var i = 0; i < cells.length; i++)
  10219. {
  10220. var colspan = cells[i].getAttribute('colspan');
  10221. cols += (colspan != null) ? parseInt(colspan) : 1;
  10222. }
  10223. var row = bd.insertRow(index);
  10224. for (var i = 0; i < cols; i++)
  10225. {
  10226. mxUtils.br(row.insertCell(-1));
  10227. }
  10228. return row.cells[0];
  10229. };
  10230. /**
  10231. * Deletes the given column.
  10232. */
  10233. Graph.prototype.deleteRow = function(table, index)
  10234. {
  10235. table.tBodies[0].deleteRow(index);
  10236. };
  10237. /**
  10238. * Deletes the given column.
  10239. */
  10240. Graph.prototype.insertColumn = function(table, index)
  10241. {
  10242. var hd = table.tHead;
  10243. if (hd != null)
  10244. {
  10245. // TODO: use colIndex
  10246. for (var h = 0; h < hd.rows.length; h++)
  10247. {
  10248. var th = document.createElement('th');
  10249. hd.rows[h].appendChild(th);
  10250. mxUtils.br(th);
  10251. }
  10252. }
  10253. var bd = table.tBodies[0];
  10254. for (var i = 0; i < bd.rows.length; i++)
  10255. {
  10256. var cell = bd.rows[i].insertCell(index);
  10257. mxUtils.br(cell);
  10258. }
  10259. return bd.rows[0].cells[(index >= 0) ? index : bd.rows[0].cells.length - 1];
  10260. };
  10261. /**
  10262. * Deletes the given column.
  10263. */
  10264. Graph.prototype.deleteColumn = function(table, index)
  10265. {
  10266. if (index >= 0)
  10267. {
  10268. var bd = table.tBodies[0];
  10269. var rows = bd.rows;
  10270. for (var i = 0; i < rows.length; i++)
  10271. {
  10272. if (rows[i].cells.length > index)
  10273. {
  10274. rows[i].deleteCell(index);
  10275. }
  10276. }
  10277. }
  10278. };
  10279. /**
  10280. * Inserts the given HTML at the caret position (no undo).
  10281. */
  10282. Graph.prototype.pasteHtmlAtCaret = function(html)
  10283. {
  10284. var sel, range;
  10285. // IE9 and non-IE
  10286. if (window.getSelection)
  10287. {
  10288. sel = window.getSelection();
  10289. if (sel.getRangeAt && sel.rangeCount)
  10290. {
  10291. range = sel.getRangeAt(0);
  10292. range.deleteContents();
  10293. // Range.createContextualFragment() would be useful here but is
  10294. // only relatively recently standardized and is not supported in
  10295. // some browsers (IE9, for one)
  10296. var el = document.createElement("div");
  10297. el.innerHTML = html;
  10298. var frag = document.createDocumentFragment(), node;
  10299. while ((node = el.firstChild))
  10300. {
  10301. lastNode = frag.appendChild(node);
  10302. }
  10303. range.insertNode(frag);
  10304. }
  10305. }
  10306. // IE < 9
  10307. else if ((sel = document.selection) && sel.type != "Control")
  10308. {
  10309. // FIXME: Does not work if selection is empty
  10310. sel.createRange().pasteHTML(html);
  10311. }
  10312. };
  10313. /**
  10314. * Creates an anchor elements for handling the given link in the
  10315. * hint that is shown when the cell is selected.
  10316. */
  10317. Graph.prototype.createLinkForHint = function(link, label)
  10318. {
  10319. link = (link != null) ? link : 'javascript:void(0);';
  10320. if (label == null || label.length == 0)
  10321. {
  10322. if (this.isCustomLink(link))
  10323. {
  10324. label = this.getLinkTitle(link);
  10325. }
  10326. else
  10327. {
  10328. label = link;
  10329. }
  10330. }
  10331. // Helper function to shorten strings
  10332. function short(str, max)
  10333. {
  10334. if (str.length > max)
  10335. {
  10336. str = str.substring(0, Math.round(max / 2)) + '...' +
  10337. str.substring(str.length - Math.round(max / 4));
  10338. }
  10339. return str;
  10340. };
  10341. var a = document.createElement('a');
  10342. a.setAttribute('rel', this.linkRelation);
  10343. a.setAttribute('href', this.getAbsoluteUrl(link));
  10344. a.setAttribute('title', short((this.isCustomLink(link)) ?
  10345. this.getLinkTitle(link) : link, 80));
  10346. if (this.linkTarget != null)
  10347. {
  10348. a.setAttribute('target', this.linkTarget);
  10349. }
  10350. // Adds shortened label to link
  10351. mxUtils.write(a, short(label, 40));
  10352. // Handles custom links
  10353. if (this.isCustomLink(link))
  10354. {
  10355. mxEvent.addListener(a, 'click', mxUtils.bind(this, function(evt)
  10356. {
  10357. this.customLinkClicked(link);
  10358. mxEvent.consume(evt);
  10359. }));
  10360. }
  10361. return a;
  10362. };
  10363. /**
  10364. * Customized graph for touch devices.
  10365. */
  10366. Graph.prototype.initTouch = function()
  10367. {
  10368. // Disables new connections via "hotspot"
  10369. this.connectionHandler.marker.isEnabled = function()
  10370. {
  10371. return this.graph.connectionHandler.first != null;
  10372. };
  10373. // Hides menu when editing starts
  10374. this.addListener(mxEvent.START_EDITING, function(sender, evt)
  10375. {
  10376. this.popupMenuHandler.hideMenu();
  10377. });
  10378. // Adds custom hit detection if native hit detection found no cell
  10379. var graphUpdateMouseEvent = this.updateMouseEvent;
  10380. this.updateMouseEvent = function(me)
  10381. {
  10382. me = graphUpdateMouseEvent.apply(this, arguments);
  10383. if (mxEvent.isTouchEvent(me.getEvent()) && me.getState() == null)
  10384. {
  10385. var cell = this.getCellAt(me.graphX, me.graphY);
  10386. if (cell != null && this.isSwimlane(cell) && this.hitsSwimlaneContent(cell, me.graphX, me.graphY))
  10387. {
  10388. cell = null;
  10389. }
  10390. else
  10391. {
  10392. me.state = this.view.getState(cell);
  10393. if (me.state != null && me.state.shape != null)
  10394. {
  10395. this.container.style.cursor = me.state.shape.node.style.cursor;
  10396. }
  10397. }
  10398. }
  10399. if (me.getState() == null && this.isEnabled())
  10400. {
  10401. this.container.style.cursor = 'default';
  10402. }
  10403. return me;
  10404. };
  10405. // Context menu trigger implementation depending on current selection state
  10406. // combined with support for normal popup trigger.
  10407. var cellSelected = false;
  10408. var selectionEmpty = false;
  10409. var menuShowing = false;
  10410. var oldFireMouseEvent = this.fireMouseEvent;
  10411. this.fireMouseEvent = function(evtName, me, sender)
  10412. {
  10413. if (evtName == mxEvent.MOUSE_DOWN)
  10414. {
  10415. // For hit detection on edges
  10416. me = this.updateMouseEvent(me);
  10417. cellSelected = this.isCellSelected(me.getCell());
  10418. selectionEmpty = this.isSelectionEmpty();
  10419. menuShowing = this.popupMenuHandler.isMenuShowing();
  10420. }
  10421. oldFireMouseEvent.apply(this, arguments);
  10422. };
  10423. // Shows popup menu if cell was selected or selection was empty and background was clicked
  10424. // FIXME: Conflicts with mxPopupMenuHandler.prototype.getCellForPopupEvent in Editor.js by
  10425. // selecting parent for selected children in groups before this check can be made.
  10426. this.popupMenuHandler.mouseUp = mxUtils.bind(this, function(sender, me)
  10427. {
  10428. var isMouseEvent = mxEvent.isMouseEvent(me.getEvent());
  10429. this.popupMenuHandler.popupTrigger = !this.isEditing() && this.isEnabled() &&
  10430. (me.getState() == null || !me.isSource(me.getState().control)) &&
  10431. (this.popupMenuHandler.popupTrigger || (!menuShowing && !isMouseEvent &&
  10432. ((selectionEmpty && me.getCell() == null && this.isSelectionEmpty()) ||
  10433. (cellSelected && this.isCellSelected(me.getCell())))));
  10434. // Delays popup menu to allow for double tap to start editing
  10435. var popup = (!cellSelected || isMouseEvent) ? null : mxUtils.bind(this, function(cell)
  10436. {
  10437. window.setTimeout(mxUtils.bind(this, function()
  10438. {
  10439. if (!this.isEditing())
  10440. {
  10441. var origin = mxUtils.getScrollOrigin();
  10442. this.popupMenuHandler.popup(me.getX() + origin.x + 1,
  10443. me.getY() + origin.y + 1, cell, me.getEvent());
  10444. }
  10445. }), 300);
  10446. });
  10447. mxPopupMenuHandler.prototype.mouseUp.apply(this.popupMenuHandler, [sender, me, popup]);
  10448. });
  10449. };
  10450. /**
  10451. * HTML in-place editor
  10452. */
  10453. mxCellEditor.prototype.isContentEditing = function()
  10454. {
  10455. var state = this.graph.view.getState(this.editingCell);
  10456. return state != null && state.style['html'] == 1;
  10457. };
  10458. /**
  10459. * Returns true if all selected text is inside a table element.
  10460. */
  10461. mxCellEditor.prototype.isTableSelected = function()
  10462. {
  10463. return this.graph.getParentByName(
  10464. this.graph.getSelectedElement(),
  10465. 'TABLE', this.textarea) != null;
  10466. };
  10467. /**
  10468. * Returns true if text is selected.
  10469. */
  10470. mxCellEditor.prototype.isTextSelected = function()
  10471. {
  10472. var txt = '';
  10473. if (window.getSelection)
  10474. {
  10475. txt = window.getSelection();
  10476. }
  10477. else if (document.getSelection)
  10478. {
  10479. txt = document.getSelection();
  10480. }
  10481. else if (document.selection)
  10482. {
  10483. txt = document.selection.createRange().text;
  10484. }
  10485. return txt != '';
  10486. };
  10487. /**
  10488. * Inserts a tab at the cursor position.
  10489. */
  10490. mxCellEditor.prototype.insertTab = function(spaces)
  10491. {
  10492. var editor = this.textarea;
  10493. var doc = editor.ownerDocument.defaultView;
  10494. var sel = doc.getSelection();
  10495. var range = sel.getRangeAt(0);
  10496. var tabNode = Graph.createTabNode(spaces);
  10497. range.insertNode(tabNode);
  10498. range.setStartAfter(tabNode);
  10499. range.setEndAfter(tabNode);
  10500. sel.removeAllRanges();
  10501. sel.addRange(range);
  10502. };
  10503. /**
  10504. * Sets the alignment of the current selected cell. This sets the
  10505. * alignment in the cell style, removes all alignment within the
  10506. * text and invokes the built-in alignment function.
  10507. *
  10508. * Only the built-in function is invoked if shift is pressed or
  10509. * if table cells are selected and shift is not pressed.
  10510. */
  10511. mxCellEditor.prototype.alignText = function(align, evt)
  10512. {
  10513. var shiftPressed = evt != null && mxEvent.isShiftDown(evt);
  10514. if (shiftPressed || (window.getSelection != null && window.getSelection().containsNode != null))
  10515. {
  10516. var allSelected = true;
  10517. this.graph.processElements(this.textarea, function(node)
  10518. {
  10519. if (shiftPressed || window.getSelection().containsNode(node, true))
  10520. {
  10521. node.removeAttribute('align');
  10522. node.style.textAlign = null;
  10523. }
  10524. else
  10525. {
  10526. allSelected = false;
  10527. }
  10528. });
  10529. if (allSelected)
  10530. {
  10531. this.graph.cellEditor.setAlign(align);
  10532. }
  10533. }
  10534. document.execCommand('justify' + align.toLowerCase(), false, null);
  10535. };
  10536. /**
  10537. * Creates the keyboard event handler for the current graph and history.
  10538. */
  10539. mxCellEditor.prototype.saveSelection = function()
  10540. {
  10541. if (window.getSelection)
  10542. {
  10543. var sel = window.getSelection();
  10544. if (sel.getRangeAt && sel.rangeCount)
  10545. {
  10546. var ranges = [];
  10547. for (var i = 0, len = sel.rangeCount; i < len; ++i)
  10548. {
  10549. ranges.push(sel.getRangeAt(i));
  10550. }
  10551. return ranges;
  10552. }
  10553. }
  10554. else if (document.selection && document.selection.createRange)
  10555. {
  10556. return document.selection.createRange();
  10557. }
  10558. return null;
  10559. };
  10560. /**
  10561. * Creates the keyboard event handler for the current graph and history.
  10562. */
  10563. mxCellEditor.prototype.restoreSelection = function(savedSel)
  10564. {
  10565. try
  10566. {
  10567. if (savedSel)
  10568. {
  10569. if (window.getSelection)
  10570. {
  10571. sel = window.getSelection();
  10572. sel.removeAllRanges();
  10573. for (var i = 0, len = savedSel.length; i < len; ++i)
  10574. {
  10575. sel.addRange(savedSel[i]);
  10576. }
  10577. }
  10578. else if (document.selection && savedSel.select)
  10579. {
  10580. savedSel.select();
  10581. }
  10582. }
  10583. }
  10584. catch (e)
  10585. {
  10586. // ignore
  10587. }
  10588. };
  10589. /**
  10590. * Handling of special nl2Br style for not converting newlines to breaks in HTML labels.
  10591. * NOTE: Since it's easier to set this when the label is created we assume that it does
  10592. * not change during the lifetime of the mxText instance.
  10593. */
  10594. var mxCellRendererInitializeLabel = mxCellRenderer.prototype.initializeLabel;
  10595. mxCellRenderer.prototype.initializeLabel = function(state)
  10596. {
  10597. if (state.text != null)
  10598. {
  10599. state.text.replaceLinefeeds = mxUtils.getValue(state.style, 'nl2Br', '1') != '0';
  10600. }
  10601. mxCellRendererInitializeLabel.apply(this, arguments);
  10602. };
  10603. var mxConstraintHandlerUpdate = mxConstraintHandler.prototype.update;
  10604. mxConstraintHandler.prototype.update = function(me, source)
  10605. {
  10606. if (this.isKeepFocusEvent(me) || !mxEvent.isAltDown(me.getEvent()))
  10607. {
  10608. mxConstraintHandlerUpdate.apply(this, arguments);
  10609. }
  10610. else
  10611. {
  10612. this.reset();
  10613. }
  10614. };
  10615. /**
  10616. * No dashed shapes.
  10617. */
  10618. mxGuide.prototype.createGuideShape = function(horizontal)
  10619. {
  10620. var guide = new mxPolyline([], mxConstants.GUIDE_COLOR, mxConstants.GUIDE_STROKEWIDTH);
  10621. return guide;
  10622. };
  10623. /**
  10624. * HTML in-place editor
  10625. */
  10626. mxCellEditor.prototype.escapeCancelsEditing = false;
  10627. /**
  10628. * Overridden to set CSS classes.
  10629. */
  10630. var mxCellEditorStartEditing = mxCellEditor.prototype.startEditing;
  10631. mxCellEditor.prototype.startEditing = function(cell, trigger)
  10632. {
  10633. cell = this.graph.getStartEditingCell(cell, trigger);
  10634. mxCellEditorStartEditing.apply(this, arguments);
  10635. // Overrides class in case of HTML content to add
  10636. // dashed borders for divs and table cells
  10637. var state = this.graph.view.getState(cell);
  10638. if (state != null && state.style['html'] == 1)
  10639. {
  10640. this.textarea.className = 'mxCellEditor geContentEditable';
  10641. }
  10642. else
  10643. {
  10644. this.textarea.className = 'mxCellEditor mxPlainTextEditor';
  10645. }
  10646. // Toggles markup vs wysiwyg mode
  10647. this.codeViewMode = false;
  10648. // Stores current selection range when switching between markup and code
  10649. this.switchSelectionState = null;
  10650. // Selects editing cell
  10651. this.graph.setSelectionCell(cell);
  10652. // Enables focus outline for edges and edge labels
  10653. var parent = this.graph.getModel().getParent(cell);
  10654. var geo = this.graph.getCellGeometry(cell);
  10655. if ((this.graph.getModel().isEdge(parent) && geo != null && geo.relative) ||
  10656. this.graph.getModel().isEdge(cell))
  10657. {
  10658. // IE>8 and FF on Windows uses outline default of none
  10659. if (mxClient.IS_IE || mxClient.IS_IE11 || (mxClient.IS_FF && mxClient.IS_WIN))
  10660. {
  10661. this.textarea.style.outline = 'gray dotted 1px';
  10662. }
  10663. else
  10664. {
  10665. this.textarea.style.outline = '';
  10666. }
  10667. }
  10668. }
  10669. /**
  10670. * HTML in-place editor
  10671. */
  10672. var cellEditorInstallListeners = mxCellEditor.prototype.installListeners;
  10673. mxCellEditor.prototype.installListeners = function(elt)
  10674. {
  10675. cellEditorInstallListeners.apply(this, arguments);
  10676. // Adds a reference from the clone to the original node, recursively
  10677. function reference(node, clone)
  10678. {
  10679. clone.originalNode = node;
  10680. node = node.firstChild;
  10681. var child = clone.firstChild;
  10682. while (node != null && child != null)
  10683. {
  10684. reference(node, child);
  10685. node = node.nextSibling;
  10686. child = child.nextSibling;
  10687. }
  10688. return clone;
  10689. };
  10690. // Checks the given node for new nodes, recursively
  10691. function checkNode(node, clone)
  10692. {
  10693. if (node != null)
  10694. {
  10695. if (clone.originalNode != node)
  10696. {
  10697. cleanNode(node);
  10698. }
  10699. else
  10700. {
  10701. node = node.firstChild;
  10702. clone = clone.firstChild;
  10703. while (node != null)
  10704. {
  10705. var nextNode = node.nextSibling;
  10706. if (clone == null)
  10707. {
  10708. cleanNode(node);
  10709. }
  10710. else
  10711. {
  10712. checkNode(node, clone);
  10713. clone = clone.nextSibling;
  10714. }
  10715. node = nextNode;
  10716. }
  10717. }
  10718. }
  10719. };
  10720. // Removes unused DOM nodes and attributes, recursively
  10721. function cleanNode(node)
  10722. {
  10723. var child = node.firstChild;
  10724. while (child != null)
  10725. {
  10726. var next = child.nextSibling;
  10727. cleanNode(child);
  10728. child = next;
  10729. }
  10730. if ((node.nodeType != 1 || (node.nodeName !== 'BR' && node.firstChild == null)) &&
  10731. (node.nodeType != 3 || mxUtils.trim(mxUtils.getTextContent(node)).length == 0))
  10732. {
  10733. node.parentNode.removeChild(node);
  10734. }
  10735. else
  10736. {
  10737. // Removes linefeeds
  10738. if (node.nodeType == 3)
  10739. {
  10740. mxUtils.setTextContent(node, mxUtils.getTextContent(node).replace(/\n|\r/g, ''));
  10741. }
  10742. // Removes CSS classes and styles (for Word and Excel)
  10743. if (node.nodeType == 1)
  10744. {
  10745. node.removeAttribute('style');
  10746. node.removeAttribute('class');
  10747. node.removeAttribute('width');
  10748. node.removeAttribute('cellpadding');
  10749. node.removeAttribute('cellspacing');
  10750. node.removeAttribute('border');
  10751. }
  10752. }
  10753. };
  10754. // Handles paste from Word, Excel etc by removing styles, classnames and unused nodes
  10755. // LATER: Fix undo/redo for paste
  10756. if (document.documentMode !== 7 && document.documentMode !== 8)
  10757. {
  10758. mxEvent.addListener(this.textarea, 'paste', mxUtils.bind(this, function(evt)
  10759. {
  10760. var clone = reference(this.textarea, this.textarea.cloneNode(true));
  10761. window.setTimeout(mxUtils.bind(this, function()
  10762. {
  10763. if (this.textarea != null)
  10764. {
  10765. // Paste from Word or Excel
  10766. if (this.textarea.innerHTML.indexOf('<o:OfficeDocumentSettings>') >= 0 ||
  10767. this.textarea.innerHTML.indexOf('<!--[if !mso]>') >= 0)
  10768. {
  10769. checkNode(this.textarea, clone);
  10770. }
  10771. else
  10772. {
  10773. Graph.removePasteFormatting(this.textarea.firstChild);
  10774. }
  10775. }
  10776. }), 0);
  10777. }));
  10778. }
  10779. };
  10780. mxCellEditor.prototype.toggleViewMode = function()
  10781. {
  10782. var state = this.graph.view.getState(this.editingCell);
  10783. if (state != null)
  10784. {
  10785. var nl2Br = state != null && mxUtils.getValue(state.style, 'nl2Br', '1') != '0';
  10786. var tmp = this.saveSelection();
  10787. if (!this.codeViewMode)
  10788. {
  10789. // Clears the initial empty label on the first keystroke
  10790. if (this.clearOnChange && this.textarea.innerHTML == this.getEmptyLabelText())
  10791. {
  10792. this.clearOnChange = false;
  10793. this.textarea.innerText = '';
  10794. }
  10795. // Removes newlines from HTML and converts breaks to newlines
  10796. // to match the HTML output in plain text
  10797. var content = mxUtils.htmlEntities(this.textarea.innerHTML);
  10798. // Workaround for trailing line breaks being ignored in the editor
  10799. if (document.documentMode != 8)
  10800. {
  10801. content = mxUtils.replaceTrailingNewlines(content, '<div><br></div>');
  10802. }
  10803. content = Graph.sanitizeHtml((nl2Br) ? content.replace(/\n/g, '').
  10804. replace(/&lt;br\s*.?&gt;/g, '<br>') : content, true);
  10805. this.textarea.className = 'mxCellEditor mxPlainTextEditor';
  10806. var size = mxConstants.DEFAULT_FONTSIZE;
  10807. this.textarea.style.lineHeight = (mxConstants.ABSOLUTE_LINE_HEIGHT) ?
  10808. Math.round(size * mxConstants.LINE_HEIGHT) + 'px' : mxConstants.LINE_HEIGHT;
  10809. this.textarea.style.fontSize = Math.round(size) + 'px';
  10810. this.textarea.style.textDecoration = '';
  10811. this.textarea.style.fontWeight = 'normal';
  10812. this.textarea.style.fontStyle = '';
  10813. this.textarea.style.fontFamily = mxConstants.DEFAULT_FONTFAMILY;
  10814. this.textarea.style.textAlign = 'left';
  10815. this.textarea.style.width = '';
  10816. // Adds padding to make cursor visible with borders
  10817. this.textarea.style.padding = '2px';
  10818. if (this.textarea.innerHTML != content)
  10819. {
  10820. this.textarea.innerHTML = content;
  10821. }
  10822. this.codeViewMode = true;
  10823. }
  10824. else
  10825. {
  10826. var content = mxUtils.extractTextWithWhitespace(this.textarea.childNodes);
  10827. // Strips trailing line break
  10828. if (content.length > 0 && content.charAt(content.length - 1) == '\n')
  10829. {
  10830. content = content.substring(0, content.length - 1);
  10831. }
  10832. content = Graph.sanitizeHtml((nl2Br) ? content.replace(/\n/g, '<br/>') : content, true)
  10833. this.textarea.className = 'mxCellEditor geContentEditable';
  10834. var size = mxUtils.getValue(state.style, mxConstants.STYLE_FONTSIZE, mxConstants.DEFAULT_FONTSIZE);
  10835. var family = mxUtils.getValue(state.style, mxConstants.STYLE_FONTFAMILY, mxConstants.DEFAULT_FONTFAMILY);
  10836. var align = mxUtils.getValue(state.style, mxConstants.STYLE_ALIGN, mxConstants.ALIGN_LEFT);
  10837. var bold = (mxUtils.getValue(state.style, mxConstants.STYLE_FONTSTYLE, 0) &
  10838. mxConstants.FONT_BOLD) == mxConstants.FONT_BOLD;
  10839. var italic = (mxUtils.getValue(state.style, mxConstants.STYLE_FONTSTYLE, 0) &
  10840. mxConstants.FONT_ITALIC) == mxConstants.FONT_ITALIC;
  10841. var txtDecor = [];
  10842. if ((mxUtils.getValue(state.style, mxConstants.STYLE_FONTSTYLE, 0) &
  10843. mxConstants.FONT_UNDERLINE) == mxConstants.FONT_UNDERLINE)
  10844. {
  10845. txtDecor.push('underline');
  10846. }
  10847. if ((mxUtils.getValue(state.style, mxConstants.STYLE_FONTSTYLE, 0) &
  10848. mxConstants.FONT_STRIKETHROUGH) == mxConstants.FONT_STRIKETHROUGH)
  10849. {
  10850. txtDecor.push('line-through');
  10851. }
  10852. this.textarea.style.lineHeight = (mxConstants.ABSOLUTE_LINE_HEIGHT) ? Math.round(size * mxConstants.LINE_HEIGHT) + 'px' : mxConstants.LINE_HEIGHT;
  10853. this.textarea.style.fontSize = Math.round(size) + 'px';
  10854. this.textarea.style.textDecoration = txtDecor.join(' ');
  10855. this.textarea.style.fontWeight = (bold) ? 'bold' : 'normal';
  10856. this.textarea.style.fontStyle = (italic) ? 'italic' : '';
  10857. this.textarea.style.fontFamily = family;
  10858. this.textarea.style.textAlign = align;
  10859. this.textarea.style.padding = '0px';
  10860. if (this.textarea.innerHTML != content)
  10861. {
  10862. this.textarea.innerHTML = content;
  10863. if (this.textarea.innerHTML.length == 0)
  10864. {
  10865. this.textarea.innerHTML = this.getEmptyLabelText();
  10866. this.clearOnChange = this.textarea.innerHTML.length > 0;
  10867. }
  10868. }
  10869. this.codeViewMode = false;
  10870. }
  10871. this.textarea.focus();
  10872. if (this.switchSelectionState != null)
  10873. {
  10874. this.restoreSelection(this.switchSelectionState);
  10875. }
  10876. this.switchSelectionState = tmp;
  10877. this.resize();
  10878. }
  10879. };
  10880. var mxCellEditorResize = mxCellEditor.prototype.resize;
  10881. mxCellEditor.prototype.resize = function(state, trigger)
  10882. {
  10883. if (this.textarea != null)
  10884. {
  10885. var state = this.graph.getView().getState(this.editingCell);
  10886. if (this.codeViewMode && state != null)
  10887. {
  10888. var scale = state.view.scale;
  10889. this.bounds = mxRectangle.fromRectangle(state);
  10890. // General placement of code editor if cell has no size
  10891. // LATER: Fix HTML editor bounds for edge labels
  10892. if (this.bounds.width == 0 && this.bounds.height == 0)
  10893. {
  10894. this.bounds.width = 160 * scale;
  10895. this.bounds.height = 60 * scale;
  10896. var m = (state.text != null) ? state.text.margin : null;
  10897. if (m == null)
  10898. {
  10899. m = mxUtils.getAlignmentAsPoint(mxUtils.getValue(state.style, mxConstants.STYLE_ALIGN, mxConstants.ALIGN_CENTER),
  10900. mxUtils.getValue(state.style, mxConstants.STYLE_VERTICAL_ALIGN, mxConstants.ALIGN_MIDDLE));
  10901. }
  10902. this.bounds.x += m.x * this.bounds.width;
  10903. this.bounds.y += m.y * this.bounds.height;
  10904. }
  10905. this.textarea.style.width = Math.round((this.bounds.width - 4) / scale) + 'px';
  10906. this.textarea.style.height = Math.round((this.bounds.height - 4) / scale) + 'px';
  10907. this.textarea.style.overflow = 'auto';
  10908. // Adds scrollbar offset if visible
  10909. if (this.textarea.clientHeight < this.textarea.offsetHeight)
  10910. {
  10911. this.textarea.style.height = Math.round((this.bounds.height / scale)) + (this.textarea.offsetHeight - this.textarea.clientHeight) + 'px';
  10912. this.bounds.height = parseInt(this.textarea.style.height) * scale;
  10913. }
  10914. if (this.textarea.clientWidth < this.textarea.offsetWidth)
  10915. {
  10916. this.textarea.style.width = Math.round((this.bounds.width / scale)) + (this.textarea.offsetWidth - this.textarea.clientWidth) + 'px';
  10917. this.bounds.width = parseInt(this.textarea.style.width) * scale;
  10918. }
  10919. this.textarea.style.left = Math.round(this.bounds.x) + 'px';
  10920. this.textarea.style.top = Math.round(this.bounds.y) + 'px';
  10921. mxUtils.setPrefixedStyle(this.textarea.style, 'transform', 'scale(' + scale + ',' + scale + ')');
  10922. }
  10923. else
  10924. {
  10925. this.textarea.style.height = '';
  10926. this.textarea.style.overflow = '';
  10927. mxCellEditorResize.apply(this, arguments);
  10928. }
  10929. }
  10930. };
  10931. mxCellEditorGetInitialValue = mxCellEditor.prototype.getInitialValue;
  10932. mxCellEditor.prototype.getInitialValue = function(state, trigger)
  10933. {
  10934. if (mxUtils.getValue(state.style, 'html', '0') == '0')
  10935. {
  10936. return mxCellEditorGetInitialValue.apply(this, arguments);
  10937. }
  10938. else
  10939. {
  10940. var result = this.graph.getEditingValue(state.cell, trigger)
  10941. if (mxUtils.getValue(state.style, 'nl2Br', '1') == '1')
  10942. {
  10943. result = result.replace(/\n/g, '<br/>');
  10944. }
  10945. result = Graph.sanitizeHtml(result, true);
  10946. return result;
  10947. }
  10948. };
  10949. mxCellEditorGetCurrentValue = mxCellEditor.prototype.getCurrentValue;
  10950. mxCellEditor.prototype.getCurrentValue = function(state)
  10951. {
  10952. if (mxUtils.getValue(state.style, 'html', '0') == '0')
  10953. {
  10954. return mxCellEditorGetCurrentValue.apply(this, arguments);
  10955. }
  10956. else
  10957. {
  10958. var result = Graph.sanitizeHtml(this.textarea.innerHTML, true);
  10959. if (mxUtils.getValue(state.style, 'nl2Br', '1') == '1')
  10960. {
  10961. result = result.replace(/\r\n/g, '<br/>').replace(/\n/g, '<br/>');
  10962. }
  10963. else
  10964. {
  10965. result = result.replace(/\r\n/g, '').replace(/\n/g, '');
  10966. }
  10967. return result;
  10968. }
  10969. };
  10970. var mxCellEditorStopEditing = mxCellEditor.prototype.stopEditing;
  10971. mxCellEditor.prototype.stopEditing = function(cancel)
  10972. {
  10973. // Restores default view mode before applying value
  10974. if (this.codeViewMode)
  10975. {
  10976. this.toggleViewMode();
  10977. }
  10978. mxCellEditorStopEditing.apply(this, arguments);
  10979. // Tries to move focus back to container after editing if possible
  10980. this.focusContainer();
  10981. };
  10982. mxCellEditor.prototype.focusContainer = function()
  10983. {
  10984. try
  10985. {
  10986. this.graph.container.focus();
  10987. }
  10988. catch (e)
  10989. {
  10990. // ignore
  10991. }
  10992. };
  10993. var mxCellEditorApplyValue = mxCellEditor.prototype.applyValue;
  10994. mxCellEditor.prototype.applyValue = function(state, value)
  10995. {
  10996. // Removes empty relative child labels in edges
  10997. this.graph.getModel().beginUpdate();
  10998. try
  10999. {
  11000. mxCellEditorApplyValue.apply(this, arguments);
  11001. if (value == '' && this.graph.isCellDeletable(state.cell) &&
  11002. this.graph.model.getChildCount(state.cell) == 0 &&
  11003. this.graph.isTransparentState(state))
  11004. {
  11005. this.graph.removeCells([state.cell], false);
  11006. }
  11007. }
  11008. finally
  11009. {
  11010. this.graph.getModel().endUpdate();
  11011. }
  11012. };
  11013. /**
  11014. * Returns the background color to be used for the editing box. This returns
  11015. * the label background for edge labels and null for all other cases.
  11016. */
  11017. mxCellEditor.prototype.getBackgroundColor = function(state)
  11018. {
  11019. var color = mxUtils.getValue(state.style, mxConstants.STYLE_LABEL_BACKGROUNDCOLOR, null);
  11020. if ((color == null || color == mxConstants.NONE) &&
  11021. (state.cell.geometry != null && state.cell.geometry.width > 0) &&
  11022. (mxUtils.getValue(state.style, mxConstants.STYLE_ROTATION, 0) != 0 ||
  11023. mxUtils.getValue(state.style, mxConstants.STYLE_HORIZONTAL, 1) == 0))
  11024. {
  11025. color = mxUtils.getValue(state.style, mxConstants.STYLE_FILLCOLOR, null);
  11026. }
  11027. if (color == mxConstants.NONE)
  11028. {
  11029. color = null;
  11030. }
  11031. return color;
  11032. };
  11033. /**
  11034. * Returns the border color to be used for the editing box. This returns
  11035. * the label border for edge labels and null for all other cases.
  11036. */
  11037. mxCellEditor.prototype.getBorderColor = function(state)
  11038. {
  11039. var color = mxUtils.getValue(state.style, mxConstants.STYLE_LABEL_BORDERCOLOR, null);
  11040. if ((color == null || color == mxConstants.NONE) &&
  11041. (state.cell.geometry != null && state.cell.geometry.width > 0) &&
  11042. (mxUtils.getValue(state.style, mxConstants.STYLE_ROTATION, 0) != 0 ||
  11043. mxUtils.getValue(state.style, mxConstants.STYLE_HORIZONTAL, 1) == 0))
  11044. {
  11045. color = mxUtils.getValue(state.style, mxConstants.STYLE_STROKECOLOR, null);
  11046. }
  11047. if (color == mxConstants.NONE)
  11048. {
  11049. color = null;
  11050. }
  11051. return color;
  11052. };
  11053. /**
  11054. * Returns the minimum editing size.
  11055. */
  11056. mxCellEditor.prototype.getMinimumSize = function(state)
  11057. {
  11058. var scale = this.graph.getView().scale;
  11059. return new mxRectangle(0, 0, (state.text == null) ? 30 : state.text.size * scale + 20, 30);
  11060. };
  11061. /**
  11062. * Hold Alt to ignore drop target.
  11063. */
  11064. mxGraphHandlerIsValidDropTarget = mxGraphHandler.prototype.isValidDropTarget;
  11065. mxGraphHandler.prototype.isValidDropTarget = function(target, me)
  11066. {
  11067. return mxGraphHandlerIsValidDropTarget.apply(this, arguments) &&
  11068. !mxEvent.isAltDown(me.getEvent);
  11069. };
  11070. /**
  11071. * Hints on handlers
  11072. */
  11073. function createHint()
  11074. {
  11075. var hint = document.createElement('div');
  11076. hint.className = 'geHint';
  11077. hint.style.whiteSpace = 'nowrap';
  11078. hint.style.position = 'absolute';
  11079. return hint;
  11080. };
  11081. /**
  11082. * Format pixels in the given unit
  11083. */
  11084. function formatHintText(pixels, unit)
  11085. {
  11086. switch(unit)
  11087. {
  11088. case mxConstants.POINTS:
  11089. return pixels;
  11090. case mxConstants.MILLIMETERS:
  11091. return (pixels / mxConstants.PIXELS_PER_MM).toFixed(1);
  11092. case mxConstants.METERS:
  11093. return (pixels / (mxConstants.PIXELS_PER_MM * 1000)).toFixed(4);
  11094. case mxConstants.INCHES:
  11095. return (pixels / mxConstants.PIXELS_PER_INCH).toFixed(2);
  11096. }
  11097. };
  11098. mxGraphView.prototype.formatUnitText = function(pixels)
  11099. {
  11100. return pixels? formatHintText(pixels, this.unit) : pixels;
  11101. };
  11102. /**
  11103. * Updates the hint for the current operation.
  11104. */
  11105. mxGraphHandler.prototype.updateHint = function(me)
  11106. {
  11107. if (this.pBounds != null && (this.shape != null || this.livePreviewActive))
  11108. {
  11109. if (this.hint == null)
  11110. {
  11111. this.hint = createHint();
  11112. this.graph.container.appendChild(this.hint);
  11113. }
  11114. var t = this.graph.view.translate;
  11115. var s = this.graph.view.scale;
  11116. var x = this.roundLength((this.bounds.x + this.currentDx) / s - t.x);
  11117. var y = this.roundLength((this.bounds.y + this.currentDy) / s - t.y);
  11118. var unit = this.graph.view.unit;
  11119. this.hint.innerHTML = formatHintText(x, unit) + ', ' + formatHintText(y, unit);
  11120. this.hint.style.left = (this.pBounds.x + this.currentDx +
  11121. Math.round((this.pBounds.width - this.hint.clientWidth) / 2)) + 'px';
  11122. this.hint.style.top = (this.pBounds.y + this.currentDy +
  11123. this.pBounds.height + Editor.hintOffset) + 'px';
  11124. }
  11125. };
  11126. /**
  11127. * Updates the hint for the current operation.
  11128. */
  11129. mxGraphHandler.prototype.removeHint = function()
  11130. {
  11131. if (this.hint != null)
  11132. {
  11133. this.hint.parentNode.removeChild(this.hint);
  11134. this.hint = null;
  11135. }
  11136. };
  11137. /**
  11138. * Overridden to allow for shrinking pools when lanes are resized.
  11139. */
  11140. var stackLayoutResizeCell = mxStackLayout.prototype.resizeCell;
  11141. mxStackLayout.prototype.resizeCell = function(cell, bounds)
  11142. {
  11143. stackLayoutResizeCell.apply(this, arguments);
  11144. var style = this.graph.getCellStyle(cell);
  11145. if (style['childLayout'] == null)
  11146. {
  11147. var parent = this.graph.model.getParent(cell);
  11148. var geo = (parent != null) ? this.graph.getCellGeometry(parent) : null;
  11149. if (geo != null)
  11150. {
  11151. style = this.graph.getCellStyle(parent);
  11152. if (style['childLayout'] == 'stackLayout')
  11153. {
  11154. var border = parseFloat(mxUtils.getValue(style, 'stackBorder', mxStackLayout.prototype.border));
  11155. var horizontal = mxUtils.getValue(style, 'horizontalStack', '1') == '1';
  11156. var start = this.graph.getActualStartSize(parent);
  11157. geo = geo.clone();
  11158. if (horizontal)
  11159. {
  11160. geo.height = bounds.height + start.y + start.height + 2 * border;
  11161. }
  11162. else
  11163. {
  11164. geo.width = bounds.width + start.x + start.width + 2 * border;
  11165. }
  11166. this.graph.model.setGeometry(parent, geo);
  11167. }
  11168. }
  11169. }
  11170. };
  11171. /**
  11172. * Shows handle for table instead of rows and cells.
  11173. */
  11174. var selectionCellsHandlerGetHandledSelectionCells = mxSelectionCellsHandler.prototype.getHandledSelectionCells;
  11175. mxSelectionCellsHandler.prototype.getHandledSelectionCells = function()
  11176. {
  11177. var cells = selectionCellsHandlerGetHandledSelectionCells.apply(this, arguments);
  11178. var dict = new mxDictionary();
  11179. var model = this.graph.model;
  11180. var result = [];
  11181. function addCell(cell)
  11182. {
  11183. if (!dict.get(cell))
  11184. {
  11185. dict.put(cell, true);
  11186. result.push(cell);
  11187. }
  11188. };
  11189. for (var i = 0; i < cells.length; i++)
  11190. {
  11191. var cell = cells[i];
  11192. if (this.graph.isTableCell(cell))
  11193. {
  11194. addCell(model.getParent(model.getParent(cell)));
  11195. }
  11196. else if (this.graph.isTableRow(cell))
  11197. {
  11198. addCell(model.getParent(cell));
  11199. }
  11200. addCell(cell);
  11201. }
  11202. return result;
  11203. };
  11204. /**
  11205. * Disables starting new connections if control is pressed.
  11206. */
  11207. var connectionHandlerIsStartEvent = mxConnectionHandler.prototype.isStartEvent;
  11208. mxConnectionHandler.prototype.isStartEvent = function(me)
  11209. {
  11210. return connectionHandlerIsStartEvent.apply(this, arguments) &&
  11211. !mxEvent.isControlDown(me.getEvent()) &&
  11212. !mxEvent.isShiftDown(me.getEvent());
  11213. };
  11214. /**
  11215. * Forces preview for title size in tables, table rows, table cells and swimlanes.
  11216. */
  11217. var vertexHandlerIsGhostPreview = mxVertexHandler.prototype.isGhostPreview;
  11218. mxVertexHandler.prototype.isGhostPreview = function()
  11219. {
  11220. return vertexHandlerIsGhostPreview.apply(this, arguments) && !this.graph.isTable(this.state.cell) &&
  11221. !this.graph.isTableRow(this.state.cell) && !this.graph.isTableCell(this.state.cell) &&
  11222. !this.graph.isSwimlane(this.state.cell);
  11223. };
  11224. /**
  11225. * Creates the shape used to draw the selection border.
  11226. */
  11227. var vertexHandlerCreateParentHighlightShape = mxVertexHandler.prototype.createParentHighlightShape;
  11228. mxVertexHandler.prototype.createParentHighlightShape = function(bounds)
  11229. {
  11230. var shape = vertexHandlerCreateParentHighlightShape.apply(this, arguments);
  11231. shape.stroke = '#C0C0C0';
  11232. shape.strokewidth = 1;
  11233. return shape;
  11234. };
  11235. /**
  11236. * Creates the shape used to draw the selection border.
  11237. */
  11238. var edgeHandlerCreateParentHighlightShape = mxEdgeHandler.prototype.createParentHighlightShape;
  11239. mxEdgeHandler.prototype.createParentHighlightShape = function(bounds)
  11240. {
  11241. var shape = edgeHandlerCreateParentHighlightShape.apply(this, arguments);
  11242. shape.stroke = '#C0C0C0';
  11243. shape.strokewidth = 1;
  11244. return shape;
  11245. };
  11246. /**
  11247. * Moves rotation handle to top, right corner.
  11248. */
  11249. mxVertexHandler.prototype.rotationHandleVSpacing = -12;
  11250. mxVertexHandler.prototype.getRotationHandlePosition = function()
  11251. {
  11252. var padding = this.getHandlePadding();
  11253. return new mxPoint(this.bounds.x + this.bounds.width - this.rotationHandleVSpacing + padding.x / 2,
  11254. this.bounds.y + this.rotationHandleVSpacing - padding.y / 2)
  11255. };
  11256. /**
  11257. * Enables recursive resize for groups.
  11258. */
  11259. mxVertexHandler.prototype.isRecursiveResize = function(state, me)
  11260. {
  11261. return this.graph.isRecursiveVertexResize(state) &&
  11262. !mxEvent.isAltDown(me.getEvent());
  11263. };
  11264. /**
  11265. * Enables centered resize events.
  11266. */
  11267. mxVertexHandler.prototype.isCenteredEvent = function(state, me)
  11268. {
  11269. return mxEvent.isControlDown(me.getEvent()) ||
  11270. mxEvent.isMetaDown(me.getEvent());
  11271. };
  11272. /**
  11273. * Hides rotation handle for table cells and rows.
  11274. */
  11275. var vertexHandlerIsRotationHandleVisible = mxVertexHandler.prototype.isRotationHandleVisible;
  11276. mxVertexHandler.prototype.isRotationHandleVisible = function()
  11277. {
  11278. return vertexHandlerIsRotationHandleVisible.apply(this, arguments) &&
  11279. !this.graph.isTableCell(this.state.cell) &&
  11280. !this.graph.isTableRow(this.state.cell) &&
  11281. !this.graph.isTable(this.state.cell);
  11282. };
  11283. /**
  11284. * Hides rotation handle for table cells and rows.
  11285. */
  11286. mxVertexHandler.prototype.getSizerBounds = function()
  11287. {
  11288. if (this.graph.isTableCell(this.state.cell))
  11289. {
  11290. return this.graph.view.getState(this.graph.model.getParent(this.graph.model.getParent(this.state.cell)));
  11291. }
  11292. else
  11293. {
  11294. return this.bounds;
  11295. }
  11296. };
  11297. /**
  11298. * Hides rotation handle for table cells and rows.
  11299. */
  11300. var vertexHandlerIsParentHighlightVisible = mxVertexHandler.prototype.isParentHighlightVisible;
  11301. mxVertexHandler.prototype.isParentHighlightVisible = function()
  11302. {
  11303. return vertexHandlerIsParentHighlightVisible.apply(this, arguments) &&
  11304. !this.graph.isTableCell(this.state.cell) &&
  11305. !this.graph.isTableRow(this.state.cell);
  11306. };
  11307. /**
  11308. * Hides rotation handle for table cells and rows.
  11309. */
  11310. var vertexHandlerIsCustomHandleVisible = mxVertexHandler.prototype.isCustomHandleVisible;
  11311. mxVertexHandler.prototype.isCustomHandleVisible = function(handle)
  11312. {
  11313. return handle.tableHandle ||
  11314. (vertexHandlerIsCustomHandleVisible.apply(this, arguments) &&
  11315. (!this.graph.isTable(this.state.cell) ||
  11316. this.graph.isCellSelected(this.state.cell)));
  11317. };
  11318. /**
  11319. * Adds selection border inset for table cells and rows.
  11320. */
  11321. mxVertexHandler.prototype.getSelectionBorderInset = function()
  11322. {
  11323. var result = 0;
  11324. if (this.graph.isTableRow(this.state.cell))
  11325. {
  11326. result = 1;
  11327. }
  11328. else if (this.graph.isTableCell(this.state.cell))
  11329. {
  11330. result = 2;
  11331. }
  11332. return result;
  11333. };
  11334. /**
  11335. * Adds custom handles for table cells.
  11336. */
  11337. var vertexHandlerGetSelectionBorderBounds = mxVertexHandler.prototype.getSelectionBorderBounds;
  11338. mxVertexHandler.prototype.getSelectionBorderBounds = function()
  11339. {
  11340. return vertexHandlerGetSelectionBorderBounds.apply(this, arguments).grow(
  11341. -this.getSelectionBorderInset());
  11342. };
  11343. var TableLineShape = null;
  11344. /**
  11345. * Adds custom handles for table cells.
  11346. */
  11347. var vertexHandlerCreateCustomHandles = mxVertexHandler.prototype.createCustomHandles;
  11348. mxVertexHandler.prototype.createCustomHandles = function()
  11349. {
  11350. // Lazy lookup for shape constructor
  11351. if (TableLineShape == null)
  11352. {
  11353. TableLineShape = mxCellRenderer.defaultShapes['tableLine'];
  11354. }
  11355. var handles = vertexHandlerCreateCustomHandles.apply(this, arguments);
  11356. if (this.graph.isTable(this.state.cell) && this.graph.isCellMovable(this.state.cell))
  11357. {
  11358. var self = this;
  11359. var graph = this.graph;
  11360. var model = graph.model;
  11361. var s = graph.view.scale;
  11362. var tableState = this.state;
  11363. var sel = this.selectionBorder;
  11364. var x0 = this.state.origin.x + graph.view.translate.x;
  11365. var y0 = this.state.origin.y + graph.view.translate.y;
  11366. if (handles == null)
  11367. {
  11368. handles = [];
  11369. }
  11370. function moveLine(line, dx, dy)
  11371. {
  11372. var result = [];
  11373. for (var i = 0; i < line.length; i++)
  11374. {
  11375. var pt = line[i];
  11376. result.push((pt == null) ? null : new mxPoint(
  11377. (x0 + pt.x + dx) * s, (y0 + pt.y + dy) * s));
  11378. }
  11379. return result;
  11380. };
  11381. // Adds handles for rows and columns
  11382. var rows = graph.view.getCellStates(model.getChildCells(this.state.cell, true));
  11383. if (rows.length > 0)
  11384. {
  11385. var cols = model.getChildCells(rows[0].cell, true);
  11386. var colLines = graph.getTableLines(this.state.cell, false, true);
  11387. var rowLines = graph.getTableLines(this.state.cell, true, false);
  11388. // Adds row height handles
  11389. for (var i = 0; i < rows.length; i++)
  11390. {
  11391. (mxUtils.bind(this, function(index)
  11392. {
  11393. var rowState = rows[index];
  11394. var handle = null;
  11395. if (graph.isCellMovable(rowState.cell))
  11396. {
  11397. var nextRow = (index < rows.length - 1) ? rows[index + 1] : null;
  11398. var ngeo = (nextRow != null) ? graph.getCellGeometry(nextRow.cell) : null;
  11399. var ng = (ngeo != null && ngeo.alternateBounds != null) ? ngeo.alternateBounds : ngeo;
  11400. var shape = (rowLines[index] != null) ?
  11401. new TableLineShape(rowLines[index], mxConstants.NONE, 1) :
  11402. new mxLine(new mxRectangle(), mxConstants.NONE, 1, false);
  11403. shape.isDashed = sel.isDashed;
  11404. shape.svgStrokeTolerance++;
  11405. handle = new mxHandle(rowState, 'row-resize', null, shape);
  11406. handle.tableHandle = true;
  11407. var dy = 0;
  11408. handle.shape.node.parentNode.insertBefore(handle.shape.node,
  11409. handle.shape.node.parentNode.firstChild);
  11410. handle.redraw = function()
  11411. {
  11412. if (this.shape != null)
  11413. {
  11414. this.shape.stroke = (dy == 0) ? mxConstants.NONE : sel.stroke;
  11415. if (this.shape.constructor == TableLineShape)
  11416. {
  11417. this.shape.line = moveLine(rowLines[index], 0, dy);
  11418. this.shape.updateBoundsFromLine();
  11419. }
  11420. else
  11421. {
  11422. var start = graph.getActualStartSize(tableState.cell, true);
  11423. this.shape.bounds.height = 1;
  11424. this.shape.bounds.y = this.state.y + this.state.height + dy * s;
  11425. this.shape.bounds.x = tableState.x + ((index == rows.length - 1) ?
  11426. 0 : start.x * s);
  11427. this.shape.bounds.width = tableState.width - ((index == rows.length - 1) ?
  11428. 0 : (start.width + start.x) + s);
  11429. }
  11430. this.shape.redraw();
  11431. }
  11432. };
  11433. var shiftPressed = false;
  11434. handle.setPosition = function(bounds, pt, me)
  11435. {
  11436. dy = Math.max(Graph.minTableRowHeight - bounds.height,
  11437. pt.y - bounds.y - bounds.height);
  11438. shiftPressed = mxEvent.isShiftDown(me.getEvent());
  11439. if (ng != null && shiftPressed)
  11440. {
  11441. dy = Math.min(dy, ng.height - Graph.minTableRowHeight);
  11442. }
  11443. };
  11444. handle.execute = function(me)
  11445. {
  11446. if (dy != 0)
  11447. {
  11448. graph.setTableRowHeight(this.state.cell,
  11449. dy, !shiftPressed);
  11450. }
  11451. else if (!self.blockDelayedSelection)
  11452. {
  11453. var temp = graph.getCellAt(me.getGraphX(),
  11454. me.getGraphY()) || tableState.cell;
  11455. graph.graphHandler.selectCellForEvent(temp, me);
  11456. }
  11457. dy = 0;
  11458. };
  11459. handle.reset = function()
  11460. {
  11461. dy = 0;
  11462. };
  11463. }
  11464. handles.push(handle);
  11465. }))(i);
  11466. }
  11467. // Adds column width handles
  11468. for (var i = 0; i < cols.length; i++)
  11469. {
  11470. (mxUtils.bind(this, function(index)
  11471. {
  11472. var colState = graph.view.getState(cols[index]);
  11473. var geo = graph.getCellGeometry(cols[index]);
  11474. var g = (geo.alternateBounds != null) ? geo.alternateBounds : geo;
  11475. if (colState == null)
  11476. {
  11477. colState = new mxCellState(graph.view, cols[index],
  11478. graph.getCellStyle(cols[index]));
  11479. colState.x = tableState.x + geo.x * s;
  11480. colState.y = tableState.y + geo.y * s;
  11481. colState.width = g.width * s;
  11482. colState.height = g.height * s;
  11483. colState.updateCachedBounds();
  11484. }
  11485. var nextCol = (index < cols.length - 1) ? cols[index + 1] : null;
  11486. var ngeo = (nextCol != null) ? graph.getCellGeometry(nextCol) : null;
  11487. var ng = (ngeo != null && ngeo.alternateBounds != null) ? ngeo.alternateBounds : ngeo;
  11488. var shape = (colLines[index] != null) ?
  11489. new TableLineShape(colLines[index], mxConstants.NONE, 1) :
  11490. new mxLine(new mxRectangle(), mxConstants.NONE, 1, true);
  11491. shape.isDashed = sel.isDashed;
  11492. // Workaround for event handling on overlapping cells with tolerance
  11493. shape.svgStrokeTolerance++;
  11494. var handle = new mxHandle(colState, 'col-resize', null, shape);
  11495. handle.tableHandle = true;
  11496. var dx = 0;
  11497. handle.shape.node.parentNode.insertBefore(handle.shape.node,
  11498. handle.shape.node.parentNode.firstChild);
  11499. handle.redraw = function()
  11500. {
  11501. if (this.shape != null)
  11502. {
  11503. this.shape.stroke = (dx == 0) ? mxConstants.NONE : sel.stroke;
  11504. if (this.shape.constructor == TableLineShape)
  11505. {
  11506. this.shape.line = moveLine(colLines[index], dx, 0);
  11507. this.shape.updateBoundsFromLine();
  11508. }
  11509. else
  11510. {
  11511. var start = graph.getActualStartSize(tableState.cell, true);
  11512. this.shape.bounds.width = 1;
  11513. this.shape.bounds.x = this.state.x + (g.width + dx) * s;
  11514. this.shape.bounds.y = tableState.y + ((index == cols.length - 1) ?
  11515. 0 : start.y * s);
  11516. this.shape.bounds.height = tableState.height - ((index == cols.length - 1) ?
  11517. 0 : (start.height + start.y) * s);
  11518. }
  11519. this.shape.redraw();
  11520. }
  11521. };
  11522. var shiftPressed = false;
  11523. handle.setPosition = function(bounds, pt, me)
  11524. {
  11525. dx = Math.max(Graph.minTableColumnWidth - g.width,
  11526. pt.x - bounds.x - g.width);
  11527. shiftPressed = mxEvent.isShiftDown(me.getEvent());
  11528. if (ng != null && !shiftPressed)
  11529. {
  11530. dx = Math.min(dx, ng.width - Graph.minTableColumnWidth);
  11531. }
  11532. };
  11533. handle.execute = function(me)
  11534. {
  11535. if (dx != 0)
  11536. {
  11537. graph.setTableColumnWidth(this.state.cell,
  11538. dx, shiftPressed);
  11539. }
  11540. else if (!self.blockDelayedSelection)
  11541. {
  11542. var temp = graph.getCellAt(me.getGraphX(),
  11543. me.getGraphY()) || tableState.cell;
  11544. graph.graphHandler.selectCellForEvent(temp, me);
  11545. }
  11546. dx = 0;
  11547. };
  11548. // Stops repaint of text label via vertex handler
  11549. handle.positionChanged = function()
  11550. {
  11551. // do nothing
  11552. };
  11553. handle.reset = function()
  11554. {
  11555. dx = 0;
  11556. };
  11557. handles.push(handle);
  11558. }))(i);
  11559. }
  11560. }
  11561. }
  11562. // Reserve gives point handles precedence over line handles
  11563. return (handles != null) ? handles.reverse() : null;
  11564. };
  11565. /**
  11566. * Hides additional handles
  11567. */
  11568. var vertexHandlerSetHandlesVisible = mxVertexHandler.prototype.setHandlesVisible;
  11569. mxVertexHandler.prototype.setHandlesVisible = function(visible)
  11570. {
  11571. vertexHandlerSetHandlesVisible.apply(this, arguments);
  11572. if (this.moveHandles != null)
  11573. {
  11574. for (var i = 0; i < this.moveHandles.length; i++)
  11575. {
  11576. if (this.moveHandles[i] != null)
  11577. {
  11578. this.moveHandles[i].node.style.visibility = (visible) ? '' : 'hidden';
  11579. }
  11580. }
  11581. }
  11582. if (this.cornerHandles != null)
  11583. {
  11584. for (var i = 0; i < this.cornerHandles.length; i++)
  11585. {
  11586. this.cornerHandles[i].node.style.visibility = (visible) ? '' : 'hidden';
  11587. }
  11588. }
  11589. };
  11590. /**
  11591. * Function: isMoveHandlesVisible
  11592. *
  11593. * Initializes the shapes required for this vertex handler.
  11594. */
  11595. mxVertexHandler.prototype.isMoveHandlesVisible = function()
  11596. {
  11597. return this.graph.isTable(this.state.cell) &&
  11598. this.graph.isCellMovable(this.state.cell);
  11599. };
  11600. /**
  11601. * Creates or updates special handles for moving rows.
  11602. */
  11603. mxVertexHandler.prototype.refreshMoveHandles = function()
  11604. {
  11605. var showMoveHandles = this.isMoveHandlesVisible();
  11606. if (showMoveHandles && this.moveHandles == null)
  11607. {
  11608. this.moveHandles = this.createMoveHandles();
  11609. }
  11610. else if (!showMoveHandles && this.moveHandles != null)
  11611. {
  11612. this.destroyMoveHandles();
  11613. }
  11614. // Destroys existing handles
  11615. if (showMoveHandles && this.moveHandles == null)
  11616. {
  11617. for (var i = 0; i < this.moveHandles.length; i++)
  11618. {
  11619. if (this.moveHandles[i] != null)
  11620. {
  11621. this.moveHandles[i].parentNode.removeChild(this.moveHandles[i]);
  11622. }
  11623. }
  11624. this.moveHandles = null;
  11625. }
  11626. };
  11627. /**
  11628. * Creates or updates special handles for moving rows.
  11629. */
  11630. mxVertexHandler.prototype.createMoveHandles = function()
  11631. {
  11632. var graph = this.graph;
  11633. var model = graph.model;
  11634. var handles = [];
  11635. for (var i = 0; i < model.getChildCount(this.state.cell); i++)
  11636. {
  11637. (mxUtils.bind(this, function(rowState)
  11638. {
  11639. if (rowState != null && model.isVertex(rowState.cell) &&
  11640. graph.isCellMovable(rowState.cell))
  11641. {
  11642. var bounds = new mxRectangle(0, 0, this.rowHandleImage.width, this.rowHandleImage.height);
  11643. var moveHandle = new mxImageShape(bounds, this.rowHandleImage.src);
  11644. moveHandle.rowState = rowState;
  11645. moveHandle.dialect = (this.graph.dialect != mxConstants.DIALECT_SVG) ?
  11646. mxConstants.DIALECT_MIXEDHTML : mxConstants.DIALECT_SVG;
  11647. moveHandle.init(this.graph.getView().getOverlayPane());
  11648. moveHandle.node.style.cursor = 'move';
  11649. mxEvent.addGestureListeners(moveHandle.node, mxUtils.bind(this, function(evt)
  11650. {
  11651. this.graph.popupMenuHandler.hideMenu();
  11652. this.graph.stopEditing(false);
  11653. if (this.graph.isToggleEvent(evt) ||
  11654. !this.graph.isCellSelected(rowState.cell))
  11655. {
  11656. this.graph.selectCellForEvent(rowState.cell, evt);
  11657. }
  11658. if (!mxEvent.isPopupTrigger(evt))
  11659. {
  11660. this.graph.graphHandler.start(this.state.cell,
  11661. mxEvent.getClientX(evt), mxEvent.getClientY(evt),
  11662. this.graph.getSelectionCells());
  11663. this.graph.graphHandler.cellWasClicked = true;
  11664. this.graph.isMouseTrigger = mxEvent.isMouseEvent(evt);
  11665. this.graph.isMouseDown = true;
  11666. }
  11667. mxEvent.consume(evt);
  11668. }), null, mxUtils.bind(this, function(evt)
  11669. {
  11670. if (mxEvent.isPopupTrigger(evt))
  11671. {
  11672. this.graph.popupMenuHandler.popup(mxEvent.getClientX(evt),
  11673. mxEvent.getClientY(evt), rowState.cell, evt);
  11674. mxEvent.consume(evt);
  11675. }
  11676. }));
  11677. handles.push(moveHandle);
  11678. }
  11679. else
  11680. {
  11681. handles.push(null);
  11682. }
  11683. }))(this.graph.view.getState(model.getChildAt(this.state.cell, i)));
  11684. }
  11685. return handles;
  11686. };
  11687. /**
  11688. * Function: destroyCustomHandles
  11689. *
  11690. * Destroys the handler and all its resources and DOM nodes.
  11691. */
  11692. mxVertexHandler.prototype.destroyMoveHandles = function()
  11693. {
  11694. if (this.moveHandles != null)
  11695. {
  11696. for (var i = 0; i < this.moveHandles.length; i++)
  11697. {
  11698. if (this.moveHandles[i] != null)
  11699. {
  11700. this.moveHandles[i].destroy();
  11701. // this.moveHandles[i].parentNode.removeChild(this.moveHandles[i]);
  11702. }
  11703. }
  11704. this.moveHandles = null;
  11705. }
  11706. };
  11707. /**
  11708. * Adds handle padding for editing cells and exceptions.
  11709. */
  11710. var vertexHandlerRefresh = mxVertexHandler.prototype.refresh;
  11711. mxVertexHandler.prototype.refresh = function()
  11712. {
  11713. vertexHandlerRefresh.apply(this, arguments);
  11714. if (this.graph.isTable(this.state.cell) &&
  11715. this.graph.isCellMovable(this.state.cell))
  11716. {
  11717. this.refreshMoveHandles();
  11718. }
  11719. };
  11720. /**
  11721. * Adds handle padding for editing cells and exceptions.
  11722. */
  11723. var vertexHandlerGetHandlePadding = mxVertexHandler.prototype.getHandlePadding;
  11724. mxVertexHandler.prototype.getHandlePadding = function()
  11725. {
  11726. var result = new mxPoint(0, 0);
  11727. var tol = this.tolerance;
  11728. var name = this.state.style['shape'];
  11729. if (mxCellRenderer.defaultShapes[name] == null &&
  11730. mxStencilRegistry.getStencil(name) == null)
  11731. {
  11732. name = mxConstants.SHAPE_RECTANGLE;
  11733. }
  11734. // Checks if custom handles are overlapping with the shape border
  11735. var handlePadding = this.graph.isTable(this.state.cell) ||
  11736. this.graph.cellEditor.getEditingCell() == this.state.cell;
  11737. if (!handlePadding)
  11738. {
  11739. if (this.customHandles != null)
  11740. {
  11741. for (var i = 0; i < this.customHandles.length; i++)
  11742. {
  11743. if (this.customHandles[i] != null &&
  11744. this.customHandles[i].shape != null &&
  11745. this.customHandles[i].shape.bounds != null)
  11746. {
  11747. var b = this.customHandles[i].shape.bounds;
  11748. var px = b.getCenterX();
  11749. var py = b.getCenterY();
  11750. if ((Math.abs(this.state.x - px) < b.width / 2) ||
  11751. (Math.abs(this.state.y - py) < b.height / 2) ||
  11752. (Math.abs(this.state.x + this.state.width - px) < b.width / 2) ||
  11753. (Math.abs(this.state.y + this.state.height - py) < b.height / 2))
  11754. {
  11755. handlePadding = true;
  11756. break;
  11757. }
  11758. }
  11759. }
  11760. }
  11761. }
  11762. if (handlePadding && this.sizers != null &&
  11763. this.sizers.length > 0 && this.sizers[0] != null)
  11764. {
  11765. tol /= 2;
  11766. // Makes room for row move handle
  11767. if (this.graph.isTable(this.state.cell))
  11768. {
  11769. tol += 7;
  11770. }
  11771. result.x = this.sizers[0].bounds.width + tol;
  11772. result.y = this.sizers[0].bounds.height + tol;
  11773. }
  11774. else
  11775. {
  11776. result = vertexHandlerGetHandlePadding.apply(this, arguments);
  11777. }
  11778. return result;
  11779. };
  11780. /**
  11781. * Updates the hint for the current operation.
  11782. */
  11783. mxVertexHandler.prototype.updateHint = function(me)
  11784. {
  11785. if (this.index != mxEvent.LABEL_HANDLE)
  11786. {
  11787. if (this.hint == null)
  11788. {
  11789. this.hint = createHint();
  11790. this.state.view.graph.container.appendChild(this.hint);
  11791. }
  11792. if (this.index == mxEvent.ROTATION_HANDLE)
  11793. {
  11794. this.hint.innerHTML = this.currentAlpha + '&deg;';
  11795. }
  11796. else
  11797. {
  11798. var s = this.state.view.scale;
  11799. var unit = this.state.view.unit;
  11800. this.hint.innerHTML = formatHintText(this.roundLength(this.bounds.width / s), unit) + ' x ' +
  11801. formatHintText(this.roundLength(this.bounds.height / s), unit);
  11802. }
  11803. var rot = (this.currentAlpha != null) ? this.currentAlpha : this.state.style[mxConstants.STYLE_ROTATION] || '0';
  11804. var bb = mxUtils.getBoundingBox(this.bounds, rot);
  11805. if (bb == null)
  11806. {
  11807. bb = this.bounds;
  11808. }
  11809. this.hint.style.left = bb.x + Math.round((bb.width - this.hint.clientWidth) / 2) + 'px';
  11810. this.hint.style.top = (bb.y + bb.height + Editor.hintOffset) + 'px';
  11811. if (this.linkHint != null)
  11812. {
  11813. this.linkHint.style.display = 'none';
  11814. }
  11815. }
  11816. };
  11817. /**
  11818. * Updates the hint for the current operation.
  11819. */
  11820. mxVertexHandler.prototype.removeHint = function()
  11821. {
  11822. mxGraphHandler.prototype.removeHint.apply(this, arguments);
  11823. if (this.linkHint != null)
  11824. {
  11825. this.linkHint.style.display = '';
  11826. }
  11827. };
  11828. /**
  11829. * Hides link hint while moving cells.
  11830. */
  11831. var edgeHandlerMouseMove = mxEdgeHandler.prototype.mouseMove;
  11832. mxEdgeHandler.prototype.mouseMove = function(sender, me)
  11833. {
  11834. edgeHandlerMouseMove.apply(this, arguments);
  11835. if (this.linkHint != null && this.linkHint.style.display != 'none' &&
  11836. this.graph.graphHandler != null && this.graph.graphHandler.first != null)
  11837. {
  11838. this.linkHint.style.display = 'none';
  11839. }
  11840. }
  11841. /**
  11842. * Hides link hint while moving cells.
  11843. */
  11844. var edgeHandlerMouseUp = mxEdgeHandler.prototype.mouseUp;
  11845. mxEdgeHandler.prototype.mouseUp = function(sender, me)
  11846. {
  11847. edgeHandlerMouseUp.apply(this, arguments);
  11848. if (this.linkHint != null && this.linkHint.style.display == 'none')
  11849. {
  11850. this.linkHint.style.display = '';
  11851. }
  11852. }
  11853. /**
  11854. * Updates the hint for the current operation.
  11855. */
  11856. mxEdgeHandler.prototype.updateHint = function(me, point)
  11857. {
  11858. if (this.hint == null)
  11859. {
  11860. this.hint = createHint();
  11861. this.state.view.graph.container.appendChild(this.hint);
  11862. }
  11863. var t = this.graph.view.translate;
  11864. var s = this.graph.view.scale;
  11865. var x = this.roundLength(point.x / s - t.x);
  11866. var y = this.roundLength(point.y / s - t.y);
  11867. var unit = this.graph.view.unit;
  11868. this.hint.innerHTML = formatHintText(x, unit) + ', ' + formatHintText(y, unit);
  11869. this.hint.style.visibility = 'visible';
  11870. if (this.isSource || this.isTarget)
  11871. {
  11872. if (this.constraintHandler != null &&
  11873. this.constraintHandler.currentConstraint != null &&
  11874. this.constraintHandler.currentFocus != null)
  11875. {
  11876. var pt = this.constraintHandler.currentConstraint.point;
  11877. this.hint.innerHTML = '[' + Math.round(pt.x * 100) + '%, '+ Math.round(pt.y * 100) + '%]';
  11878. }
  11879. else if (this.marker.hasValidState())
  11880. {
  11881. this.hint.style.visibility = 'hidden';
  11882. }
  11883. }
  11884. this.hint.style.left = Math.round(me.getGraphX() - this.hint.clientWidth / 2) + 'px';
  11885. this.hint.style.top = (Math.max(me.getGraphY(), point.y) + Editor.hintOffset) + 'px';
  11886. if (this.linkHint != null)
  11887. {
  11888. this.linkHint.style.display = 'none';
  11889. }
  11890. };
  11891. /**
  11892. * Replaces folding icons with SVG.
  11893. */
  11894. Graph.prototype.expandedImage = Graph.createSvgImage(9, 9, '<defs><linearGradient id="grad1" x1="50%" y1="0%" x2="50%" y2="100%">' +
  11895. '<stop offset="30%" style="stop-color:#f0f0f0;" /><stop offset="100%" style="stop-color:#AFB0B6;" /></linearGradient></defs>' +
  11896. '<rect x="0" y="0" width="9" height="9" stroke="#8A94A5" fill="url(#grad1)" stroke-width="2"/>' +
  11897. '<path d="M 2 4.5 L 7 4.5 z" stroke="#000"/>');
  11898. Graph.prototype.collapsedImage = Graph.createSvgImage(9, 9, '<defs><linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="100%">' +
  11899. '<stop offset="30%" style="stop-color:#f0f0f0;" /><stop offset="100%" style="stop-color:#AFB0B6;" /></linearGradient></defs>' +
  11900. '<rect x="0" y="0" width="9" height="9" stroke="#8A94A5" fill="url(#grad1)" stroke-width="2"/>' +
  11901. '<path d="M 4.5 2 L 4.5 7 M 2 4.5 L 7 4.5 z" stroke="#000"/>');
  11902. /**
  11903. * Updates the hint for the current operation.
  11904. */
  11905. mxEdgeHandler.prototype.removeHint = mxVertexHandler.prototype.removeHint;
  11906. /**
  11907. * Defines the handles for the UI. Uses data-URIs to speed-up loading time where supported.
  11908. */
  11909. HoverIcons.prototype.mainHandle = Graph.createSvgImage(18, 18, '<circle cx="9" cy="9" r="5" stroke="#fff" fill="' + HoverIcons.prototype.arrowFill + '"/>');
  11910. HoverIcons.prototype.endMainHandle = Graph.createSvgImage(18, 18, '<circle cx="9" cy="9" r="6" stroke="#fff" fill="' + HoverIcons.prototype.arrowFill + '"/>');
  11911. HoverIcons.prototype.secondaryHandle = Graph.createSvgImage(16, 16, '<path d="m 8 3 L 13 8 L 8 13 L 3 8 z" stroke="#fff" fill="#fca000"/>');
  11912. HoverIcons.prototype.fixedHandle = Graph.createSvgImage(22, 22,
  11913. '<circle cx="11" cy="11" r="6" stroke="#fff" fill="#01bd22"/>' +
  11914. '<path d="m 8 8 L 14 14M 8 14 L 14 8" stroke="#fff"/>');
  11915. HoverIcons.prototype.endFixedHandle = Graph.createSvgImage(22, 22,
  11916. '<circle cx="11" cy="11" r="7" stroke="#fff" fill="#01bd22"/>' +
  11917. '<path d="m 8 8 L 14 14M 8 14 L 14 8" stroke="#fff"/>');
  11918. HoverIcons.prototype.terminalHandle = Graph.createSvgImage(22, 22,
  11919. '<circle cx="11" cy="11" r="6" stroke="#fff" fill="' + HoverIcons.prototype.arrowFill +
  11920. '"/><circle cx="11" cy="11" r="3" stroke="#fff" fill="transparent"/>');
  11921. HoverIcons.prototype.endTerminalHandle = Graph.createSvgImage(22, 22,
  11922. '<circle cx="11" cy="11" r="7" stroke="#fff" fill="' + HoverIcons.prototype.arrowFill +
  11923. '"/><circle cx="11" cy="11" r="3" stroke="#fff" fill="transparent"/>');
  11924. HoverIcons.prototype.rotationHandle = Graph.createSvgImage(16, 16,
  11925. '<path stroke="' + HoverIcons.prototype.arrowFill + '" fill="' + HoverIcons.prototype.arrowFill +
  11926. '" d="M15.55 5.55L11 1v3.07C7.06 4.56 4 7.92 4 12s3.05 7.44 7 7.93v-2.02c-2.84-.48-5-2.94-5-5.91s2.16-5.43 5-5.91V10l4.55-4.45zM19.93 11c-.17-1.39-.72-2.73-1.62-3.89l-1.42 1.42c.54.75.88 1.6 1.02 2.47h2.02zM13 17.9v2.02c1.39-.17 2.74-.71 3.9-1.61l-1.44-1.44c-.75.54-1.59.89-2.46 1.03zm3.89-2.42l1.42 1.41c.9-1.16 1.45-2.5 1.62-3.89h-2.02c-.14.87-.48 1.72-1.02 2.48z"/>',
  11927. 24, 24);
  11928. mxConstraintHandler.prototype.pointImage = Graph.createSvgImage(5, 5,
  11929. '<path d="m 0 0 L 5 5 M 0 5 L 5 0" stroke-width="2" style="stroke-opacity:0.4" stroke="#ffffff"/>' +
  11930. '<path d="m 0 0 L 5 5 M 0 5 L 5 0" stroke="' + HoverIcons.prototype.arrowFill + '"/>');
  11931. mxVertexHandler.TABLE_HANDLE_COLOR = '#fca000';
  11932. mxVertexHandler.prototype.handleImage = HoverIcons.prototype.mainHandle;
  11933. mxVertexHandler.prototype.secondaryHandleImage = HoverIcons.prototype.secondaryHandle;
  11934. mxVertexHandler.prototype.rowHandleImage = Graph.createSvgImage(14, 12,
  11935. '<rect x="2" y="2" width="10" height="3" stroke-width="1" stroke="#ffffff" fill="' + HoverIcons.prototype.arrowFill + '"/>' +
  11936. '<rect x="2" y="7" width="10" height="3" stroke-width="1" stroke="#ffffff" fill="' + HoverIcons.prototype.arrowFill + '"/>');
  11937. mxEdgeHandler.prototype.handleImage = HoverIcons.prototype.mainHandle;
  11938. mxEdgeHandler.prototype.endHandleImage = HoverIcons.prototype.endMainHandle;
  11939. mxEdgeHandler.prototype.terminalHandleImage = HoverIcons.prototype.terminalHandle;
  11940. mxEdgeHandler.prototype.endTerminalHandleImage = HoverIcons.prototype.endTerminalHandle;
  11941. mxEdgeHandler.prototype.fixedHandleImage = HoverIcons.prototype.fixedHandle;
  11942. mxEdgeHandler.prototype.endFixedHandleImage = HoverIcons.prototype.endFixedHandle;
  11943. mxEdgeHandler.prototype.labelHandleImage = HoverIcons.prototype.secondaryHandle;
  11944. mxOutline.prototype.sizerImage = HoverIcons.prototype.mainHandle;
  11945. if (window.Sidebar != null)
  11946. {
  11947. Sidebar.prototype.triangleUp = HoverIcons.prototype.triangleUp;
  11948. Sidebar.prototype.triangleRight = HoverIcons.prototype.triangleRight;
  11949. Sidebar.prototype.triangleDown = HoverIcons.prototype.triangleDown;
  11950. Sidebar.prototype.triangleLeft = HoverIcons.prototype.triangleLeft;
  11951. Sidebar.prototype.refreshTarget = HoverIcons.prototype.refreshTarget;
  11952. Sidebar.prototype.roundDrop = HoverIcons.prototype.roundDrop;
  11953. }
  11954. // Adds rotation handle and live preview
  11955. mxVertexHandler.prototype.rotationEnabled = true;
  11956. mxVertexHandler.prototype.manageSizers = true;
  11957. mxVertexHandler.prototype.livePreview = true;
  11958. mxGraphHandler.prototype.maxLivePreview = 16;
  11959. // Increases default rubberband opacity (default is 20)
  11960. mxRubberband.prototype.defaultOpacity = 30;
  11961. // Enables connections along the outline, virtual waypoints, parent highlight etc
  11962. mxConnectionHandler.prototype.outlineConnect = true;
  11963. mxCellHighlight.prototype.keepOnTop = true;
  11964. mxVertexHandler.prototype.parentHighlightEnabled = true;
  11965. mxEdgeHandler.prototype.parentHighlightEnabled = true;
  11966. mxEdgeHandler.prototype.dblClickRemoveEnabled = true;
  11967. mxEdgeHandler.prototype.straightRemoveEnabled = true;
  11968. mxEdgeHandler.prototype.virtualBendsEnabled = true;
  11969. mxEdgeHandler.prototype.mergeRemoveEnabled = true;
  11970. mxEdgeHandler.prototype.manageLabelHandle = true;
  11971. mxEdgeHandler.prototype.outlineConnect = true;
  11972. // Disables adding waypoints if shift is pressed
  11973. mxEdgeHandler.prototype.isAddVirtualBendEvent = function(me)
  11974. {
  11975. return !mxEvent.isShiftDown(me.getEvent());
  11976. };
  11977. // Disables custom handles if shift is pressed
  11978. mxEdgeHandler.prototype.isCustomHandleEvent = function(me)
  11979. {
  11980. return !mxEvent.isShiftDown(me.getEvent());
  11981. };
  11982. /**
  11983. * Implements touch style
  11984. */
  11985. if (Graph.touchStyle)
  11986. {
  11987. // Larger tolerance for real touch devices
  11988. if (mxClient.IS_TOUCH || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0)
  11989. {
  11990. mxShape.prototype.svgStrokeTolerance = 18;
  11991. mxVertexHandler.prototype.tolerance = 12;
  11992. mxEdgeHandler.prototype.tolerance = 12;
  11993. Graph.prototype.tolerance = 12;
  11994. mxVertexHandler.prototype.rotationHandleVSpacing = -16;
  11995. // Implements a smaller tolerance for mouse events and a larger tolerance for touch
  11996. // events on touch devices. The default tolerance (4px) is used for mouse events.
  11997. mxConstraintHandler.prototype.getTolerance = function(me)
  11998. {
  11999. return (mxEvent.isMouseEvent(me.getEvent())) ? 4 : this.graph.getTolerance();
  12000. };
  12001. }
  12002. // One finger pans (no rubberband selection) must start regardless of mouse button
  12003. mxPanningHandler.prototype.isPanningTrigger = function(me)
  12004. {
  12005. var evt = me.getEvent();
  12006. return (me.getState() == null && !mxEvent.isMouseEvent(evt)) ||
  12007. (mxEvent.isPopupTrigger(evt) && (me.getState() == null ||
  12008. mxEvent.isControlDown(evt) || mxEvent.isShiftDown(evt)));
  12009. };
  12010. // Don't clear selection if multiple cells selected
  12011. var graphHandlerMouseDown = mxGraphHandler.prototype.mouseDown;
  12012. mxGraphHandler.prototype.mouseDown = function(sender, me)
  12013. {
  12014. graphHandlerMouseDown.apply(this, arguments);
  12015. if (mxEvent.isTouchEvent(me.getEvent()) && this.graph.isCellSelected(me.getCell()) &&
  12016. this.graph.getSelectionCount() > 1)
  12017. {
  12018. this.delayedSelection = false;
  12019. }
  12020. };
  12021. }
  12022. else
  12023. {
  12024. // Removes ctrl+shift as panning trigger for space splitting
  12025. mxPanningHandler.prototype.isPanningTrigger = function(me)
  12026. {
  12027. var evt = me.getEvent();
  12028. return (mxEvent.isLeftMouseButton(evt) && ((this.useLeftButtonForPanning &&
  12029. me.getState() == null) || (mxEvent.isControlDown(evt) &&
  12030. !mxEvent.isShiftDown(evt)))) || (this.usePopupTrigger &&
  12031. mxEvent.isPopupTrigger(evt));
  12032. };
  12033. }
  12034. // Overrides/extends rubberband for space handling with Ctrl+Shift(+Alt) drag ("scissors tool")
  12035. mxRubberband.prototype.isSpaceEvent = function(me)
  12036. {
  12037. return this.graph.isEnabled() && !this.graph.isCellLocked(this.graph.getDefaultParent()) &&
  12038. (mxEvent.isControlDown(me.getEvent()) || mxEvent.isMetaDown(me.getEvent())) &&
  12039. mxEvent.isShiftDown(me.getEvent()) && mxEvent.isAltDown(me.getEvent());
  12040. };
  12041. // Cancelled state
  12042. mxRubberband.prototype.cancelled = false;
  12043. // Cancels ongoing rubberband selection but consumed event to avoid reset of selection
  12044. mxRubberband.prototype.cancel = function()
  12045. {
  12046. if (this.isActive())
  12047. {
  12048. this.cancelled = true;
  12049. this.reset();
  12050. }
  12051. };
  12052. // Handles moving of cells in both half panes
  12053. mxRubberband.prototype.mouseUp = function(sender, me)
  12054. {
  12055. if (this.cancelled)
  12056. {
  12057. this.cancelled = false;
  12058. me.consume();
  12059. }
  12060. else
  12061. {
  12062. var execute = this.div != null && this.div.style.display != 'none';
  12063. var x0 = null;
  12064. var y0 = null;
  12065. var dx = null;
  12066. var dy = null;
  12067. if (this.first != null && this.currentX != null && this.currentY != null)
  12068. {
  12069. x0 = this.first.x;
  12070. y0 = this.first.y;
  12071. dx = (this.currentX - x0) / this.graph.view.scale;
  12072. dy = (this.currentY - y0) / this.graph.view.scale;
  12073. if (!mxEvent.isAltDown(me.getEvent()))
  12074. {
  12075. dx = this.graph.snap(dx);
  12076. dy = this.graph.snap(dy);
  12077. if (!this.graph.isGridEnabled())
  12078. {
  12079. if (Math.abs(dx) < this.graph.tolerance)
  12080. {
  12081. dx = 0;
  12082. }
  12083. if (Math.abs(dy) < this.graph.tolerance)
  12084. {
  12085. dy = 0;
  12086. }
  12087. }
  12088. }
  12089. }
  12090. this.reset();
  12091. if (execute)
  12092. {
  12093. if (this.isSpaceEvent(me))
  12094. {
  12095. this.graph.model.beginUpdate();
  12096. try
  12097. {
  12098. var cells = this.graph.getCellsBeyond(x0, y0, this.graph.getDefaultParent(), true, true);
  12099. for (var i = 0; i < cells.length; i++)
  12100. {
  12101. if (this.graph.isCellMovable(cells[i]))
  12102. {
  12103. var tmp = this.graph.view.getState(cells[i]);
  12104. var geo = this.graph.getCellGeometry(cells[i]);
  12105. if (tmp != null && geo != null)
  12106. {
  12107. geo = geo.clone();
  12108. geo.translate(dx, dy);
  12109. this.graph.model.setGeometry(cells[i], geo);
  12110. }
  12111. }
  12112. }
  12113. }
  12114. finally
  12115. {
  12116. this.graph.model.endUpdate();
  12117. }
  12118. }
  12119. else
  12120. {
  12121. var rect = new mxRectangle(this.x, this.y, this.width, this.height);
  12122. this.graph.selectRegion(rect, me.getEvent());
  12123. }
  12124. me.consume();
  12125. }
  12126. }
  12127. };
  12128. // Handles preview for creating/removing space in diagram
  12129. mxRubberband.prototype.mouseMove = function(sender, me)
  12130. {
  12131. if (!me.isConsumed() && this.first != null)
  12132. {
  12133. var origin = mxUtils.getScrollOrigin(this.graph.container);
  12134. var offset = mxUtils.getOffset(this.graph.container);
  12135. origin.x -= offset.x;
  12136. origin.y -= offset.y;
  12137. var x = me.getX() + origin.x;
  12138. var y = me.getY() + origin.y;
  12139. var dx = this.first.x - x;
  12140. var dy = this.first.y - y;
  12141. var tol = this.graph.tolerance;
  12142. if (this.div != null || Math.abs(dx) > tol || Math.abs(dy) > tol)
  12143. {
  12144. if (this.div == null)
  12145. {
  12146. this.div = this.createShape();
  12147. }
  12148. // Clears selection while rubberbanding. This is required because
  12149. // the event is not consumed in mouseDown.
  12150. mxUtils.clearSelection();
  12151. this.update(x, y);
  12152. if (this.isSpaceEvent(me))
  12153. {
  12154. var right = this.x + this.width;
  12155. var bottom = this.y + this.height;
  12156. var scale = this.graph.view.scale;
  12157. if (!mxEvent.isAltDown(me.getEvent()))
  12158. {
  12159. this.width = this.graph.snap(this.width / scale) * scale;
  12160. this.height = this.graph.snap(this.height / scale) * scale;
  12161. if (!this.graph.isGridEnabled())
  12162. {
  12163. if (this.width < this.graph.tolerance)
  12164. {
  12165. this.width = 0;
  12166. }
  12167. if (this.height < this.graph.tolerance)
  12168. {
  12169. this.height = 0;
  12170. }
  12171. }
  12172. if (this.x < this.first.x)
  12173. {
  12174. this.x = right - this.width;
  12175. }
  12176. if (this.y < this.first.y)
  12177. {
  12178. this.y = bottom - this.height;
  12179. }
  12180. }
  12181. this.div.style.borderStyle = 'dashed';
  12182. this.div.style.backgroundColor = 'white';
  12183. this.div.style.left = this.x + 'px';
  12184. this.div.style.top = this.y + 'px';
  12185. this.div.style.width = Math.max(0, this.width) + 'px';
  12186. this.div.style.height = this.graph.container.clientHeight + 'px';
  12187. this.div.style.borderWidth = (this.width <= 0) ? '0px 1px 0px 0px' : '0px 1px 0px 1px';
  12188. if (this.secondDiv == null)
  12189. {
  12190. this.secondDiv = this.div.cloneNode(true);
  12191. this.div.parentNode.appendChild(this.secondDiv);
  12192. }
  12193. this.secondDiv.style.left = this.x + 'px';
  12194. this.secondDiv.style.top = this.y + 'px';
  12195. this.secondDiv.style.width = this.graph.container.clientWidth + 'px';
  12196. this.secondDiv.style.height = Math.max(0, this.height) + 'px';
  12197. this.secondDiv.style.borderWidth = (this.height <= 0) ? '1px 0px 0px 0px' : '1px 0px 1px 0px';
  12198. }
  12199. else
  12200. {
  12201. // Hides second div and restores style
  12202. this.div.style.backgroundColor = '';
  12203. this.div.style.borderWidth = '';
  12204. this.div.style.borderStyle = '';
  12205. if (this.secondDiv != null)
  12206. {
  12207. this.secondDiv.parentNode.removeChild(this.secondDiv);
  12208. this.secondDiv = null;
  12209. }
  12210. }
  12211. me.consume();
  12212. }
  12213. }
  12214. };
  12215. // Removes preview
  12216. var mxRubberbandReset = mxRubberband.prototype.reset;
  12217. mxRubberband.prototype.reset = function()
  12218. {
  12219. if (this.secondDiv != null)
  12220. {
  12221. this.secondDiv.parentNode.removeChild(this.secondDiv);
  12222. this.secondDiv = null;
  12223. }
  12224. mxRubberbandReset.apply(this, arguments);
  12225. };
  12226. // Timer-based activation of outline connect in connection handler
  12227. var startTime = new Date().getTime();
  12228. var timeOnTarget = 0;
  12229. var mxEdgeHandlerUpdatePreviewState = mxEdgeHandler.prototype.updatePreviewState;
  12230. mxEdgeHandler.prototype.updatePreviewState = function(edge, point, terminalState, me)
  12231. {
  12232. mxEdgeHandlerUpdatePreviewState.apply(this, arguments);
  12233. if (terminalState != this.currentTerminalState)
  12234. {
  12235. startTime = new Date().getTime();
  12236. timeOnTarget = 0;
  12237. }
  12238. else
  12239. {
  12240. timeOnTarget = new Date().getTime() - startTime;
  12241. }
  12242. this.currentTerminalState = terminalState;
  12243. };
  12244. // Timer-based outline connect
  12245. var mxEdgeHandlerIsOutlineConnectEvent = mxEdgeHandler.prototype.isOutlineConnectEvent;
  12246. mxEdgeHandler.prototype.isOutlineConnectEvent = function(me)
  12247. {
  12248. if (mxEvent.isShiftDown(me.getEvent()) && mxEvent.isAltDown(me.getEvent()))
  12249. {
  12250. return false;
  12251. }
  12252. else
  12253. {
  12254. return (this.currentTerminalState != null && me.getState() == this.currentTerminalState && timeOnTarget > 2000) ||
  12255. ((this.currentTerminalState == null || mxUtils.getValue(this.currentTerminalState.style, 'outlineConnect', '1') != '0') &&
  12256. mxEdgeHandlerIsOutlineConnectEvent.apply(this, arguments));
  12257. }
  12258. };
  12259. // Shows secondary handle for fixed connection points
  12260. mxEdgeHandler.prototype.createHandleShape = function(index, virtual, target)
  12261. {
  12262. var source = index != null && index == 0;
  12263. var terminalState = this.state.getVisibleTerminalState(source);
  12264. var c = (index != null && (index == 0 || index >= this.state.absolutePoints.length - 1 ||
  12265. (this.constructor == mxElbowEdgeHandler && index == 2))) ?
  12266. this.graph.getConnectionConstraint(this.state, terminalState, source) : null;
  12267. var pt = (c != null) ? this.graph.getConnectionPoint(this.state.getVisibleTerminalState(source), c) : null;
  12268. var img = (pt != null) ? (!target ? this.fixedHandleImage : this.endFixedHandleImage) :
  12269. ((c != null && terminalState != null) ? (!target ? this.terminalHandleImage : this.endTerminalHandleImage) :
  12270. (!target ? this.handleImage : this.endHandleImage));
  12271. if (img != null)
  12272. {
  12273. var shape = new mxImageShape(new mxRectangle(0, 0, img.width, img.height), img.src);
  12274. // Allows HTML rendering of the images
  12275. shape.preserveImageAspect = false;
  12276. return shape;
  12277. }
  12278. else
  12279. {
  12280. var s = mxConstants.HANDLE_SIZE;
  12281. if (this.preferHtml)
  12282. {
  12283. s -= 1;
  12284. }
  12285. return new mxRectangleShape(new mxRectangle(0, 0, s, s), mxConstants.HANDLE_FILLCOLOR, mxConstants.HANDLE_STROKECOLOR);
  12286. }
  12287. };
  12288. var vertexHandlerCreateSizerShape = mxVertexHandler.prototype.createSizerShape;
  12289. mxVertexHandler.prototype.createSizerShape = function(bounds, index, fillColor, image)
  12290. {
  12291. image = (index == mxEvent.ROTATION_HANDLE) ? HoverIcons.prototype.rotationHandle :
  12292. (index == mxEvent.LABEL_HANDLE) ? this.secondaryHandleImage : image;
  12293. return vertexHandlerCreateSizerShape.apply(this, arguments);
  12294. };
  12295. // Special case for single edge label handle moving in which case the text bounding box is used
  12296. var mxGraphHandlerGetBoundingBox = mxGraphHandler.prototype.getBoundingBox;
  12297. mxGraphHandler.prototype.getBoundingBox = function(cells)
  12298. {
  12299. if (cells != null && cells.length == 1)
  12300. {
  12301. var model = this.graph.getModel();
  12302. var parent = model.getParent(cells[0]);
  12303. var geo = this.graph.getCellGeometry(cells[0]);
  12304. if (model.isEdge(parent) && geo != null && geo.relative)
  12305. {
  12306. var state = this.graph.view.getState(cells[0]);
  12307. if (state != null && state.width < 2 && state.height < 2 && state.text != null &&
  12308. state.text.boundingBox != null)
  12309. {
  12310. return mxRectangle.fromRectangle(state.text.boundingBox);
  12311. }
  12312. }
  12313. }
  12314. return mxGraphHandlerGetBoundingBox.apply(this, arguments);
  12315. };
  12316. // Ignores child cells with part style as guides
  12317. var mxGraphHandlerGetGuideStates = mxGraphHandler.prototype.getGuideStates;
  12318. mxGraphHandler.prototype.getGuideStates = function()
  12319. {
  12320. var states = mxGraphHandlerGetGuideStates.apply(this, arguments);
  12321. var result = [];
  12322. // NOTE: Could do via isStateIgnored hook
  12323. for (var i = 0; i < states.length; i++)
  12324. {
  12325. if (mxUtils.getValue(states[i].style, 'part', '0') != '1')
  12326. {
  12327. result.push(states[i]);
  12328. }
  12329. }
  12330. return result;
  12331. };
  12332. // Uses text bounding box for edge labels
  12333. var mxVertexHandlerGetSelectionBounds = mxVertexHandler.prototype.getSelectionBounds;
  12334. mxVertexHandler.prototype.getSelectionBounds = function(state)
  12335. {
  12336. var model = this.graph.getModel();
  12337. var parent = model.getParent(state.cell);
  12338. var geo = this.graph.getCellGeometry(state.cell);
  12339. if (model.isEdge(parent) && geo != null && geo.relative && state.width < 2 && state.height < 2 && state.text != null && state.text.boundingBox != null)
  12340. {
  12341. var bbox = state.text.unrotatedBoundingBox || state.text.boundingBox;
  12342. return new mxRectangle(Math.round(bbox.x), Math.round(bbox.y), Math.round(bbox.width), Math.round(bbox.height));
  12343. }
  12344. else
  12345. {
  12346. return mxVertexHandlerGetSelectionBounds.apply(this, arguments);
  12347. }
  12348. };
  12349. // Redirects moving of edge labels to mxGraphHandler by not starting here.
  12350. // This will use the move preview of mxGraphHandler (see above).
  12351. var mxVertexHandlerMouseDown = mxVertexHandler.prototype.mouseDown;
  12352. mxVertexHandler.prototype.mouseDown = function(sender, me)
  12353. {
  12354. var model = this.graph.getModel();
  12355. var parent = model.getParent(this.state.cell);
  12356. var geo = this.graph.getCellGeometry(this.state.cell);
  12357. // Lets rotation events through
  12358. var handle = this.getHandleForEvent(me);
  12359. if (handle == mxEvent.ROTATION_HANDLE || !model.isEdge(parent) || geo == null || !geo.relative ||
  12360. this.state == null || this.state.width >= 2 || this.state.height >= 2)
  12361. {
  12362. mxVertexHandlerMouseDown.apply(this, arguments);
  12363. }
  12364. };
  12365. // Invokes turn on single click on rotation handle
  12366. mxVertexHandler.prototype.rotateClick = function()
  12367. {
  12368. var stroke = mxUtils.getValue(this.state.style, mxConstants.STYLE_STROKECOLOR, mxConstants.NONE);
  12369. var fill = mxUtils.getValue(this.state.style, mxConstants.STYLE_FILLCOLOR, mxConstants.NONE);
  12370. if (this.state.view.graph.model.isVertex(this.state.cell) &&
  12371. stroke == mxConstants.NONE && fill == mxConstants.NONE)
  12372. {
  12373. var angle = mxUtils.mod(mxUtils.getValue(this.state.style, mxConstants.STYLE_ROTATION, 0) + 90, 360);
  12374. this.state.view.graph.setCellStyles(mxConstants.STYLE_ROTATION, angle, [this.state.cell]);
  12375. }
  12376. else
  12377. {
  12378. this.state.view.graph.turnShapes([this.state.cell]);
  12379. }
  12380. };
  12381. var vertexHandlerMouseMove = mxVertexHandler.prototype.mouseMove;
  12382. // Workaround for "isConsumed not defined" in MS Edge is to use arguments
  12383. mxVertexHandler.prototype.mouseMove = function(sender, me)
  12384. {
  12385. vertexHandlerMouseMove.apply(this, arguments);
  12386. if (this.graph.graphHandler.first != null)
  12387. {
  12388. if (this.rotationShape != null && this.rotationShape.node != null)
  12389. {
  12390. this.rotationShape.node.style.display = 'none';
  12391. }
  12392. if (this.linkHint != null && this.linkHint.style.display != 'none')
  12393. {
  12394. this.linkHint.style.display = 'none';
  12395. }
  12396. }
  12397. };
  12398. var vertexHandlerMouseUp = mxVertexHandler.prototype.mouseUp;
  12399. mxVertexHandler.prototype.mouseUp = function(sender, me)
  12400. {
  12401. vertexHandlerMouseUp.apply(this, arguments);
  12402. // Shows rotation handle only if one vertex is selected
  12403. if (this.rotationShape != null && this.rotationShape.node != null)
  12404. {
  12405. this.rotationShape.node.style.display = (this.graph.getSelectionCount() == 1) ? '' : 'none';
  12406. }
  12407. if (this.linkHint != null && this.linkHint.style.display == 'none')
  12408. {
  12409. this.linkHint.style.display = '';
  12410. }
  12411. // Resets state after gesture
  12412. this.blockDelayedSelection = null;
  12413. };
  12414. var vertexHandlerInit = mxVertexHandler.prototype.init;
  12415. mxVertexHandler.prototype.init = function()
  12416. {
  12417. vertexHandlerInit.apply(this, arguments);
  12418. var redraw = false;
  12419. if (this.rotationShape != null)
  12420. {
  12421. this.rotationShape.node.setAttribute('title', mxResources.get('rotateTooltip'));
  12422. }
  12423. if (this.graph.isTable(this.state.cell) &&
  12424. this.graph.isCellMovable(this.state.cell))
  12425. {
  12426. this.refreshMoveHandles();
  12427. }
  12428. // Draws corner rectangles for single selected table cells and rows
  12429. else if (this.graph.getSelectionCount() == 1 &&
  12430. this.graph.isCellMovable(this.state.cell) &&
  12431. (this.graph.isTableCell(this.state.cell) ||
  12432. this.graph.isTableRow(this.state.cell)))
  12433. {
  12434. this.cornerHandles = [];
  12435. for (var i = 0; i < 4; i++)
  12436. {
  12437. var shape = new mxRectangleShape(new mxRectangle(0, 0, 6, 6),
  12438. '#ffffff', mxConstants.HANDLE_STROKECOLOR);
  12439. shape.dialect = mxConstants.DIALECT_SVG;
  12440. shape.init(this.graph.view.getOverlayPane());
  12441. this.cornerHandles.push(shape);
  12442. }
  12443. }
  12444. var update = mxUtils.bind(this, function()
  12445. {
  12446. if (this.specialHandle != null)
  12447. {
  12448. this.specialHandle.node.style.display = (this.graph.isEnabled() &&
  12449. this.graph.getSelectionCount() <= this.graph.graphHandler.maxCells) ?
  12450. '' : 'none';
  12451. }
  12452. this.redrawHandles();
  12453. });
  12454. this.changeHandler = mxUtils.bind(this, function(sender, evt)
  12455. {
  12456. this.updateLinkHint(this.graph.getLinkForCell(this.state.cell),
  12457. this.graph.getLinksForState(this.state));
  12458. update();
  12459. });
  12460. this.graph.getSelectionModel().addListener(mxEvent.CHANGE, this.changeHandler);
  12461. this.graph.getModel().addListener(mxEvent.CHANGE, this.changeHandler);
  12462. // Repaint needed when editing stops and no change event is fired
  12463. this.editingHandler = mxUtils.bind(this, function(sender, evt)
  12464. {
  12465. this.redrawHandles();
  12466. });
  12467. this.graph.addListener(mxEvent.EDITING_STOPPED, this.editingHandler);
  12468. var link = this.graph.getLinkForCell(this.state.cell);
  12469. var links = this.graph.getLinksForState(this.state);
  12470. this.updateLinkHint(link, links);
  12471. if (link != null || (links != null && links.length > 0))
  12472. {
  12473. redraw = true;
  12474. }
  12475. if (redraw)
  12476. {
  12477. this.redrawHandles();
  12478. }
  12479. };
  12480. mxVertexHandler.prototype.updateLinkHint = function(link, links)
  12481. {
  12482. try
  12483. {
  12484. if ((link == null && (links == null || links.length == 0)) ||
  12485. this.graph.getSelectionCount() > 1)
  12486. {
  12487. if (this.linkHint != null)
  12488. {
  12489. this.linkHint.parentNode.removeChild(this.linkHint);
  12490. this.linkHint = null;
  12491. }
  12492. }
  12493. else if (link != null || (links != null && links.length > 0))
  12494. {
  12495. var img = document.createElement('img');
  12496. img.className = 'geAdaptiveAsset';
  12497. img.setAttribute('src', Editor.editImage);
  12498. img.setAttribute('title', mxResources.get('editLink'));
  12499. img.setAttribute('width', '14');
  12500. img.setAttribute('height', '14');
  12501. img.style.paddingLeft = '8px';
  12502. img.style.marginLeft = 'auto';
  12503. img.style.marginBottom = '-1px';
  12504. img.style.cursor = 'pointer';
  12505. var trash = img.cloneNode(true);
  12506. trash.setAttribute('src', Editor.trashImage);
  12507. trash.setAttribute('title', mxResources.get('removeIt',
  12508. [mxResources.get('link')]));
  12509. trash.style.paddingLeft = '4px';
  12510. trash.style.marginLeft = '0';
  12511. if (this.linkHint == null)
  12512. {
  12513. this.linkHint = createHint();
  12514. this.linkHint.style.padding = '6px 8px 6px 8px';
  12515. this.linkHint.style.opacity = '1';
  12516. this.linkHint.style.filter = '';
  12517. this.graph.container.appendChild(this.linkHint);
  12518. mxEvent.addListener(this.linkHint, 'mouseenter', mxUtils.bind(this, function()
  12519. {
  12520. this.graph.tooltipHandler.hide();
  12521. }));
  12522. }
  12523. this.linkHint.innerText = '';
  12524. if (link != null)
  12525. {
  12526. var wrapper = document.createElement('div');
  12527. wrapper.style.display = 'flex';
  12528. wrapper.style.alignItems = 'center';
  12529. wrapper.appendChild(this.graph.createLinkForHint(link));
  12530. this.linkHint.appendChild(wrapper);
  12531. if (this.graph.isEnabled() && typeof this.graph.editLink === 'function' &&
  12532. !this.graph.isCellLocked(this.state.cell))
  12533. {
  12534. var changeLink = img.cloneNode(true);
  12535. wrapper.appendChild(changeLink);
  12536. mxEvent.addListener(changeLink, 'click', mxUtils.bind(this, function(evt)
  12537. {
  12538. this.graph.setSelectionCell(this.state.cell);
  12539. this.graph.editLink();
  12540. mxEvent.consume(evt);
  12541. }));
  12542. var trashLink = trash.cloneNode(true);
  12543. wrapper.appendChild(trashLink);
  12544. mxEvent.addListener(trashLink, 'click', mxUtils.bind(this, function(evt)
  12545. {
  12546. this.graph.setLinkForCell(this.state.cell, null);
  12547. mxEvent.consume(evt);
  12548. }));
  12549. }
  12550. }
  12551. if (links != null)
  12552. {
  12553. for (var i = 0; i < links.length; i++)
  12554. {
  12555. (mxUtils.bind(this, function(currentLink, index)
  12556. {
  12557. var div = document.createElement('div');
  12558. div.style.display = 'flex';
  12559. div.style.alignItems = 'center';
  12560. div.style.marginTop = (link != null || index > 0) ? '6px' : '0px';
  12561. div.appendChild(this.graph.createLinkForHint(
  12562. currentLink.getAttribute('href'),
  12563. mxUtils.getTextContent(currentLink)));
  12564. var changeLink = img.cloneNode(true);
  12565. div.appendChild(changeLink);
  12566. var updateLink = mxUtils.bind(this, function(value)
  12567. {
  12568. var tmp = document.createElement('div');
  12569. tmp.innerHTML = Graph.sanitizeHtml(this.graph.getLabel(this.state.cell));
  12570. var anchor = tmp.getElementsByTagName('a')[index];
  12571. if (value == null || value == '')
  12572. {
  12573. var child = anchor.cloneNode(true).firstChild;
  12574. while (child != null)
  12575. {
  12576. anchor.parentNode.insertBefore(child.cloneNode(true), anchor);
  12577. child = child.nextSibling;
  12578. }
  12579. anchor.parentNode.removeChild(anchor);
  12580. }
  12581. else
  12582. {
  12583. anchor.setAttribute('href', value);
  12584. }
  12585. this.graph.labelChanged(this.state.cell, tmp.innerHTML);
  12586. });
  12587. mxEvent.addListener(changeLink, 'click', mxUtils.bind(this, function(evt)
  12588. {
  12589. this.graph.showLinkDialog(currentLink.getAttribute('href') || '',
  12590. mxResources.get('apply'), updateLink);
  12591. mxEvent.consume(evt);
  12592. }));
  12593. var trashLink = trash.cloneNode(true);
  12594. div.appendChild(trashLink);
  12595. mxEvent.addListener(trashLink, 'click', mxUtils.bind(this, function(evt)
  12596. {
  12597. updateLink();
  12598. mxEvent.consume(evt);
  12599. }));
  12600. this.linkHint.appendChild(div);
  12601. }))(links[i], i);
  12602. }
  12603. }
  12604. }
  12605. if (this.linkHint != null)
  12606. {
  12607. Graph.sanitizeNode(this.linkHint);
  12608. }
  12609. }
  12610. catch (e)
  12611. {
  12612. // ignore
  12613. }
  12614. };
  12615. mxEdgeHandler.prototype.updateLinkHint = mxVertexHandler.prototype.updateLinkHint;
  12616. // Extends constraint handler
  12617. var edgeHandlerCreateConstraintHandler = mxEdgeHandler.prototype.createConstraintHandler;
  12618. mxEdgeHandler.prototype.createConstraintHandler = function()
  12619. {
  12620. var handler = edgeHandlerCreateConstraintHandler.apply(this, arguments);
  12621. // Disables connection points
  12622. handler.isEnabled = mxUtils.bind(this, function()
  12623. {
  12624. return this.state.view.graph.connectionHandler.isEnabled();
  12625. });
  12626. return handler;
  12627. };
  12628. // Creates special handles
  12629. var edgeHandlerInit = mxEdgeHandler.prototype.init;
  12630. mxEdgeHandler.prototype.init = function()
  12631. {
  12632. edgeHandlerInit.apply(this, arguments);
  12633. var update = mxUtils.bind(this, function()
  12634. {
  12635. if (this.linkHint != null)
  12636. {
  12637. this.linkHint.style.display = (this.graph.getSelectionCount() == 1) ? '' : 'none';
  12638. }
  12639. if (this.labelShape != null)
  12640. {
  12641. this.labelShape.node.style.display = (this.graph.isEnabled() &&
  12642. this.graph.getSelectionCount() <= this.graph.graphHandler.maxCells) ?
  12643. '' : 'none';
  12644. }
  12645. });
  12646. this.changeHandler = mxUtils.bind(this, function(sender, evt)
  12647. {
  12648. this.updateLinkHint(this.graph.getLinkForCell(this.state.cell),
  12649. this.graph.getLinksForState(this.state));
  12650. update();
  12651. this.redrawHandles();
  12652. });
  12653. this.graph.getSelectionModel().addListener(mxEvent.CHANGE, this.changeHandler);
  12654. this.graph.getModel().addListener(mxEvent.CHANGE, this.changeHandler);
  12655. var link = this.graph.getLinkForCell(this.state.cell);
  12656. var links = this.graph.getLinksForState(this.state);
  12657. if (link != null || (links != null && links.length > 0))
  12658. {
  12659. this.updateLinkHint(link, links);
  12660. this.redrawHandles();
  12661. }
  12662. };
  12663. // Disables connection points
  12664. var connectionHandlerInit = mxConnectionHandler.prototype.init;
  12665. mxConnectionHandler.prototype.init = function()
  12666. {
  12667. connectionHandlerInit.apply(this, arguments);
  12668. this.constraintHandler.isEnabled = mxUtils.bind(this, function()
  12669. {
  12670. return this.graph.connectionHandler.isEnabled();
  12671. });
  12672. };
  12673. // Updates special handles
  12674. var vertexHandlerRedrawHandles = mxVertexHandler.prototype.redrawHandles;
  12675. mxVertexHandler.prototype.redrawHandles = function()
  12676. {
  12677. if (this.moveHandles != null)
  12678. {
  12679. for (var i = 0; i < this.moveHandles.length; i++)
  12680. {
  12681. if (this.moveHandles[i] != null)
  12682. {
  12683. this.moveHandles[i].bounds.x = Math.round(this.moveHandles[i].rowState.x +
  12684. this.moveHandles[i].rowState.width - this.moveHandles[i].bounds.width / 2);
  12685. this.moveHandles[i].bounds.y = Math.round(this.moveHandles[i].rowState.y +
  12686. (this.moveHandles[i].rowState.height - this.moveHandles[i].bounds.height) / 2);
  12687. this.moveHandles[i].redraw();
  12688. }
  12689. }
  12690. }
  12691. if (this.cornerHandles != null)
  12692. {
  12693. var inset = this.getSelectionBorderInset();
  12694. var ch = this.cornerHandles;
  12695. var w = ch[0].bounds.width / 2;
  12696. var h = ch[0].bounds.height / 2;
  12697. ch[0].bounds.x = this.state.x - w + inset;
  12698. ch[0].bounds.y = this.state.y - h + inset;
  12699. ch[0].redraw();
  12700. ch[1].bounds.x = ch[0].bounds.x + this.state.width - 2 * inset;
  12701. ch[1].bounds.y = ch[0].bounds.y;
  12702. ch[1].redraw();
  12703. ch[2].bounds.x = ch[0].bounds.x;
  12704. ch[2].bounds.y = this.state.y + this.state.height - 2 * inset;
  12705. ch[2].redraw();
  12706. ch[3].bounds.x = ch[1].bounds.x;
  12707. ch[3].bounds.y = ch[2].bounds.y;
  12708. ch[3].redraw();
  12709. for (var i = 0; i < this.cornerHandles.length; i++)
  12710. {
  12711. this.cornerHandles[i].node.style.display = (this.graph.getSelectionCount() == 1) ? '' : 'none';
  12712. }
  12713. }
  12714. // Shows rotation handle only if one vertex is selected
  12715. if (this.rotationShape != null && this.rotationShape.node != null)
  12716. {
  12717. this.rotationShape.node.style.display = (this.moveHandles == null &&
  12718. (this.graph.getSelectionCount() == 1 && (this.index == null ||
  12719. this.index == mxEvent.ROTATION_HANDLE))) ? '' : 'none';
  12720. }
  12721. vertexHandlerRedrawHandles.apply(this);
  12722. if (this.state != null && this.linkHint != null)
  12723. {
  12724. var c = new mxPoint(this.state.getCenterX(), this.state.getCenterY());
  12725. var tmp = new mxRectangle(this.state.x, this.state.y - 22, this.state.width + 24, this.state.height + 22);
  12726. var bb = mxUtils.getBoundingBox(tmp, this.state.style[mxConstants.STYLE_ROTATION] || '0', c);
  12727. var rs = (bb != null) ? mxUtils.getBoundingBox(this.state,
  12728. this.state.style[mxConstants.STYLE_ROTATION] || '0') : this.state;
  12729. var tb = (this.state.text != null) ? this.state.text.boundingBox : null;
  12730. if (bb == null)
  12731. {
  12732. bb = this.state;
  12733. }
  12734. var b = bb.y + bb.height;
  12735. if (tb != null)
  12736. {
  12737. b = Math.max(b, tb.y + tb.height);
  12738. }
  12739. this.linkHint.style.left = Math.max(0, Math.round(rs.x + (rs.width - this.linkHint.clientWidth) / 2)) + 'px';
  12740. this.linkHint.style.top = Math.round(b + this.verticalOffset / 2 + Editor.hintOffset) + 'px';
  12741. }
  12742. };
  12743. // Destroys special handles
  12744. var vertexHandlerDestroy = mxVertexHandler.prototype.destroy;
  12745. mxVertexHandler.prototype.destroy = function()
  12746. {
  12747. vertexHandlerDestroy.apply(this, arguments);
  12748. this.destroyMoveHandles();
  12749. if (this.cornerHandles != null)
  12750. {
  12751. for (var i = 0; i < this.cornerHandles.length; i++)
  12752. {
  12753. if (this.cornerHandles[i] != null && this.cornerHandles[i].node != null &&
  12754. this.cornerHandles[i].node.parentNode != null)
  12755. {
  12756. this.cornerHandles[i].node.parentNode.removeChild(this.cornerHandles[i].node);
  12757. }
  12758. }
  12759. this.cornerHandles = null;
  12760. }
  12761. if (this.linkHint != null)
  12762. {
  12763. if (this.linkHint.parentNode != null)
  12764. {
  12765. this.linkHint.parentNode.removeChild(this.linkHint);
  12766. }
  12767. this.linkHint = null;
  12768. }
  12769. if (this.changeHandler != null)
  12770. {
  12771. this.graph.getSelectionModel().removeListener(this.changeHandler);
  12772. this.graph.getModel().removeListener(this.changeHandler);
  12773. this.changeHandler = null;
  12774. }
  12775. if (this.editingHandler != null)
  12776. {
  12777. this.graph.removeListener(this.editingHandler);
  12778. this.editingHandler = null;
  12779. }
  12780. };
  12781. var edgeHandlerRedrawHandles = mxEdgeHandler.prototype.redrawHandles;
  12782. mxEdgeHandler.prototype.redrawHandles = function()
  12783. {
  12784. // Workaround for special case where handler
  12785. // is reset before this which leads to a NPE
  12786. if (this.marker != null)
  12787. {
  12788. edgeHandlerRedrawHandles.apply(this);
  12789. if (this.state != null && this.linkHint != null)
  12790. {
  12791. var b = this.state;
  12792. if (this.state.text != null && this.state.text.bounds != null)
  12793. {
  12794. b = new mxRectangle(b.x, b.y, b.width, b.height);
  12795. b.add(this.state.text.bounds);
  12796. }
  12797. this.linkHint.style.left = Math.max(0, Math.round(b.x + (b.width - this.linkHint.clientWidth) / 2)) + 'px';
  12798. this.linkHint.style.top = Math.round(b.y + b.height + Editor.hintOffset) + 'px';
  12799. }
  12800. }
  12801. };
  12802. var edgeHandlerReset = mxEdgeHandler.prototype.reset;
  12803. mxEdgeHandler.prototype.reset = function()
  12804. {
  12805. edgeHandlerReset.apply(this, arguments);
  12806. if (this.linkHint != null)
  12807. {
  12808. this.linkHint.style.visibility = '';
  12809. }
  12810. };
  12811. var edgeHandlerDestroy = mxEdgeHandler.prototype.destroy;
  12812. mxEdgeHandler.prototype.destroy = function()
  12813. {
  12814. edgeHandlerDestroy.apply(this, arguments);
  12815. if (this.linkHint != null)
  12816. {
  12817. this.linkHint.parentNode.removeChild(this.linkHint);
  12818. this.linkHint = null;
  12819. }
  12820. if (this.changeHandler != null)
  12821. {
  12822. this.graph.getModel().removeListener(this.changeHandler);
  12823. this.graph.getSelectionModel().removeListener(this.changeHandler);
  12824. this.changeHandler = null;
  12825. }
  12826. };
  12827. })();
  12828. }