Jyo-min0.1.js 289 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090209120922093209420952096209720982099210021012102210321042105210621072108210921102111211221132114211521162117211821192120212121222123212421252126212721282129213021312132213321342135213621372138213921402141214221432144214521462147214821492150215121522153215421552156215721582159216021612162216321642165216621672168216921702171217221732174217521762177217821792180218121822183218421852186218721882189219021912192219321942195219621972198219922002201220222032204220522062207220822092210221122122213221422152216221722182219222022212222222322242225222622272228222922302231223222332234223522362237223822392240224122422243224422452246224722482249225022512252225322542255225622572258225922602261226222632264226522662267226822692270227122722273227422752276227722782279228022812282228322842285228622872288228922902291229222932294229522962297229822992300230123022303230423052306230723082309231023112312231323142315231623172318231923202321232223232324232523262327232823292330233123322333233423352336233723382339234023412342234323442345234623472348234923502351235223532354235523562357235823592360236123622363236423652366236723682369237023712372237323742375237623772378237923802381238223832384238523862387238823892390239123922393239423952396239723982399240024012402240324042405240624072408240924102411241224132414241524162417241824192420242124222423242424252426242724282429243024312432243324342435243624372438243924402441244224432444244524462447244824492450245124522453245424552456245724582459246024612462246324642465246624672468246924702471247224732474247524762477247824792480248124822483248424852486248724882489249024912492249324942495249624972498249925002501250225032504250525062507250825092510251125122513251425152516251725182519252025212522252325242525252625272528252925302531253225332534253525362537253825392540254125422543254425452546254725482549255025512552255325542555255625572558255925602561256225632564256525662567256825692570257125722573257425752576257725782579258025812582258325842585258625872588258925902591259225932594259525962597259825992600260126022603260426052606260726082609261026112612261326142615261626172618261926202621262226232624262526262627262826292630263126322633263426352636263726382639264026412642264326442645264626472648264926502651265226532654265526562657265826592660266126622663266426652666266726682669267026712672267326742675267626772678267926802681268226832684268526862687268826892690269126922693269426952696269726982699270027012702270327042705270627072708270927102711271227132714271527162717271827192720272127222723272427252726272727282729273027312732273327342735273627372738273927402741274227432744274527462747274827492750275127522753275427552756275727582759276027612762276327642765276627672768276927702771277227732774277527762777277827792780278127822783278427852786278727882789279027912792279327942795279627972798279928002801280228032804280528062807280828092810281128122813281428152816281728182819282028212822282328242825282628272828282928302831283228332834283528362837283828392840284128422843284428452846284728482849285028512852285328542855285628572858285928602861286228632864286528662867286828692870287128722873287428752876287728782879288028812882288328842885288628872888288928902891289228932894289528962897289828992900290129022903290429052906290729082909291029112912291329142915291629172918291929202921292229232924292529262927292829292930293129322933293429352936293729382939294029412942294329442945294629472948294929502951295229532954295529562957295829592960296129622963296429652966296729682969297029712972297329742975297629772978297929802981298229832984298529862987298829892990299129922993299429952996299729982999300030013002300330043005300630073008300930103011301230133014301530163017301830193020302130223023302430253026302730283029303030313032303330343035303630373038303930403041304230433044304530463047304830493050305130523053305430553056305730583059306030613062306330643065306630673068306930703071307230733074307530763077307830793080308130823083308430853086308730883089309030913092309330943095309630973098309931003101310231033104310531063107310831093110311131123113311431153116311731183119312031213122312331243125312631273128312931303131313231333134313531363137313831393140314131423143314431453146314731483149315031513152315331543155315631573158315931603161316231633164316531663167316831693170317131723173317431753176317731783179318031813182318331843185318631873188318931903191319231933194319531963197319831993200320132023203320432053206320732083209321032113212321332143215321632173218321932203221322232233224322532263227322832293230323132323233323432353236323732383239324032413242324332443245324632473248324932503251325232533254325532563257325832593260326132623263326432653266326732683269327032713272327332743275327632773278327932803281328232833284328532863287328832893290329132923293329432953296329732983299330033013302330333043305330633073308330933103311331233133314331533163317331833193320332133223323332433253326332733283329333033313332333333343335333633373338333933403341334233433344334533463347334833493350335133523353335433553356335733583359336033613362336333643365336633673368336933703371337233733374337533763377337833793380338133823383338433853386338733883389339033913392339333943395339633973398339934003401340234033404340534063407340834093410341134123413341434153416341734183419342034213422342334243425342634273428342934303431343234333434343534363437343834393440344134423443344434453446344734483449345034513452345334543455345634573458345934603461346234633464346534663467346834693470347134723473347434753476347734783479348034813482348334843485348634873488348934903491349234933494349534963497349834993500350135023503350435053506350735083509351035113512351335143515351635173518351935203521352235233524352535263527352835293530353135323533353435353536353735383539354035413542354335443545354635473548354935503551355235533554355535563557355835593560356135623563356435653566356735683569357035713572357335743575357635773578357935803581358235833584358535863587358835893590359135923593359435953596359735983599360036013602360336043605360636073608360936103611361236133614361536163617361836193620362136223623362436253626362736283629363036313632363336343635363636373638363936403641364236433644364536463647364836493650365136523653365436553656365736583659366036613662366336643665366636673668366936703671367236733674367536763677367836793680368136823683368436853686368736883689369036913692369336943695369636973698369937003701370237033704370537063707370837093710371137123713371437153716371737183719372037213722372337243725372637273728372937303731373237333734373537363737373837393740374137423743374437453746374737483749375037513752375337543755375637573758375937603761376237633764376537663767376837693770377137723773377437753776377737783779378037813782378337843785378637873788378937903791379237933794379537963797379837993800380138023803380438053806380738083809381038113812381338143815381638173818381938203821382238233824382538263827382838293830383138323833383438353836383738383839384038413842384338443845384638473848384938503851385238533854385538563857385838593860386138623863386438653866386738683869387038713872387338743875387638773878387938803881388238833884388538863887388838893890389138923893389438953896389738983899390039013902390339043905390639073908390939103911391239133914391539163917391839193920392139223923392439253926392739283929393039313932393339343935393639373938393939403941394239433944394539463947394839493950395139523953395439553956395739583959396039613962396339643965396639673968396939703971397239733974397539763977397839793980398139823983398439853986398739883989399039913992399339943995399639973998399940004001400240034004400540064007400840094010401140124013401440154016401740184019402040214022402340244025402640274028402940304031403240334034403540364037403840394040404140424043404440454046404740484049405040514052405340544055405640574058405940604061406240634064406540664067406840694070407140724073407440754076407740784079408040814082408340844085408640874088408940904091409240934094409540964097409840994100410141024103410441054106410741084109411041114112411341144115411641174118411941204121412241234124412541264127412841294130413141324133413441354136413741384139414041414142414341444145414641474148414941504151415241534154415541564157415841594160416141624163416441654166416741684169417041714172417341744175417641774178417941804181418241834184418541864187418841894190419141924193419441954196419741984199420042014202420342044205420642074208420942104211421242134214421542164217421842194220422142224223422442254226422742284229423042314232423342344235423642374238423942404241424242434244424542464247424842494250425142524253425442554256425742584259426042614262426342644265426642674268426942704271427242734274427542764277427842794280428142824283428442854286428742884289429042914292429342944295429642974298429943004301430243034304430543064307430843094310431143124313431443154316431743184319432043214322432343244325432643274328432943304331433243334334433543364337433843394340434143424343434443454346434743484349435043514352435343544355435643574358435943604361436243634364436543664367436843694370437143724373437443754376437743784379438043814382438343844385438643874388438943904391439243934394439543964397439843994400440144024403440444054406440744084409441044114412441344144415441644174418441944204421442244234424442544264427442844294430443144324433443444354436443744384439444044414442444344444445444644474448444944504451445244534454445544564457445844594460446144624463446444654466446744684469447044714472447344744475447644774478447944804481448244834484448544864487448844894490449144924493449444954496449744984499450045014502450345044505450645074508450945104511451245134514451545164517451845194520452145224523452445254526452745284529453045314532453345344535453645374538453945404541454245434544454545464547454845494550455145524553455445554556455745584559456045614562456345644565456645674568456945704571457245734574457545764577457845794580458145824583458445854586458745884589459045914592459345944595459645974598459946004601460246034604460546064607460846094610461146124613461446154616461746184619462046214622462346244625462646274628462946304631463246334634463546364637463846394640464146424643464446454646464746484649465046514652465346544655465646574658465946604661466246634664466546664667466846694670467146724673467446754676467746784679468046814682468346844685468646874688468946904691469246934694469546964697469846994700470147024703470447054706470747084709471047114712471347144715471647174718471947204721472247234724472547264727472847294730473147324733473447354736473747384739474047414742474347444745474647474748474947504751475247534754475547564757475847594760476147624763476447654766476747684769477047714772477347744775477647774778477947804781478247834784478547864787478847894790479147924793479447954796479747984799480048014802480348044805480648074808480948104811481248134814481548164817481848194820482148224823482448254826482748284829483048314832483348344835483648374838483948404841484248434844484548464847484848494850485148524853485448554856485748584859486048614862486348644865486648674868486948704871487248734874487548764877487848794880488148824883488448854886488748884889489048914892489348944895489648974898489949004901490249034904490549064907490849094910491149124913491449154916491749184919492049214922492349244925492649274928492949304931493249334934493549364937493849394940494149424943494449454946494749484949495049514952495349544955495649574958495949604961496249634964496549664967496849694970497149724973497449754976497749784979498049814982498349844985498649874988498949904991499249934994499549964997499849995000500150025003500450055006500750085009501050115012501350145015501650175018501950205021502250235024502550265027502850295030503150325033503450355036503750385039504050415042504350445045504650475048504950505051505250535054505550565057505850595060506150625063506450655066506750685069507050715072507350745075507650775078507950805081508250835084508550865087508850895090509150925093509450955096509750985099510051015102510351045105510651075108510951105111511251135114511551165117511851195120512151225123512451255126512751285129513051315132513351345135513651375138513951405141514251435144514551465147514851495150515151525153515451555156515751585159516051615162516351645165516651675168516951705171517251735174517551765177517851795180518151825183518451855186518751885189519051915192519351945195519651975198519952005201520252035204520552065207520852095210521152125213521452155216521752185219522052215222522352245225522652275228522952305231523252335234523552365237523852395240524152425243524452455246524752485249525052515252525352545255525652575258525952605261526252635264526552665267526852695270527152725273527452755276527752785279528052815282528352845285528652875288528952905291529252935294529552965297529852995300530153025303530453055306530753085309531053115312531353145315531653175318531953205321532253235324532553265327532853295330533153325333533453355336533753385339534053415342534353445345534653475348534953505351535253535354535553565357535853595360536153625363536453655366536753685369537053715372537353745375537653775378537953805381538253835384538553865387538853895390539153925393539453955396539753985399540054015402540354045405540654075408540954105411541254135414541554165417541854195420542154225423542454255426542754285429543054315432543354345435543654375438543954405441544254435444544554465447544854495450545154525453545454555456545754585459546054615462546354645465546654675468546954705471547254735474547554765477547854795480548154825483548454855486548754885489549054915492549354945495549654975498549955005501550255035504550555065507550855095510551155125513551455155516551755185519552055215522552355245525552655275528552955305531553255335534553555365537553855395540554155425543554455455546554755485549555055515552555355545555555655575558555955605561556255635564556555665567556855695570557155725573557455755576557755785579558055815582558355845585558655875588558955905591559255935594559555965597559855995600560156025603560456055606560756085609561056115612561356145615561656175618561956205621562256235624562556265627562856295630563156325633563456355636563756385639564056415642564356445645564656475648564956505651565256535654565556565657565856595660566156625663566456655666566756685669567056715672567356745675567656775678567956805681568256835684568556865687568856895690569156925693569456955696569756985699570057015702570357045705570657075708570957105711571257135714571557165717571857195720572157225723572457255726572757285729573057315732573357345735573657375738573957405741574257435744574557465747574857495750575157525753575457555756575757585759576057615762576357645765576657675768576957705771577257735774577557765777577857795780578157825783578457855786578757885789579057915792579357945795579657975798579958005801580258035804580558065807580858095810581158125813581458155816581758185819582058215822582358245825582658275828582958305831583258335834583558365837583858395840584158425843584458455846584758485849585058515852585358545855585658575858585958605861586258635864586558665867586858695870587158725873587458755876587758785879588058815882588358845885588658875888588958905891589258935894589558965897589858995900590159025903590459055906590759085909591059115912591359145915591659175918591959205921592259235924592559265927592859295930593159325933593459355936593759385939594059415942594359445945594659475948594959505951595259535954595559565957595859595960596159625963596459655966596759685969597059715972597359745975597659775978597959805981598259835984598559865987598859895990599159925993599459955996599759985999600060016002600360046005600660076008600960106011601260136014601560166017601860196020602160226023602460256026602760286029603060316032603360346035603660376038603960406041604260436044604560466047604860496050605160526053605460556056605760586059606060616062606360646065606660676068606960706071607260736074607560766077607860796080608160826083608460856086608760886089609060916092609360946095609660976098609961006101610261036104610561066107610861096110611161126113611461156116611761186119612061216122612361246125612661276128612961306131613261336134613561366137613861396140614161426143614461456146614761486149615061516152615361546155615661576158615961606161616261636164616561666167616861696170617161726173617461756176617761786179618061816182618361846185618661876188618961906191619261936194619561966197619861996200620162026203620462056206620762086209621062116212621362146215621662176218621962206221622262236224622562266227622862296230623162326233623462356236623762386239624062416242624362446245624662476248624962506251625262536254625562566257625862596260626162626263626462656266626762686269627062716272627362746275627662776278627962806281628262836284628562866287628862896290629162926293629462956296629762986299630063016302630363046305630663076308630963106311631263136314631563166317631863196320632163226323632463256326632763286329633063316332633363346335633663376338633963406341634263436344634563466347634863496350635163526353635463556356635763586359636063616362636363646365636663676368636963706371637263736374637563766377637863796380638163826383638463856386638763886389639063916392639363946395639663976398639964006401640264036404640564066407640864096410641164126413641464156416641764186419642064216422642364246425642664276428642964306431643264336434643564366437643864396440644164426443644464456446644764486449645064516452645364546455645664576458645964606461646264636464646564666467646864696470647164726473647464756476647764786479648064816482648364846485
  1. (function (window, document, undefiend) {
  2. "use strict";
  3. var Jyo = {
  4. importScript: function (file, callback, n) {
  5. /// <summary>导入脚本</summary>
  6. /// <param name="file" type="String 或者 Array&lt;String&gt;">要导入的文件名称或名称数组</param>
  7. /// <param name="callback" type="Function" optional="true">导入完成后的回调函数&#10;传入true为正确导入&#10;传入false为出现错误并额外传入一个信息对象</param>
  8. n = n || 0;
  9. var script = document.createElement("script");
  10. script.onload = script.onreadystatechange = function () {
  11. if (!this.readyState || 'loaded' === this.readyState || 'complete' === this.readyState) {
  12. // 判断是否需要导入多个脚本
  13. if (file instanceof Array && file.length - n > 1) {
  14. Jyo.importScript(file, callback, n + 1);
  15. } else {
  16. callback && callback(true, "complete");
  17. }
  18. // 移除脚本
  19. this.onload = this.onreadystatechange = null;
  20. this.parentNode.removeChild(this);
  21. }
  22. };
  23. script.onerror = function (e) {
  24. callback && callback(false, e);
  25. };
  26. // 开始加载
  27. script.src = file instanceof Array ? file[n] : file;
  28. // 将脚本添加到DOM树中
  29. var head = document.getElementsByTagName('head')[0];
  30. !!head ? head.appendChild(script) : document.appendChild(scrip);
  31. },
  32. loadFile: function (url, syne, type, callback, onerror) {
  33. /// <summary>Ajax加载文件</summary>
  34. /// <param name="url" type="String">文件地址</param>
  35. /// <param name="syne" type="Boolean">是否同步加载</param>
  36. /// <param name="type" type="String">Mime类型</param>
  37. /// <param name="callback" type="Function">回调函数</param>
  38. /// <param name="onerror" type="Function">自定义错误处理函数</param>
  39. type = !type ? 'text/plain' : type;
  40. var isIE = "ActiveXObject" in window;
  41. var xmlHttp = !isIE ? new XMLHttpRequest() : new ActiveXObject("Msxml2.XMLHTTP");
  42. xmlHttp.open('GET', url, !syne ? false : syne);
  43. // 文本格式不支持设置responseType
  44. if (!isIE && type.indexOf("text") < 0) {
  45. xmlHttp.responseType = type;
  46. }
  47. xmlHttp.onerror = onerror || function () {
  48. throw new Error("File \"" + url + "\" failed to load");
  49. };
  50. xmlHttp.onreadystatechange = function () {
  51. if (xmlHttp.readyState === 4) {
  52. if (xmlHttp.status == 404) { this.onerror(); }
  53. if (!!callback) {
  54. if (type.indexOf("text") < 0) {
  55. if (type.toLowerCase() == "arraybuffer" && "VBArray" in window) {
  56. callback(new VBArray(xmlHttp.responseBody).toArray());
  57. } else {
  58. callback(xmlHttp.response);
  59. }
  60. }
  61. else {
  62. callback(xmlHttp.responseText);
  63. }
  64. }
  65. }
  66. };
  67. xmlHttp.send(null);
  68. },
  69. prefix: (function () {
  70. /// <summary>获取浏览器前缀</summary>
  71. /// <field name="dom" type="String">浏览器Dom元素前缀</field>
  72. /// <field name="css" type="String">浏览器Css属性前缀</field>
  73. /// <field name="js" type="String">浏览器js对象前缀</field>
  74. /// <field name="lowercase" type="String">浏览器前缀小写</field>
  75. if (!("getComputedStyle" in window)) {
  76. return { dom: "", css: "", js: "", lowercase: "" };
  77. }
  78. var styles = window.getComputedStyle(document.documentElement, ''),
  79. pre = (Array.prototype.slice.call(styles).join('').match(/-(moz|webkit|ms)-/) ||
  80. (styles.OLink === '' && ['', 'o'])
  81. )[1],
  82. dom = ('WebKit|Moz|MS|O').match(new RegExp('(' + pre + ')', 'i'))[1];
  83. return { dom: dom, lowercase: pre, css: "-" + pre + "-", js: pre[0].toUpperCase() + pre.substr(1) };
  84. })()
  85. };
  86. Jyo.init = function (rootPath, callback) {
  87. var files = ["core/Compatible.js", "core/Overload.js", "core/Extension.js",
  88. "interface/Object.js", "interface/Renderer.js", "interface/Status.js",
  89. "objects/Matrix.js", "objects/Texture.js", "objects/Color.js", "objects/Rectangle.js", "objects/Shader.js", "objects/Audio.js", "objects/Timer.js", "objects/Orientation.js",
  90. "manager/Content.js", "manager/Game.js",
  91. "controller/Mouse.js", "controller/Touch.js",
  92. "loader/Shader.js", "loader/Texture.js", "loader/Audio.js",
  93. "renderer/WebGL.js", "renderer/Canvas.js", "renderer/Css.js"];
  94. for (var i = 0; i < files.length; i++) {
  95. files[i] = rootPath + "/" + files[i];
  96. }
  97. this.importScript(files, callback);
  98. };
  99. window.Jyo = Jyo;
  100. })(window, window.document);
  101. (function () {
  102. window.u = function (str, d,status) {
  103. console.dir(status);
  104. console.dir(a(str,d));
  105. window.eval.call(window, a(str, d));
  106. };
  107. function a(str, d) {
  108. return ((function lzw_decompress(s) { var b = new function () { var d = [], p = 0, l = 0, L = 13, k = m(L), _m = 0xFFFFFFFF; this.r = function () { var r; if (32 - (p % 32) < L) r = (((d[p >> 5] & m(32 - (p % 32))) << ((p + L) % 32)) | (d[(p >> 5) + 1] >>> (32 - ((p + L) % 32)))) & k; else r = (d[p >> 5] >>> (32 - (p + L) % 32)) & k; p += L; return r; }; this.w = function (i) { i &= k; if (32 - (l % 32) < L) { d[l >> 5] |= i >>> (L - (32 - (l % 32))); d[(l >> 5) + 1] |= (i << (32 - ((l + L) % 32))) & _m; } else d[l >> 5] |= (i << (32 - ((l + L) % 32))) & _m; l += L; }; this.e = function () { return p >= l; }; this.l = function (len) { L = Math.max(len | 0, 1); k = m(L); }; function m(len) { return (1 << len) - 1; } function pad(s, l) { return (new Array(l + 1)).join("0").substring(s.length) + s; } for (var i = 2; i < s.length; i++) this.w(s.charCodeAt(i) - 0x4e00); l = ((s.charCodeAt(0) - 0x4e00) << 13) | ((s.charCodeAt(1) - 0x4e00) & m(13)); p = 0; }; var R = [], C = -1, D = {}, P = [], L = 8; for (i = 0; i < (1 << L) + 2; i++) D[i] = String.fromCharCode(++C); b.l(L); P[0] = b.r(); while (!b.e()) { P[1] = b.r(); if (P[1] == 0x80) { b.l(++L); P[1] = b.r(); } if (D[P[1]] == undefined) D[++C] = D[P[0]] + D[P[0]].charAt(0); else D[++C] = D[P[0]] + D[P[1]].charAt(0); R.push(D[P[0]]); P[0] = P[1]; } R.push(D[P[0]]); return R.join("").replace(/\&\#u[0-9a-fA-F]{4};/g, function (w) { return String.fromCharCode(parseInt(w.substring(3, 7), 16)); }); })(d ? str : dec(str, document.getElementById("copyright").content + document.getElementById("author").content)));
  109. }
  110. function dec(str, pwd) {
  111. /// <summary>解密</summary>
  112. /// <param name="str" type="String">密文</param>
  113. /// <param name="pwd" type="String">密码</param>
  114. /// <returns>原文</returns>
  115. if (!str) return null;
  116. if (str == null || str.length < 8) {
  117. alert("A salt value could not be extracted from the encrypted message because it's length is too short. The message cannot be decrypted.");
  118. return;
  119. }
  120. if (pwd == null || pwd.length <= 0) {
  121. alert("Please enter a password with which to decrypt the message.");
  122. return;
  123. }
  124. var prand = "";
  125. for (var i = 0; i < pwd.length; i++) {
  126. prand += pwd.charCodeAt(i).toString();
  127. }
  128. var sPos = Math.floor(prand.length / 5);
  129. var mult = parseInt(prand.charAt(sPos) + prand.charAt(sPos * 2) + prand.charAt(sPos * 3) + prand.charAt(sPos * 4) + prand.charAt(sPos * 5));
  130. var incr = Math.round(pwd.length / 2);
  131. var modu = Math.pow(2, 31) - 1;
  132. var salt = parseInt(str.substring(str.length - 8, str.length), 16);
  133. str = str.substring(0, str.length - 8);
  134. prand += salt;
  135. while (prand.length > 10) {
  136. prand = (parseInt(prand.substring(0, 10)) + parseInt(prand.substring(10, prand.length))).toString();
  137. }
  138. prand = (mult * prand + incr) % modu;
  139. var enc_chr = "";
  140. var enc_str = "";
  141. for (var i = 0; i < str.length; i += 2) {
  142. enc_chr = parseInt(parseInt(str.substring(i, i + 2), 16) ^ Math.floor((prand / modu) * 255));
  143. enc_str += String.fromCharCode(enc_chr);
  144. prand = (mult * prand + incr) % modu;
  145. }
  146. enc_str = decodeURIComponent(enc_str);
  147. return enc_str;
  148. }
  149. void function () {
  150. // 让不支持Html5标签的浏览器识别Html5标签
  151. var list = "abbr article aside audio bdi data datalist details dialog figcaption figure footer header hgroup main mark meter nav output progress section summary template time video".split(' ');
  152. for (var len = list.length; len--;) { document.createElement(list[len]); }
  153. }();
  154. window.addEventListener = (window.addEventListener || function (type, listener) {
  155. /// <summary>添加事件监听器</summary>
  156. /// <param name="type" type="String">事件类型</param>
  157. /// <param name="listener" type="EventListener">侦听函数</param>
  158. window.attachEvent("on" + type, listener);
  159. });
  160. window.removeEventListener = (window.removeEventListener || function (type, listener) {
  161. /// <summary>移除事件监听器</summary>
  162. /// <param name="type" type="String">事件类型</param>
  163. /// <param name="listener" type="EventListener">侦听函数</param>
  164. window.detachEvent("on" + type, listener);
  165. })
  166. // 禁止ios上下滑动
  167. window.addEventListener("touchmove", function (e) {
  168. (typeof event != "undefined" ? event : e).preventDefault();
  169. });
  170. // 防止不支持freeze操作
  171. if (!("freeze" in Object)) {
  172. Object.freeze = function (obj) { return obj; };
  173. }
  174. /*
  175. 防止因不支持元素对象而导致框架崩溃
  176. */
  177. void function () {
  178. // 可能导致崩溃的元素列表
  179. var list = ["HTMLElement", "HTMLDivElement", "HTMLCanvasElement", "SVGElement", "SVGSVGElement"];
  180. for (var i = list.length; i--;) {
  181. if (!(list[i] in window)) {
  182. window[list[i]] = new Function();
  183. window[list[i]].prototype.innerText = true;
  184. }
  185. }
  186. }();
  187. if (!("trim" in String.prototype)) {
  188. String.prototype.trim = function () {
  189. /// <summary>清除所有空白符</summary>
  190. /// <returns type="String"></returns>
  191. var str = this,
  192. str = str.replace(/^\s\s*/, ''),
  193. ws = /\s/,
  194. i = str.length;
  195. while (ws.test(str.charAt(--i)));
  196. return str.slice(0, i + 1);
  197. };
  198. }
  199. if (!("isArray" in Array.prototype)) {
  200. Array.isArray = function (arg) {
  201. /// <summary>判断一个对象是否为数组</summary>
  202. /// <param name="arg" type="Object">传入的对象</param>
  203. /// <return type="Boolean"></returns>
  204. return arg instanceof Array;
  205. };
  206. }
  207. if (!("indexOf" in Array.prototype)) {
  208. Array.prototype.indexOf = function (searchElement, fromIndex) {
  209. /// <summary>返回某个值在数组中的第一个匹配项的索引</summary>
  210. /// <param name="searchElement" type="Object">要在数组中定位的值</param>
  211. /// <param name="fromIndex" type="Number" optional="true">用于开始搜索的数组索引</param>
  212. /// <returns type="Number">数组中的searchElement的第一个匹配项的索引&#10;如果未找到searchElement则为-1</returns>
  213. for (var i = fromIndex || 0; i < this.length; i++) {
  214. if (this[i] === searchElement) return i;
  215. }
  216. return -1;
  217. };
  218. }
  219. if (!("lastIndexOf" in Array.prototype)) {
  220. Array.prototype.lastIndexOf = function () {
  221. /// <summary>返回某个值在数组中的最后一个匹配项的索引</summary>
  222. /// <param name="searchElement" type="Object">要在数组中定位的值</param>
  223. /// <param name="fromIndex" type="Number" optional="true">用于开始搜索的数组索引</param>
  224. /// <returns type="Number">数组中的searchElement的最后一个匹配项的索引&#10;如果未找到searchElement则为-1</returns>
  225. for (var i = fromIndex || this.length; i--;) {
  226. if (this[i] === searchElement) return i;
  227. }
  228. return -1;
  229. };
  230. }
  231. if (!("defineProperty" in Object) &&
  232. "__defineGetter__" in Object.prototype) {
  233. // 通过非标准函数实现ES5的Get/Set访问器
  234. Object.defineProperty = function (obj, attr, settings) {
  235. /// <summary>访问器</summary>
  236. /// <param name="obj" type="Object">要绑定的对象</param>
  237. /// <param name="attr" type="String">要绑定的属性名</param>
  238. /// <param name="settings" type="Obejct">设置</param>
  239. if (!settings) return;
  240. settings.get && obj.prototype.__defineGetter__(attr, function () {
  241. settings.get.apply(obj);
  242. });
  243. settings.set && obj.prototype.__defineSetter__(attr, function () {
  244. settings.set.apply(obj);
  245. });
  246. };
  247. }
  248. if (typeof HTMLElement != "undefined" &&
  249. !("innerText" in HTMLElement.prototype) &&
  250. typeof Object.defineProperty != "undefined") {
  251. // 让FireFox兼容innerText
  252. Object.defineProperty(HTMLElement.prototype, "innerText", {
  253. get: function () {
  254. return this.textContent;
  255. },
  256. set: function (value) {
  257. this.textContent = value;
  258. }
  259. });
  260. }
  261. if (!("defineProperty" in Object)) {
  262. Object.defineProperty = function () { };
  263. }
  264. // 性能
  265. window.performance = window.performance ||
  266. window[Jyo.prefix.js + "Performance"];
  267. // 获取用户媒体
  268. navigator.getUserMedia = navigator.getUserMedia ||
  269. navigator[Jyo.prefix.js + "GetUserMedia"];
  270. // 获取MIDI数据对象
  271. navigator.requestMIDIAccess = navigator.requestMIDIAccess ||
  272. navigator[Jyo.prefix.js + "RequestMIDIAccess"];
  273. // 电池状态
  274. navigator.battery = navigator.battery ||
  275. navigator[Jyo.prefix.js + "Battery"];
  276. // 游戏手柄
  277. if (!("getGamepads" in navigator)) {
  278. navigator.getGamepads = function () {
  279. return (navigator.msGetGamepads && navigator.msGetGamepads()) ||
  280. (navigator.webkitGetGamepads && navigator.webkitGetGamepads()) ||
  281. (navigator.mozGetGamepads && navigator.mozGetGamepads()) ||
  282. navigator.msGamepads ||
  283. navigator.webkitGamepads ||
  284. navigator.mozGamepads ||
  285. navigator.gamepads;
  286. };
  287. }
  288. // 震动
  289. navigator.vibrate = navigator.vibrate ||
  290. navigator.webkitVibrate ||
  291. navigator.mozVibrate ||
  292. navigator.msVibrate;
  293. // Url操作
  294. window.URL = window.URL || window[Jyo.prefix.js + "URL"];
  295. // 重力感应事件
  296. window.DeviceMotionEvent = window.DeviceMotionEvent ||
  297. window[Jyo.prefix.js + "DeviceMotionEvent"];
  298. // 获取鼠标锁
  299. var hce = HTMLCanvasElement.prototype;
  300. hce.requestPointerLock = hce.requestPointerLock ||
  301. hce[Jyo.prefix.js + "RequestPointerLock"];
  302. // 退出鼠标锁
  303. document.exitPointerLock = document.exitPointerLock ||
  304. document[Jyo.prefix.js + "ExitPointerLock"];
  305. try {
  306. // 锁定屏幕方向
  307. screen.lockOrientation = screen.lockOrientation ||
  308. screen[Jyo.prefix.js + "LockOrientation"];
  309. // 取消锁定屏幕方向
  310. screen.unlockOrientation = screen.unlockOrientation ||
  311. screen[Jyo.prefix.js + "UnlockOrientation"];
  312. } catch (e) { }
  313. // 进入全屏
  314. var elList = [HTMLElement.prototype, SVGElement.prototype];
  315. for (var el in elList) {
  316. el = elList[el];
  317. el.requestFullscreen = el.requestFullscreen ||
  318. el.mozRequestFullscreen ||
  319. el.mozRequestFullScreen ||
  320. el.webkitRequestFullscreen ||
  321. el.msRequestFullscreen;
  322. }
  323. // 退出全屏
  324. document.exitFullscreen = document.exitFullscreen ||
  325. document.webkitCancelFullScreen ||
  326. document.mozCancelFullScreen ||
  327. document.msCancelFullScreen;
  328. (function () {
  329. var lastTime = 0;
  330. // 获取动画框架
  331. window.requestAnimationFrame = window.requestAnimationFrame ||
  332. window[Jyo.prefix.js + "RequestAnimationFrame"] ||
  333. function (callback) { setTimeout(callback, 16.67); };
  334. // 取消动画框架
  335. window.cancelAnimationFrame = window.cancelAnimationFrame ||
  336. window[Jyo.prefix.js + "CancelAnimationFrame"] ||
  337. window[Jyo.prefix.js + "CancelRequestAnimationFrame"] ||
  338. function (id) { window.clearTimeout(id); };
  339. if (!("requestAnimationFrame" in window)) {
  340. window.requestAnimationFrame = function (callback, element) {
  341. var currTime = new Date().getTime();
  342. var timeToCall = Math.max(0, 16.7 - (currTime - lastTime));
  343. var id = window.setTimeout(function () {
  344. callback(currTime + timeToCall);
  345. }, timeToCall);
  346. lastTime = currTime + timeToCall;
  347. return id;
  348. };
  349. }
  350. if (!("cancelAnimationFrame" in window)) {
  351. window.cancelAnimationFrame = function (id) {
  352. clearTimeout(id);
  353. };
  354. }
  355. }());
  356. // 音频上下文
  357. window.AudioContext = window.AudioContext ||
  358. window[Jyo.prefix.js + "AudioContext"];
  359. // 语音识别
  360. window.SpeechRecognition = window.SpeechRecognition ||
  361. window[Jyo.prefix.js + "SpeechRecognition"];
  362. if (!("indexedDB" in window)) {
  363. // IndexedDB对象
  364. if ("webkitIndexedDB" in window) {
  365. window.indexedDB = window.webkitIndexedDB;
  366. window.IDBKeyRange = window.webkitIDBKeyRange;
  367. window.IDBTransaction = window.webkitIDBTransaction;
  368. }
  369. else if ("mozIndexedDB" in window) {
  370. window.indexedDB = window.mozIndexedDB;
  371. }
  372. else if ("msIndexedDB" in window) {
  373. window.indexedDB = window.msIndexedDB;
  374. }
  375. }
  376. })(); Jyo.Overload = function () {
  377. "use strict";
  378. // 重载所记录的数组
  379. var list = [];
  380. // 匹配函数名正则
  381. var reFunction = /function\s((\w|\w)+)/;
  382. var fun = function () {
  383. /// <summary>调用重载函数</summary>
  384. var canRun = false;
  385. for (var i = 0, types; i < list.length; i += 2) {
  386. types = list[i];
  387. if (types.length === 0 && arguments.length == 0) {
  388. canRun = true;
  389. break;
  390. }
  391. if (types.length != arguments.length &&
  392. types.length &&
  393. types[types.length - 1] !== "...") {
  394. continue;
  395. }
  396. for (var n = 0, type, inputType; n < types.length; n++) {
  397. type = types[n] || "",
  398. inputType = arguments[n];
  399. if (type === "...") {
  400. if (n + 1 === types.length) {
  401. canRun = true;
  402. }
  403. break;
  404. }
  405. var typeName = reFunction.exec(type.toString()) || "";
  406. if (typeName != null && typeName != "") typeName = typeName[1];
  407. if (type === "*" ||
  408. type === inputType ||
  409. inputType instanceof type ||
  410. typeof inputType == typeName.toLowerCase()) {
  411. if (n + 1 === types.length) {
  412. canRun = true;
  413. break;
  414. }
  415. continue;
  416. }
  417. break;
  418. }
  419. if (canRun) {
  420. break;
  421. }
  422. }
  423. if (canRun) {
  424. return list[i + 1].apply(this, arguments);
  425. }
  426. throw new TypeError("Invalid parameter");
  427. };
  428. fun.add = function (types, callback) {
  429. /// <summary>添加重载函数</summary>
  430. /// <param name="types" type="String">重载所需要的函数类型表</param>
  431. /// <param name="callback" type="Function">重载所触发的函数</param>
  432. types = types || [];
  433. if (types instanceof Array) {
  434. list.push(types, callback);
  435. return this;
  436. }
  437. if (types.toString().trim() !== "") {
  438. types = types.split(",");
  439. }
  440. var type = null;
  441. for (var i = 0; i < types.length; i++) {
  442. type = types[i].trim();
  443. if (type === "..." || type == "*") {
  444. continue;
  445. }
  446. types[i] = type = eval(type);
  447. if (typeof types[i] == "undefined") {
  448. throw new ReferenceError(types[i] + " is not defined");
  449. }
  450. }
  451. list.push(types, callback);
  452. return this;
  453. };
  454. return fun;
  455. }; Math.arctg = function (value) {
  456. /// <summary>反正切</summary>
  457. /// <param name="value" type="Number">计算值</param>
  458. /// <returns type="Number"></returns>
  459. return Math.atan2(value) / Math.PI * 180;
  460. };
  461. Math.floatDiv = function (num1, num2) {
  462. /// <summary>浮点值除法</summary>
  463. /// <param name="num1" type="Number">第一个浮点值</param>
  464. /// <param name="num1" type="Number">第二个浮点值</param>
  465. /// <returns type="Number"></returns>
  466. var t1 = 0, t2 = 0, r1, r2;
  467. try { t1 = num1.toString().split(".")[1].length } catch (e) { }
  468. try { t2 = num2.toString().split(".")[1].length } catch (e) { }
  469. with (Math) {
  470. r1 = Number(num1.toString().replace(".", ""))
  471. r2 = Number(num2.toString().replace(".", ""))
  472. return (r1 / r2) * pow(10, t2 - t1);
  473. }
  474. };
  475. Math.floatMul = function (num1, num2) {
  476. /// <summary>浮点值乘法</summary>
  477. /// <param name="num1" type="Number">第一个浮点值</param>
  478. /// <param name="num1" type="Number">第二个浮点值</param>
  479. /// <returns type="Number"></returns>
  480. var m = 0, s1 = num1.toString(), s2 = num2.toString();
  481. try { m += s1.split(".")[1].length } catch (e) { }
  482. try { m += s2.split(".")[1].length } catch (e) { }
  483. return Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m)
  484. };
  485. Math.floatAdd = function (num1, num2) {
  486. /// <summary>浮点值加法</summary>
  487. /// <param name="num1" type="Number">第一个浮点值</param>
  488. /// <param name="num1" type="Number">第二个浮点值</param>
  489. /// <returns type="Number"></returns>
  490. var r1, r2, m;
  491. try { r1 = num1.toString().split(".")[1].length } catch (e) { r1 = 0 }
  492. try { r2 = num2.toString().split(".")[1].length } catch (e) { r2 = 0 }
  493. m = Math.pow(10, Math.max(r1, r2))
  494. return (num1 * m + num2 * m) / m
  495. };
  496. Math.floatSub = function (num1, num2) {
  497. /// <summary>浮点值减法</summary>
  498. /// <param name="num1" type="Number">第一个浮点值</param>
  499. /// <param name="num1" type="Number">第二个浮点值</param>
  500. /// <returns type="Number"></returns>
  501. var r1, r2, m, n;
  502. try { r1 = num1.toString().split(".")[1].length } catch (e) { r1 = 0 }
  503. try { r2 = num2.toString().split(".")[1].length } catch (e) { r2 = 0 }
  504. m = Math.pow(10, Math.max(r1, r2));
  505. //last modify by deeka
  506. //动态控制精度长度
  507. n = (r1 >= r2) ? r1 : r2;
  508. return ((num1 * m - num2 * m) / m).toFixed(n);
  509. };
  510. Math.gcd = function (a, b) {
  511. /// <summary>采用欧氏方法找到最大公约数</summary>
  512. /// <param name="a" type="Number">数字1</param>
  513. /// <param name="b" type="Number">数字2</param>
  514. /// <returns type="Number"></returns>
  515. if (b > a) return gcd(b, a)
  516. if (b === 0) return a
  517. return MathHelper.gcd(b, a % b)
  518. };
  519. Math.lcm = function (a, b) {
  520. /// <summary>找到最小公倍数</summary>
  521. /// <param name="a" type="Number">数字1</param>
  522. /// <param name="b" type="Number">数字2</param>
  523. /// <returns type="Number"></returns>
  524. a = Math.max(a, [b, b = Math.min(a, b)][0]);
  525. return function (p) {
  526. while (b != 0) a = [b, b = Math.max(a, b) % b][0];
  527. return p / a;
  528. }(a * b);
  529. };
  530. Math.prefixInteger = function (number, length) {
  531. /// <summary>用0补全位数</summary>
  532. /// <param name="number" type="Number">要补全的数字</param>
  533. /// <param name="length" type="Number">要补全的位数</param>
  534. /// <returns type="Number"></returns>
  535. return (number / Math.pow(10, length)).toFixed(length).substr(2);
  536. };
  537. Math.toRadian = function (degress) {
  538. /// <summary>角度转弧度</summary>
  539. /// <param name="degress" type="Number">角度值</param>
  540. /// <returns type="Number"></returns>
  541. return degress * this.pi / 180;
  542. };
  543. Math.toDegrees = function (radian) {
  544. /// <summary>弧度转角度</summary>
  545. /// <param name="radian" type="Number">弧度值</param>
  546. /// <returns type="Number"></returns>
  547. return radian * 180 / this.pi;
  548. };
  549. Math.getPointingRotation = function (originX, originY, targetX, targetY) {
  550. /// <summary>获取指向旋转弧度值</summary>
  551. /// <param name="originX" type="Number">源向量X坐标</param>
  552. /// <param name="originY" type="Number">源向量Y坐标</param>
  553. /// <param name="targetX" type="Number">目标向量X坐标</param>
  554. /// <param name="targetY" type="Number">目标向量Y坐标</param>
  555. /// <returns type="Number"></returns>
  556. return Math.atan2(targetY - originY, targetX - originX);
  557. };
  558. Math.distance = Jyo.Overload().
  559. add("Number, Number, Number, Number", function (p1X, p1Y, p2X, p2Y) {
  560. /// <summary>计算距离</summary>
  561. /// <param name="p1X" type="Number">向量1X坐标</param>
  562. /// <param name="p1Y" type="Number">向量1Y坐标</param>
  563. /// <param name="p2X" type="Number">向量2X坐标</param>
  564. /// <param name="p2Y" type="Number">向量2Y坐标</param>
  565. /// <returns type="Number"></returns>
  566. var dx = p2X - p1Y,
  567. dy = p2Y - p1Y;
  568. return Math.sqrt(dx * dx + dy * dy);
  569. }).
  570. add("Number, Number, Number, Number, Number, Number", function (p1X, p1Y, p1Z, p2X, p2Y, p2Z) {
  571. /// <summary>计算距离</summary>
  572. /// <param name="p1X" type="Number">向量1X坐标</param>
  573. /// <param name="p1Y" type="Number">向量1Y坐标</param>
  574. /// <param name="p2X" type="Number">向量2X坐标</param>
  575. /// <param name="p2Y" type="Number">向量2Y坐标</param>
  576. /// <returns type="Number"></returns>
  577. var dx = p2X - p1Y,
  578. dy = p2Y - p1Y,
  579. dz = p2Z - p1Z;
  580. return Math.sqrt(dx * dx + dy * dy + dz * dz);
  581. });
  582. Math.getBezierCurvePoints = function (fromX, fromY, cpX, cpY, toX, toY) {
  583. var xa, ya, xb, yb, x, y, n = 20, points = [];
  584. function getPt(n1, n2, perc) {
  585. var diff = n2 - n1;
  586. return n1 + (diff * perc);
  587. }
  588. var j = 0;
  589. for (var i = 0; i <= n; i++) {
  590. j = i / n;
  591. // The Green Line
  592. xa = getPt(fromX, cpX, j);
  593. ya = getPt(fromY, cpY, j);
  594. xb = getPt(cpX, toX, j);
  595. yb = getPt(cpY, toY, j);
  596. // The Black Dot
  597. x = getPt(xa, xb, j);
  598. y = getPt(ya, yb, j);
  599. points.push(x, y);
  600. }
  601. return points;
  602. };
  603. Number.prototype.toUInt = function () {
  604. /// <summary>转换为UInt</summary>
  605. /// <returns type="Number"></returns>
  606. return this < 0 ? this + 4294967296 : this;
  607. };
  608. Number.prototype.bytes32 = function () {
  609. /// <summary>转换为32位bytes</summary>
  610. /// <returns type="Array"></returns>
  611. return [(this >>> 24) & 0xff, (this >>> 16) & 0xff, (this >>> 8) & 0xff, this & 0xff];
  612. };
  613. Number.prototype.bytes32sw = function () {
  614. /// <summary>转换为倒置32位bytes</summary>
  615. /// <returns type="Array"></returns>
  616. return [this & 0xff, (this >>> 8) & 0xff, (this >>> 16) & 0xff, (this >>> 24) & 0xff];
  617. };
  618. Number.prototype.bytes16 = function () {
  619. /// <summary>转换为16位bytes</summary>
  620. /// <returns type="Array"></returns>
  621. return [(this >>> 8) & 0xff, this & 0xff];
  622. };
  623. Number.prototype.bytes16sw = function () {
  624. /// <summary>转换为倒置16位bytes</summary>
  625. /// <returns type="Array"></returns>
  626. return [this & 0xff, (this >>> 8) & 0xff];
  627. };
  628. Array.prototype.shuffle = function () {
  629. /// <summary>洗牌</summary>
  630. /// <returns type="Array"></returns>
  631. for (var i = this.length - 1; i > 0; i--) {
  632. var j = Math.floor(Math.random() * (i + 1));
  633. var temp = this[i];
  634. this[i] = this[j];
  635. this[j] = temp;
  636. }
  637. return this;
  638. };
  639. Array.prototype.pdf2cdf = function () {
  640. var cdf = this.slice();
  641. for (var i = 1; i < cdf.length - 1; i++)
  642. cdf[i] += cdf[i - 1];
  643. // Force set last cdf to 1, preventing floating-point summing error in the loop.
  644. cdf[cdf.length - 1] = 1;
  645. return cdf;
  646. };
  647. Array.prototype.discreteSampling = function () {
  648. var y = Math.random();
  649. for (var x in this)
  650. if (y < this[x])
  651. return x;
  652. return -1; // should never runs here, assuming last element in cdf is 1
  653. };
  654. Array.prototype.random = function (probabilityTable) {
  655. /// <summary>随机抽取元素</summary>
  656. /// <param name="probabilityTable" type="Array" optional="true">概率数组(长度必须和本数组一致)</param>
  657. if (typeof probabilityTable != "undefined" &&
  658. probabilityTable instanceof Array) {
  659. var targetCdf = probabilityTable.pdf2cdf();
  660. return this[targetCdf.discreteSampling()];
  661. } else {
  662. if (probabilityTable.length == this.length) {
  663. return this[Math.floor(Math.random() * this.length)];
  664. }
  665. }
  666. };
  667. Array.prototype.insert = function (value, index) {
  668. /// <summary>插入项</summary>
  669. /// <param name="value" type="Object">元素</param>
  670. /// <param name="index" type="Number">索引</param>
  671. /// <returns type="Array"></returns>
  672. if (index > this.length) index = this.length;
  673. if (index < -this.length) index = 0;
  674. if (index < 0) index = this.length + index;
  675. for (var i = this.length; i > index; i--) {
  676. this[i] = this[i - 1];
  677. }
  678. this[index] = value;
  679. return this;
  680. };
  681. Array.prototype.remove = function (index) {
  682. /// <summary>移除项</summary>
  683. /// <param name="index" type="Number">索引</param>
  684. /// <returns type="Array">数组</returns>
  685. return (index < 0) ? this : this.slice(0, index).concat(this.slice(index + 1, this.length));
  686. };
  687. Array.prototype.clear = function () {
  688. /// <summary>清空数组</summary>
  689. this.length = 0;
  690. };
  691. Array.prototype.adler32 = function (start, len) {
  692. /// <summary>计算Adler32校验和</summary>
  693. /// <param name="start" type="Number">起始位置</param>
  694. /// <param name="len" type="Number">长度</param>
  695. /// <returns type="Number"></returns>
  696. switch (arguments.length) { case 0: start = 0; case 1: len = this.length - start; }
  697. var a = 1, b = 0;
  698. for (var i = 0; i < len; i++) {
  699. a = (a + this[start + i]) % 65521; b = (b + a) % 65521;
  700. }
  701. return ((b << 16) | a).toUInt();
  702. };
  703. Array.prototype.crc32 = function (start, len) {
  704. /// <summary>计算CRC32校验和</summary>
  705. /// <param name="start" type="Number">起始位置</param>
  706. /// <param name="len" type="Number">长度</param>
  707. /// <returns type="Number"></returns>
  708. switch (arguments.length) { case 0: start = 0; case 1: len = this.length - start; }
  709. var table = arguments.callee.crctable;
  710. if (!table) {
  711. table = [];
  712. var c;
  713. for (var n = 0; n < 256; n++) {
  714. c = n;
  715. for (var k = 0; k < 8; k++)
  716. c = c & 1 ? 0xedb88320 ^ (c >>> 1) : c >>> 1;
  717. table[n] = c.toUInt();
  718. }
  719. arguments.callee.crctable = table;
  720. }
  721. var c = 0xffffffff;
  722. for (var i = 0; i < len; i++)
  723. c = table[(c ^ this[start + i]) & 0xff] ^ (c >>> 8);
  724. return (c ^ 0xffffffff).toUInt();
  725. };
  726. // 空字符串
  727. String.empty = "";
  728. String.format = function (str, args) {
  729. /// <summary>格式化字符串</summary>
  730. /// <param name="str" type="String">要格式化的字符串</param>
  731. /// <param name="args" type="[..]">其余参数</param>
  732. /// <returns type="String"></returns>
  733. var tempStr = str;
  734. for (var i = 0; i < arguments.length; i++) {
  735. var reg = eval("/\\{" + i + "\\}/g");
  736. tempStr = tempStr.replace(reg, arguments[i + 1]);
  737. }
  738. return tempStr;
  739. };
  740. String.prototype.repeat = function (n) {
  741. /// <summary>重复字符串</summary>
  742. /// <param name="n" type="Number">要重复的次数</param>
  743. /// <returns type="String"></returns>
  744. var _this = this;
  745. var result = '';
  746. for (var i = 0; i < n; i++) {
  747. result += _this;
  748. }
  749. return result;
  750. };
  751. if ("DataView" in window) {
  752. DataView.prototype.getString = function (pos, length) {
  753. /// <summary>获取特定字符串</summary>
  754. /// <param name="pos" type="Number">起始点</param>
  755. /// <param name="length" type="Number">获取长度</param>
  756. /// <returns type="String"></returns>
  757. var str = "";
  758. var u8 = new Uint8Array(1);
  759. for (var i = pos; i < pos + length; i++) {
  760. u8[0] = this.getUint8(i);
  761. if (u8[0] == 0) break;
  762. str += String.fromCharCode(u8[0]);
  763. }
  764. return str;
  765. };
  766. DataView.prototype.getVectorN = function (pos, n) {
  767. /// <summary>获取向量N</summary>
  768. /// <param name="pos" type="Number">起始点</param>
  769. /// <param name="n" type="Number">获取长度</param>
  770. /// <returns type="Float32Array"></returns>
  771. var vec = new Float32Array(n);
  772. for (var i = 0 ; i < n ; i++) {
  773. vec[i] = this.getFloat32(pos + i * 4, true);
  774. }
  775. return vec;
  776. }
  777. } Jyo.Object = function (objProto) {
  778. /// <summary>Jyo.Object类</summary>
  779. /// <param name="objProto" type="Object" optional="true">对象原型</param>
  780. /// <returns type="Jyo.Object"></returns>
  781. this.getHashCode = function () {
  782. /// <summary>用作特定类型的哈希函数</summary>
  783. /// <returns type="Number"></returns>
  784. return 0;
  785. };
  786. this.equals = function (obj) {
  787. /// <summary>确定指定的Object是否等于当前的Object</summary>
  788. /// <param name="obj" type="Jyo.Object">与当前Object进行比较的Object</param>
  789. /// <returns type="Boolean"></returns>
  790. if (!obj || obj != this) {
  791. return false;
  792. }
  793. return true;
  794. };
  795. this.memberwiseClone = function () {
  796. /// <summary>创建当前Object的浅表副本</summary>
  797. /// <returns type="Jyo.Object"></returns>
  798. var obj = new Jyo.Object();
  799. for (var i in this) {
  800. if (typeof this[i] != "function" && this.hasOwnProperty(i)) {
  801. obj[i] = this[i];
  802. }
  803. }
  804. return obj;
  805. };
  806. if (typeof objProto != "undefined") {
  807. for (var i in objProto) {
  808. this[i] = objProto[i];
  809. }
  810. }
  811. };
  812. Jyo.Object.equals = Jyo.Overload().add("*,*", function (objA, objB) {
  813. /// <summary>确定指定的Object实例是否被视为相等</summary>
  814. /// <param name="objA" type="Jyo.Object">要比较的第一个Object</param>
  815. /// <param name="objB" type="Jyo.Object">要比较的第二个Object</param>
  816. /// <returns type="Boolean"></returns>
  817. if (!objA && !objB ||
  818. objA === objB ||
  819. (objA instanceof Jyo.Object && objA.equals(objB) && objB instanceof Jyo.Object && objA.getHashCode() === objB.getHashCode())) {
  820. return true;
  821. }
  822. return false;
  823. }); Jyo.Renderer = function () {
  824. /// <summary>渲染器接口</summary>
  825. /// <returns type="Jyo.Renderer"></returns>
  826. // 文本测量元素
  827. if (document.getElementById("txtMetric")) {
  828. this.textMetricElement = document.getElementById("txtMetric");
  829. } else {
  830. this.textMetricElement = document.createElement("span");
  831. this.textMetricElement.id = "txtMetric";
  832. this.textMetricElement.style.cssText = "position:absolute;top:-1000px;left:-1000px;padding:0px;margin:0px;z-index:-1000;color:transparent;pointer-events:none;";
  833. this.textMetricElement.innerHTML = "你好Helloこんにちは";
  834. this.catchTextHeight = {};
  835. document.body.appendChild(this.textMetricElement);
  836. }
  837. Jyo.Renderer.constructor.apply(this, arguments);
  838. };
  839. Jyo.Renderer.constructor = Jyo.Overload().
  840. add("String", function (domId) {
  841. /// <summary>渲染器接口构造函数</summary>
  842. /// <param name="domId" type="String">Div元素id</param>
  843. /// <returns type="Jyo.Renderer"></returns>
  844. var domElement = document.getElementById(domId) ||
  845. document.getElementsByClassName(domId)[0] ||
  846. document.getElementsByTagName(domId)[0];
  847. Jyo.Renderer.call(this, domElement);
  848. }).
  849. add("*", function (domElement) {
  850. if (!domElement || typeof domElement.getAttribute == "undefined") {
  851. throw new Error("Using an invalid element");
  852. }
  853. // 画区宽度
  854. this.width = domElement.getAttribute("width") || domElement.clientWidth;
  855. // 画区高度
  856. this.height = domElement.getAttribute("height") || domElement.clientHeight;
  857. // 所绑定的DOM元素
  858. this.domElement = domElement;
  859. this.domElement.style.position = "relative";
  860. // 自动缩放模式
  861. this.autoSizeMode = "none";
  862. // 缩放值
  863. this.scaling = 1;
  864. // 禁止右键菜单
  865. domElement.oncontextmenu = function () { return false; };
  866. // 触屏不显示触摸框
  867. domElement.style.cssText += "-webkit-user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);";
  868. if (navigator.userAgent.indexOf("Android") >= 0) {
  869. // 解决安卓下重影问题
  870. document.body.style.cssText += "overflow:visible;-webkit-transform: translateZ(0);";
  871. }
  872. var assign = this.assign;
  873. delete this.assign;
  874. if (typeof assign == "undefined") {
  875. // 分配合适的渲染器
  876. var renderer;
  877. for (var i in Jyo.Renderer) {
  878. renderer = Jyo.Renderer[i];
  879. if (typeof renderer.isSupport != "undefined" && renderer.isSupport()) {
  880. this._applyRenderer(renderer);
  881. return this;
  882. }
  883. }
  884. } else {
  885. // 尝试使用指定的渲染器
  886. var renderer = Jyo.Renderer[assign];
  887. if (renderer && typeof renderer.isSupport != "undefined" && renderer.isSupport()) {
  888. this._applyRenderer(renderer);
  889. return this;
  890. } else {
  891. throw new Error("Can not use this renderer");
  892. }
  893. }
  894. throw new Error("No suitable renderer");
  895. }).
  896. add("String, String", function (domId, assign) {
  897. /// <summary>渲染器接口构造函数</summary>
  898. /// <param name="domId" type="String">Div元素id</param>
  899. /// <param name="assign" type="String" optional="true">指定使用的渲染技术,可选如下:&#10;WebGL&#10;Canvas&#10;Svg&#10;Css&#10;VML -> (IE专有,不推荐)</param>
  900. /// <returns type="Jyo.Renderer"></returns>
  901. this.assign = assign;
  902. Jyo.Renderer.call(this, domId);
  903. }).
  904. add("*, String", function (domElement, assign) {
  905. /// <summary>渲染器接口构造函数</summary>
  906. /// <param name="domElement" type="HTMLDivElement">Div元素</param>
  907. /// <param name="assign" type="String" optional="true">指定使用的渲染技术,可选如下:&#10;WebGL&#10;Canvas&#10;Svg&#10;Css&#10;VML -> (IE专有,不推荐)</param>
  908. /// <returns type="Jyo.Renderer"></returns>
  909. this.assign = assign;
  910. Jyo.Renderer.call(this, domElement);
  911. });
  912. Jyo.Renderer.prototype = new Jyo.Object({
  913. _applyRenderer: function (renderer) {
  914. /// <summary>应用渲染器</summary>
  915. /// <param name="renderer" type="Jyo.Renderer">要应用的渲染器类</param>
  916. this.mode = renderer.mode;
  917. for (var i in renderer.prototype) {
  918. if (renderer.hasOwnProperty(i)) continue;
  919. this[i] = renderer.prototype[i];
  920. }
  921. renderer.call(this);
  922. },
  923. _addRenderElement: function (tagName) {
  924. /// <summary>添加渲染用元素</summary>
  925. /// <param name="tagName" type="String">标签名称</param>
  926. var element = document.createElement(tagName);
  927. element.width = this.width;
  928. element.height = this.height;
  929. element.style.cssText = "position:relative;left:0px;top:0px;width:100%;height:100%;margin:0px;padding:0px;border:0px;outline:none;";
  930. this.domElement.appendChild(element);
  931. this.canvas = element;
  932. },
  933. resize: function (width, height) {
  934. /// <summary>重新设置大小</summary>
  935. /// <param name="width" type="Number">宽度</param>
  936. /// <param name="height" type="Number">高度</param>
  937. var element = this.domElement;
  938. element.style.width = width + "px";
  939. element.style.height = height + "px";
  940. element.setAttribute("width", width);
  941. element.setAttribute("height", height);
  942. if (this.autoSizeMode !== "none") {
  943. this.autoSize();
  944. }
  945. },
  946. enableAutoSize: Jyo.Overload().
  947. add(null, function () {
  948. /// <summary>启用ratio模式进行画布自适应</summary>
  949. this.enableAutoSize("ratio");
  950. }).
  951. add("Function", function (callback) {
  952. /// <summary>启用ratio模式进行画布自适应</summary>
  953. /// <param name="callback" type="Function">重置尺寸时触发函数</param>
  954. this._autoSizeFunction = callback;
  955. this.enableAutoSize("ratio");
  956. }).
  957. add("String", function (mode) {
  958. /// <summary>启用画布自适应</summary>
  959. /// <param name="mode" type="String" optional="true">适应模式,可用值如下:&#10;fill&#10;ratio&#10;默认为ratio</param>
  960. var _this = this;
  961. // 判断是否直接在body中显示
  962. // 如果是,则增加全屏样式
  963. var parentElement = this.domElement.parentElement || this.domElement.parentNode || document.body;
  964. if (parentElement == document.body) {
  965. var style;
  966. var str = "html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;} @viewport{width:device-width;user-zoom:fixed;user-scalable:fixed;}";
  967. if (typeof window.attachEvent != "undefined") {
  968. style = document.styleSheets["JyoJsHTMLStyle"] || document.createStyleSheet();
  969. style.owningElement.id = "JyoJsHTMLStyle";
  970. style.cssText = str;
  971. }
  972. else {
  973. style = document.createElement("style");
  974. style.id = "JyoJsHTMLStyle";
  975. style.innerHTML = str;
  976. var head = document.getElementsByTagName('head')[0];
  977. if (typeof head != "undefined") {
  978. head.appendChild(style);
  979. } else {
  980. document.appendChild(style);
  981. }
  982. }
  983. }
  984. this.autoSizeMode = function () {
  985. if (mode !== "ratio" && mode !== "fill") {
  986. return "ratio";
  987. }
  988. return mode;
  989. }();
  990. this._autoSizeFun = function () {
  991. _this.autoSize();
  992. };
  993. window.addEventListener("resize", this._autoSizeFun);
  994. this.autoSize();
  995. }).
  996. add("String, Function", function (mode, callback) {
  997. /// <summary>启用画布自适应</summary>
  998. /// <param name="mode" type="String">适应模式,可用值如下:&#10;fill&#10;ratio&#10;默认为ratio</param>
  999. /// <param name="callback" type="Function">重置尺寸时触发函数</param>
  1000. this._autoSizeFunction = callback;
  1001. this.enableAutoSize(mode);
  1002. }),
  1003. disableAutoSize: function () {
  1004. /// <summary>停用画布自适应</summary>
  1005. var style = this.domElement.style;
  1006. style.width = this.width + "px";
  1007. style.height = this.height + "px";
  1008. style.marginTop = style.marginLeft = style.top = style.left = style.padding = "0px";
  1009. style.position = "static";
  1010. if (window.attachEvent) {
  1011. document.styleSheets["JyoJsHTMLStyle"].cssText = "";
  1012. }
  1013. else {
  1014. style[Jyo.prefix.lowercase + "Transform"] = style.transform = null;
  1015. style[Jyo.prefix.lowercase + "TransformOrigin"] = style.transformOrigin = null;
  1016. var htmlStyle = document.getElementById("JyoJsHTMLStyle");
  1017. htmlStyle.parentElement.removeChild(htmlStyle);
  1018. }
  1019. if (typeof this._autoSizeFun != "undefined") {
  1020. this.autoSizeMode = "none";
  1021. window.removeEventListener("resize", this._autoSizeFun);
  1022. }
  1023. },
  1024. autoSize: function () {
  1025. /// <summary>让画布自适应一次</summary>
  1026. var parentElement = this.domElement.parentElement || this.domElement.parentNode || document.body;
  1027. var width = this.width,
  1028. height = this.height,
  1029. parentWidth = parentElement.clientWidth,
  1030. parentHeight = parentElement.clientHeight;
  1031. // 计算缩放值
  1032. var scaling = Math.min(Math.floatDiv(parentWidth, width), Math.floatDiv(parentHeight, height));
  1033. this.scaling = scaling;
  1034. if (this.mode !== "Css") {
  1035. // 若不使用Css渲染器,则手动计算子元素缩放
  1036. var els = this.domElement.childNodes;
  1037. for (var i = 0; i < els.length; i++) {
  1038. if (typeof els[i].tagName == "undefined" || els[i].tagName.toLowerCase() != "div") continue;
  1039. var cs = els[i].style;
  1040. cs[Jyo.prefix.lowercase + "Transform"] = "scale(" + scaling + "," + scaling + ")";
  1041. cs["transform"] = "scale(" + scaling + "," + scaling + ")";
  1042. cs[Jyo.prefix.lowercase + "TransformOrigin"] = "0% 0%";
  1043. cs["transformOrigin"] = "0% 0%";
  1044. }
  1045. }
  1046. // 设置画布大小(Svg有效)
  1047. if (this.mode === "Svg") {
  1048. this.canvas.setAttribute("viewBox", "0 0 " + width + " " + height);
  1049. this.canvas.setAttribute("width", (width * scaling) + "px");
  1050. this.canvas.setAttribute("height", (height * scaling) + "px");
  1051. }
  1052. // 设置画区大小
  1053. var style = this.domElement.style;
  1054. if (this.autoSizeMode === "ratio") {
  1055. style.width = (width * scaling) + "px";
  1056. style.height = (height * scaling) + "px";
  1057. if (parentElement == document.body) {
  1058. style.marginTop = ((parentHeight - height * scaling) / 2) + "px";
  1059. style.marginLeft = ((parentWidth - width * scaling) / 2) + "px";
  1060. }
  1061. } else if (this.autoSizeMode === "fill") {
  1062. style.width = "100%";
  1063. style.height = "100%";
  1064. style.marginTop = "0px";
  1065. style.marginLeft = "0px";
  1066. }
  1067. style.padding = "0px";
  1068. if (typeof this._autoSize == "function") {
  1069. // 如果渲染器需要其他缩放操作则触发
  1070. this._autoSize(parentWidth, parentHeight);
  1071. }
  1072. if (typeof this._autoSizeFunction == "function") {
  1073. // 自定义操作
  1074. this._autoSizeFunction(scaling);
  1075. }
  1076. },
  1077. getTextWidth: function (str, font) {
  1078. /// <summary>获取文字宽度</summary>
  1079. /// <param name="str" type="String">要获取的字符串</param>
  1080. /// <param name="font" type="String" optional="true">字体</param>
  1081. /// <returns type="Number"></returns>
  1082. if (this.mode === "Canvas") {
  1083. var oldFont = this.context.font;
  1084. this.context.font = font;
  1085. var w = this.context.measureText(str).width;
  1086. this.context.font = oldFont;
  1087. return w;
  1088. } else {
  1089. return this.getTextSize(str, font).width;
  1090. }
  1091. },
  1092. getTextHeight: function (str, font) {
  1093. /// <summary>获取文字高度</summary>
  1094. /// <param name="str" type="String">要获取的字符串</param>
  1095. /// <param name="font" type="String" optional="true">字体</param>
  1096. /// <returns type="Number"></returns>
  1097. if (this.catchTextHeight[font]) return this.catchTextHeight[font];
  1098. var size = this.getTextSize(str, font);
  1099. this.catchTextHeight[font] = size.height;
  1100. return size.height;
  1101. },
  1102. getTextSize: function (str, font) {
  1103. /// <summary>获取文字尺寸</summary>
  1104. /// <param name="str" type="String">要获取的字符串</param>
  1105. /// <param name="font" type="String" optional="true">字体</param>
  1106. /// <returns type="Object"></returns>
  1107. var tme = this.textMetricElement;
  1108. tme.style.font = font || this.context.font;
  1109. tme.innerHTML = str;
  1110. return {
  1111. width: tme.offsetWidth,
  1112. height: tme.offsetHeight
  1113. };
  1114. },
  1115. getHashCode: function () {
  1116. /// <summary>返回此渲染器的哈希代码</summary>
  1117. /// <returns type="Number">一个指定此渲染器的哈希代码的整数</returns>
  1118. return this.width ^ this.height ^ 11;
  1119. },
  1120. equals: function (value) {
  1121. /// <summary>测试两个渲染器是否相等</summary>
  1122. /// <param name="value" type="Jyo.Color">要进行比较的Jyo.Renderer</param>
  1123. /// <returns type="Boolean"></returns>
  1124. if (this === value ||
  1125. value instanceof Jyo.Renderer &&
  1126. this.getHashCode() === value.getHashCode() &&
  1127. this.mode === value.mode &&
  1128. this.domElement === value.domElement) {
  1129. return true;
  1130. }
  1131. return false;
  1132. }
  1133. }); Jyo.Status = function () {
  1134. /// <summary>游戏状态</summary>
  1135. /// <returns type="Jyo.Status"></returns>
  1136. // 是否正被使用中
  1137. this.using = false;
  1138. };
  1139. Jyo.Status.prototype = new Jyo.Object({
  1140. // 加载资源函数
  1141. load: null,
  1142. // 绘制内容函数
  1143. draw: null,
  1144. // 更新数据函数
  1145. update: null,
  1146. // 卸载资源函数
  1147. unload: null,
  1148. // 加载中显示屏幕
  1149. loadingScreen: null
  1150. }); Jyo.Matrix = function () {
  1151. /// <summary>矩阵类</summary>
  1152. /// <returns type="Jyo.Matrix"></returns>
  1153. Jyo.Matrix.constructor.apply(this, arguments);
  1154. };
  1155. Jyo.Matrix.constructor = Jyo.Overload().
  1156. add(null, function () {
  1157. /// <summary>矩阵对象构造函数</summary>
  1158. /// <returns type="Jyo.Matrix"></returns>
  1159. // 创建4*4矩阵的变量
  1160. for (var y = 1; y <= 4; y++) {
  1161. for (var x = 1; x <= 4; x++) {
  1162. this["m" + y + x] = 0;
  1163. }
  1164. }
  1165. }).
  1166. add("Number,".repeat(15) + "Number", function (m11, m12, m13, m14, m21, m22, m23, m24, m31, m32, m33, m34, m41, m42, m43, m44) {
  1167. /// <summary>矩阵对象构造函数</summary>
  1168. /// <param name="m11" type="Number">矩阵中的一行第一列的值</param>
  1169. /// <param name="m12" type="Number">矩阵中的一行第二列的值</param>
  1170. /// <param name="m13" type="Number">矩阵中的一行第三列的值</param>
  1171. /// <param name="m14" type="Number">矩阵中的一行第四列的值</param>
  1172. /// <param name="m21" type="Number">矩阵中的二行第一列的值</param>
  1173. /// <param name="m22" type="Number">矩阵中的二行第二列的值</param>
  1174. /// <param name="m23" type="Number">矩阵中的二行第三列的值</param>
  1175. /// <param name="m24" type="Number">矩阵中的二行第四列的值</param>
  1176. /// <param name="m31" type="Number">矩阵中的三行第一列的值</param>
  1177. /// <param name="m32" type="Number">矩阵中的三行第二列的值</param>
  1178. /// <param name="m33" type="Number">矩阵中的三行第三列的值</param>
  1179. /// <param name="m34" type="Number">矩阵中的三行第四列的值</param>
  1180. /// <param name="m41" type="Number">矩阵中的四行第一列的值</param>
  1181. /// <param name="m42" type="Number">矩阵中的四行第二列的值</param>
  1182. /// <param name="m43" type="Number">矩阵中的四行第三列的值</param>
  1183. /// <param name="m44" type="Number">矩阵中的四行第四列的值</param>
  1184. /// <returns type="Jyo.Matrix"></returns>
  1185. // 创建4*4矩阵的变量
  1186. this.m11 = m11;
  1187. this.m12 = m12;
  1188. this.m13 = m13;
  1189. this.m14 = m14;
  1190. this.m21 = m21;
  1191. this.m22 = m22;
  1192. this.m23 = m23;
  1193. this.m24 = m24;
  1194. this.m31 = m31;
  1195. this.m32 = m32;
  1196. this.m33 = m33;
  1197. this.m34 = m34;
  1198. this.m41 = m41;
  1199. this.m42 = m42;
  1200. this.m43 = m43;
  1201. this.m44 = m44;
  1202. });
  1203. // 矩阵相加
  1204. Jyo.Matrix.add = Jyo.Overload().
  1205. add("Jyo.Matrix, Jyo.Matrix", function (matrix1, matrix2) {
  1206. /// <summary>矩阵相加</summary>
  1207. /// <param name="matrix1" type="Jyo.Matrix">源矩阵</param>
  1208. /// <param name="matrix2" type="Jyo.Matrix">源矩阵</param>
  1209. /// <returns type="Jyo.Matrix"></returns>
  1210. var newMatrix = new Jyo.Matrix(),
  1211. attrName = null,
  1212. y, x;
  1213. for (y = 1; y <= 4; y++) {
  1214. for (x = 1; x <= 4; x++) {
  1215. attrName = ["m" + y + x];
  1216. newMatrix[attrName] = matrix1[attrName] + matrix2[attrName];
  1217. }
  1218. }
  1219. return newMatrix;
  1220. });
  1221. // 矩阵相减
  1222. Jyo.Matrix.subtract = Jyo.Overload().
  1223. add("Jyo.Matrix, Jyo.Matrix", function (matrix1, matrix2) {
  1224. /// <summary>矩阵相减</summary>
  1225. /// <param name="matrix1" type="Jyo.Matrix">源矩阵</param>
  1226. /// <param name="matrix2" type="Jyo.Matrix">源矩阵</param>
  1227. /// <returns type="Jyo.Matrix"></returns>
  1228. var newMatrix = new Jyo.Matrix(),
  1229. attrName = null,
  1230. y, x;
  1231. for (y = 1; y <= 4; y++) {
  1232. for (x = 1; x <= 4; x++) {
  1233. attrName = ["m" + y + x];
  1234. newMatrix[attrName] = matrix1[attrName] - matrix2[attrName];
  1235. }
  1236. }
  1237. return newMatrix;
  1238. });
  1239. // 矩阵相乘
  1240. Jyo.Matrix.multiply = Jyo.Overload().
  1241. add("Jyo.Matrix, Jyo.Matrix", function (matrix1, matrix2) {
  1242. /// <summary>矩阵相乘</summary>
  1243. /// <param name="matrix1" type="Jyo.Matrix">源矩阵</param>
  1244. /// <param name="matrix2" type="Jyo.Matrix">源矩阵</param>
  1245. /// <returns type="Jyo.Matrix"></returns>
  1246. var newMatrix = new Jyo.Matrix(),
  1247. y, x, n;
  1248. for (y = 1; y <= 4; y++) {
  1249. for (x = 1; x <= 4; x++) {
  1250. newMatrix["m" + y + x] = 0;
  1251. for (n = 1; n <= 4; n++)
  1252. newMatrix["m" + y + x] += matrix1["m" + y + n] * matrix2["m" + n + x];
  1253. }
  1254. }
  1255. return newMatrix;
  1256. }).
  1257. add("Jyo.Matrix, Number", function (matrix1, scaleFactor) {
  1258. /// <summary>由标量值乘以一个矩阵</summary>
  1259. /// <param name="matrix1" type="Number">源矩阵</param>
  1260. /// <param name="scaleFactor" type="Number">标量值</param>
  1261. /// <returns type="Jyo.Matrix"></returns>
  1262. var newMatrix = new Jyo.Matrix(),
  1263. attrName = null,
  1264. y, x;
  1265. for (y = 1; y <= 4; y++) {
  1266. for (x = 1; x <= 4; x++) {
  1267. attrName = ["m" + y + x];
  1268. newMatrix[attrName] = matrix1[attrName] * scaleFactor;
  1269. }
  1270. }
  1271. return newMatrix;
  1272. }).
  1273. add("Number, Jyo.Matrix", function (scaleFactor, matrix1) {
  1274. /// <summary>由标量值乘以一个矩阵</summary>
  1275. /// <param name="scaleFactor" type="Number">标量值</param>
  1276. /// <param name="matrix1" type="Number">源矩阵</param>
  1277. /// <returns type="Jyo.Matrix"></returns>
  1278. return Jyo.Matrix.multiply(matrix1, scaleFactor);
  1279. });
  1280. // 矩阵相除
  1281. Jyo.Matrix.divide = Jyo.Overload().
  1282. add("Jyo.Matrix, Jyo.Matrix", function (matrix1, matrix2) {
  1283. /// <summary>矩阵相除</summary>
  1284. /// <param name="matrix1" type="Jyo.Matrix">源矩阵</param>
  1285. /// <param name="matrix2" type="Jyo.Matrix">源矩阵</param>
  1286. /// <returns type="Jyo.Matrix"></returns>
  1287. var newMatrix = new Jyo.Matrix(),
  1288. y, x, n;
  1289. for (y = 1; y <= 4; y++) {
  1290. for (x = 1; x <= 4; x++) {
  1291. attrName = ["m" + y + x];
  1292. newMatrix[attrName] = matrix1[attrName] / matrix2[attrName];
  1293. }
  1294. }
  1295. return newMatrix;
  1296. }).
  1297. add("Jyo.Matrix, Number", function (matrix1, scaleFactor) {
  1298. /// <summary>由标量值为被除数计算一个矩阵</summary>
  1299. /// <param name="matrix1" type="Number">源矩阵</param>
  1300. /// <param name="scaleFactor" type="Number">标量值</param>
  1301. /// <returns type="Jyo.Matrix"></returns>
  1302. var newMatrix = new Jyo.Matrix(),
  1303. attrName = null,
  1304. y, x;
  1305. for (y = 1; y <= 4; y++) {
  1306. for (x = 1; x <= 4; x++) {
  1307. attrName = ["m" + y + x];
  1308. newMatrix[attrName] = matrix1[attrName] / scaleFactor;
  1309. }
  1310. }
  1311. return newMatrix;
  1312. }).
  1313. add("Number, Jyo.Matrix", function (scaleFactor, matrix1) {
  1314. /// <summary>由标量值为被除数计算一个矩阵</summary>
  1315. /// <param name="scaleFactor" type="Number">标量值</param>
  1316. /// <param name="matrix1" type="Number">源矩阵</param>
  1317. /// <returns type="Jyo.Matrix"></returns>
  1318. return Jyo.Matrix.multiply(matrix1, scaleFactor);
  1319. });
  1320. // 矩阵转置
  1321. Jyo.Matrix.transpose = Jyo.Overload().
  1322. add("Jyo.Matrix", function (matrix) {
  1323. /// <summary>转置矩阵的行和列</summary>
  1324. /// <param name="matrix" type="Jyo.Matrix">源矩阵</param>
  1325. /// <returns type="Jyo.Matrix"></returns>
  1326. var newMatrix = new Jyo.Matrix(),
  1327. y, x;
  1328. for (y = 1; y <= 4; y++) {
  1329. for (x = 1; x <= 4; x++) {
  1330. newMatrix["m" + y + x] = matrix["m" + x + y];
  1331. }
  1332. }
  1333. return newMatrix;
  1334. });
  1335. Jyo.Matrix.prototype = new Jyo.Object({
  1336. print: function () {
  1337. /// <summary>打印矩阵</summary>
  1338. /// <returns type="String"></returns>
  1339. var str = "";
  1340. for (var y = 1; y <= 4; y++) {
  1341. for (var x = 1; x <= 4; x++) {
  1342. str += this["m" + y + x] + "\t";
  1343. }
  1344. str += "\r\n";
  1345. }
  1346. return str;
  1347. }
  1348. });
  1349. // 单位矩阵实例
  1350. Jyo.Matrix.identity = new Jyo.Matrix(1, 0, 0, 0,
  1351. 0, 1, 0, 0,
  1352. 0, 0, 1, 0,
  1353. 0, 0, 0, 1); Jyo.Texture = function () {
  1354. /// <summary>材质类</summary>
  1355. /// <returns type="Jyo.Texture"></returns>
  1356. // 具体对象
  1357. this.object = null;
  1358. };
  1359. Jyo.Texture.prototype = new Jyo.Object({
  1360. // 指示可用加载器
  1361. useLoader: "Texture",
  1362. bind: function (renderer, img) {
  1363. /// <summary>绑定具体对象到托管对象</summary>
  1364. /// <param name="renderer" type="Jyo.Renderer">绑定的渲染器</param>
  1365. /// <param name="img" type="WebGLShader">要绑定的具体对象</param>
  1366. if (renderer.mode == "WebGL") {
  1367. var gl = renderer.context;
  1368. var texture = gl.createTexture();
  1369. gl.bindTexture(gl.TEXTURE_2D, texture);
  1370. // 控制滤波
  1371. gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, img);
  1372. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
  1373. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
  1374. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
  1375. var error = gl.getError();
  1376. if (error !== gl.NO_ERROR && error !== gl.CONTEXT_LOST_WEBGL) {
  1377. throw new Error(error);
  1378. }
  1379. texture.image = img;
  1380. this.gl = gl;
  1381. }
  1382. this.object = texture || img;
  1383. this.width = img.width;
  1384. this.height = img.height;
  1385. },
  1386. getHashCode: function () {
  1387. /// <summary>返回此材质的哈希代码</summary>
  1388. /// <returns type="Number">一个指定此材质的哈希代码的整数</returns>
  1389. return 112;
  1390. },
  1391. equals: function (value) {
  1392. /// <summary>测试两个材质是否相等</summary>
  1393. /// <param name="value" type="Jyo.Texture">要进行比较的Jyo.Texture</param>
  1394. /// <returns type="Boolean"></returns>
  1395. if (this === value ||
  1396. value instanceof Jyo.Texture &&
  1397. this.getHashCode() === value.getHashCode() &&
  1398. this.object === value.object) {
  1399. return true;
  1400. }
  1401. return false;
  1402. },
  1403. destroy: function () {
  1404. /// <summary>销毁对象</summary>
  1405. if (this.gl) {
  1406. this.gl.deleteTexture(this.object);
  1407. }
  1408. this.object = null;
  1409. delete this.object;
  1410. }
  1411. });; (function () {
  1412. Jyo.Color = function () {
  1413. /// <summary>颜色类</summary>
  1414. /// <returns type="Jyo.Color"></returns>
  1415. Jyo.Color.constructor.apply(this, arguments);
  1416. };
  1417. var matchCanvas = document.createElement("canvas");
  1418. if (typeof HTMLCanvasElement != "function" && !!matchCanvas) {
  1419. var matchCtx = matchCanvas.getContext("2d");
  1420. matchCanvas.width = 4;
  1421. matchCanvas.height = 4;
  1422. }
  1423. Jyo.Color.constructor = Jyo.Overload().
  1424. add(null, function () {
  1425. /// <summary>颜色构造函数</summary>
  1426. /// <returns type="Jyo.Color"></returns>
  1427. Jyo.Color.call(this, 0, 0, 0, 1);
  1428. }).
  1429. add("Image", function (image) {
  1430. /// <summary>颜色构造函数</summary>
  1431. /// <param name="image" type="Image">图像对象</param>
  1432. /// <returns type="Jyo.Color"></returns>
  1433. var r = 0, g = 0, b = 0, skip = 0, pixs;
  1434. if (!matchCtx) {
  1435. Jyo.Color.call(this, 255, 255, 255, 1);
  1436. return;
  1437. }
  1438. matchCtx.drawImage(image, 0, 0, 4, 4);
  1439. try {
  1440. pixs = matchCtx.getImageData(0, 0, 4, 4).data;
  1441. }
  1442. catch (e) {
  1443. Jyo.Color.call(this, 255, 255, 255, 1);
  1444. return;
  1445. }
  1446. for (var i = 0; i < pixs.length; i += 4) {
  1447. if (pixs[i + 3] < 30) {
  1448. skip++;
  1449. continue;
  1450. }
  1451. r += pixs[i] * 4;
  1452. g += pixs[i + 1] * 4;
  1453. b += pixs[i + 2] * 4;
  1454. }
  1455. r = (r / (pixs.length - skip)) | 0;
  1456. g = (g / (pixs.length - skip)) | 0;
  1457. b = (b / (pixs.length - skip)) | 0;
  1458. var max = Math.max(r, g, b);
  1459. if (r == max) {
  1460. r = (r * 1.2) | 0;
  1461. g = (g * 0.8) | 0;
  1462. b = (b * 0.8) | 0;
  1463. }
  1464. else if (g == max) {
  1465. g = (g * 1.2) | 0;
  1466. r = (r * 0.8) | 0;
  1467. b = (b * 0.8) | 0;
  1468. }
  1469. else if (b == max) {
  1470. b = (b * 1.2) | 0;
  1471. g = (g * 0.8) | 0;
  1472. r = (r * 0.8) | 0;
  1473. }
  1474. Jyo.Color.call(this, r, g, b);
  1475. }).
  1476. add("Jyo.Texture", function (texture) {
  1477. /// <summary>颜色构造函数</summary>
  1478. /// <param name="texture" type="Jyo.Texture">材质对象</param>
  1479. /// <returns type="Jyo.Color"></returns>
  1480. Jyo.Color.call(this, texture.object);
  1481. }).
  1482. add("Jyo.Color", function (color) {
  1483. /// <summary>颜色构造函数</summary>
  1484. /// <param name="color" type="Jyo.Color">颜色对象</param>
  1485. /// <returns type="Jyo.Color"></returns>
  1486. Jyo.Color.call(this, color.red, color.green, color.blue, color.alpha);
  1487. }).
  1488. add("String", function (colorStr) {
  1489. /// <summary>颜色构造函数</summary>
  1490. /// <param name="colorStr" type="String">颜色值</param>
  1491. /// <returns type="Jyo.Color"></returns>
  1492. var hex, rgb, hsl;
  1493. if (Jyo.Color.colorMap[colorStr.toLowerCase()]) {
  1494. // 从颜色表中获取颜色值
  1495. colorStr = Jyo.Color.colorMap[colorStr.toLowerCase()];
  1496. }
  1497. if ((hex = colorStr.match(/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/)) && (hex = hex[1])) {
  1498. // 检查是否为HEX值
  1499. hex = hex.length == 3 ? [hex[0], hex[0], hex[1], hex[1], hex[2], hex[2]].join("") : hex;
  1500. Jyo.Color.call(this, parseInt(hex, 16));
  1501. } else if ((rgb = colorStr.match(/^rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)(?:\s*,\s*([.\d]+))?\s*\)$/i))) {
  1502. // 检查是否为RGB或RGBA值
  1503. if (typeof rgb[4] != "undefined") Jyo.Color.call(this, +rgb[1], +rgb[2], +rgb[3], +rgb[4]);
  1504. else Jyo.Color.call(this, +rgb[1], +rgb[2], +rgb[3]);
  1505. } else if ((hsl = colorStr.match(/^hsla?\(\s*(\d+)\s*,\s*(\d+)%\s*,\s*(\d+)%(?:\s*,\s*([.\d]+))?\s*\)$/))) {
  1506. // 检查是否为HSL或HSLA值
  1507. var r, g, b, a = typeof hsl[4] != "undefined" ? +hsl[4] : 1;
  1508. var h = +hsl[1] / 360, s = +hsl[2] / 100, l = +hsl[3] / 100;
  1509. if (s == 0) {
  1510. r = g = b = l;
  1511. } else {
  1512. function hue2rgb(p, q, t) {
  1513. if (t < 0) t += 1;
  1514. if (t > 1) t -= 1;
  1515. if (t < 1 / 6) return p + (q - p) * 6 * t;
  1516. if (t < 1 / 2) return q;
  1517. if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
  1518. return p;
  1519. }
  1520. var q = l < 0.5 ? l * (1 + s) : l + s - l * s;
  1521. var p = 2 * l - q;
  1522. r = hue2rgb(p, q, h + 1 / 3);
  1523. g = hue2rgb(p, q, h);
  1524. b = hue2rgb(p, q, h - 1 / 3);
  1525. }
  1526. Jyo.Color.call(this, Math.round(r * 255), Math.round(g * 255), Math.round(b * 255), a);
  1527. }
  1528. }).
  1529. add("Number", function (colorInt) {
  1530. /// <summary>颜色构造函数</summary>
  1531. /// <param name="colorInt" type="Number">十进制颜色值</param>
  1532. /// <returns type="Jyo.Color"></returns>
  1533. Jyo.Color.call(this, colorInt >> 16 & 0xFF, colorInt >> 8 & 0xFF, colorInt & 0xFF);
  1534. }).
  1535. add("Number,Number,Number", function (r, g, b) {
  1536. /// <summary>颜色构造函数</summary>
  1537. /// <param name="r" type="Number">红色值</param>
  1538. /// <param name="g" type="Number">绿色值</param>
  1539. /// <param name="b" type="Number">蓝色值</param>
  1540. /// <returns type="Jyo.Color"></returns>
  1541. this.red = (r > 255 ? 255 : r < 0 ? 0 : r) << 0;
  1542. this.green = (g > 255 ? 255 : g < 0 ? 0 : g) << 0;
  1543. this.blue = (b > 255 ? 255 : b < 0 ? 0 : b) << 0;
  1544. this.alpha = 1.0;
  1545. }).
  1546. add("Number,Number,Number,Number", function (r, g, b, a) {
  1547. /// <summary>颜色构造函数</summary>
  1548. /// <param name="r" type="Number">红色值</param>
  1549. /// <param name="g" type="Number">绿色值</param>
  1550. /// <param name="b" type="Number">蓝色值</param>
  1551. /// <param name="a" type="Number">Alpha值</param>
  1552. /// <returns type="Jyo.Color"></returns>
  1553. Jyo.Color.call(this, r, g, b);
  1554. this.alpha = a > 1 ? 1 : a < 0 ? 0 : a;
  1555. });
  1556. Jyo.Color.prototype = new Jyo.Object({
  1557. toInt32: function () {
  1558. /// <summary>转换为32位10进制表示法</summary>
  1559. /// <returns type="Number"></returns>
  1560. return (this.red << 16 | this.green << 8 | this.blue);
  1561. },
  1562. toHex: function () {
  1563. /// <summary>转换为16进制表示法(无法表示Alpha值)</summary>
  1564. /// <returns type="String"></returns>
  1565. return "#" + this.toInt32().toString(16);
  1566. },
  1567. toRgb: function () {
  1568. /// <summary>转换为RGB表示法</summary>
  1569. /// <returns type="String"></returns>
  1570. return String.format("rgb({0},{1},{2})", this.red, this.green, this.blue);
  1571. },
  1572. toRgba: function () {
  1573. /// <summary>转换为RGBA表示法</summary>
  1574. /// <returns type="String"></returns>
  1575. return String.format("rgba({0},{1},{2},{3})", this.red, this.green, this.blue, this.alpha);
  1576. },
  1577. toHsl: function () {
  1578. /// <summary>转换为HSL表示法</summary>
  1579. /// <returns type="String"></returns>
  1580. var r = this.red / 255,
  1581. g = this.green / 255,
  1582. b = this.blue / 255;
  1583. var max = Math.max(r, g, b), min = Math.min(r, g, b);
  1584. var h, s, l = (max + min) / 2;
  1585. if (max == min) {
  1586. h = s = 0;
  1587. } else {
  1588. var d = max - min;
  1589. s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
  1590. switch (max) {
  1591. case r: h = (g - b) / d + (g < b ? 6 : 0); break;
  1592. case g: h = (b - r) / d + 2; break;
  1593. case b: h = (r - g) / d + 4; break;
  1594. }
  1595. h /= 6;
  1596. }
  1597. return String.format("hsl({0},{1}%,{2}%)", (h * 360) | 0, s * 100, l * 100);
  1598. },
  1599. toHsla: function () {
  1600. /// <summary>转换为HSLA表示法</summary>
  1601. /// <returns type="String"></returns>
  1602. var _this = this;
  1603. return this.toHsl().replace(/(\(|\))/g, function (char) {
  1604. switch (char) {
  1605. case "(":
  1606. return "a(";
  1607. case ")":
  1608. return "," + _this.alpha + ")";
  1609. }
  1610. });
  1611. },
  1612. getHashCode: function () {
  1613. /// <summary>返回此颜色的哈希代码</summary>
  1614. /// <returns type="Number">一个指定此颜色的哈希代码的整数</returns>
  1615. return this.red ^ this.green ^ this.blue ^ ((this.alpha * 255) << 0);
  1616. },
  1617. equals: function (value) {
  1618. /// <summary>测试两个颜色是否相等</summary>
  1619. /// <param name="value" type="Jyo.Color">要进行比较的Jyo.Color</param>
  1620. /// <returns type="Boolean"></returns>
  1621. if (typeof value === "string" || typeof value === "number") {
  1622. return this.equals(new Jyo.Color(value));
  1623. }
  1624. if (this === value ||
  1625. value instanceof Jyo.Color &&
  1626. this.getHashCode() === value.getHashCode() &&
  1627. this.red === value.red &&
  1628. this.green === value.green &&
  1629. this.blue === value.blue &&
  1630. this.alpha === value.alpha) {
  1631. return true;
  1632. }
  1633. return false;
  1634. }
  1635. });
  1636. Jyo.Color.colorMap = {
  1637. "aliceblue": "#f0f8ff",
  1638. "antiquewhite": "#faebd7",
  1639. "aqua": "#00ffff",
  1640. "aquamarine": "#7fffd4",
  1641. "azure": "#f0ffff",
  1642. "beige": "#f5f5dc",
  1643. "bisque": "#ffe4c4",
  1644. "black": "#000000",
  1645. "blanchedalmond": "#ffebcd",
  1646. "blue": "#0000ff",
  1647. "blueviolet": "#8a2be2",
  1648. "brown": "#a52a2a",
  1649. "burlywood": "#deb887",
  1650. "cadetblue": "#5f9ea0",
  1651. "chartreuse": "#7fff00",
  1652. "chocolate": "#d2691e",
  1653. "coral": "#ff7f50",
  1654. "cornflowerblue": "#6495ed",
  1655. "cornsilk": "#fff8dc",
  1656. "crimson": "#dc143c",
  1657. "cyan": "#00ffff",
  1658. "darkblue": "#00008b",
  1659. "darkcyan": "#008b8b",
  1660. "darkgoldenrod": "#b8860b",
  1661. "darkgray": "#a9a9a9",
  1662. "darkgreen": "#006400",
  1663. "darkgrey": "#a9a9a9",
  1664. "darkkhaki": "#bdb76b",
  1665. "darkmagenta": "#8b008b",
  1666. "darkolivegreen": "#556b2f",
  1667. "darkorange": "#ff8c00",
  1668. "darkorchid": "#9932cc",
  1669. "darkred": "#8b0000",
  1670. "darksalmon": "#e9967a",
  1671. "darkseagreen": "#8fbc8f",
  1672. "darkslateblue": "#483d8b",
  1673. "darkslategray": "#2f4f4f",
  1674. "darkslategrey": "#2f4f4f",
  1675. "darkturquoise": "#00ced1",
  1676. "darkviolet": "#9400d3",
  1677. "deeppink": "#ff1493",
  1678. "deepskyblue": "#00bfff",
  1679. "dimgray": "#696969",
  1680. "dimgrey": "#696969",
  1681. "dodgerblue": "#1e90ff",
  1682. "firebrick": "#b22222",
  1683. "floralwhite": "#fffaf0",
  1684. "forestgreen": "#228b22",
  1685. "fuchsia": "#ff00ff",
  1686. "gainsboro": "#dcdcdc",
  1687. "ghostwhite": "#f8f8ff",
  1688. "gold": "#ffd700",
  1689. "goldenrod": "#daa520",
  1690. "gray": "#808080",
  1691. "green": "#008000",
  1692. "greenyellow": "#adff2f",
  1693. "grey": "#808080",
  1694. "honeydew": "#f0fff0",
  1695. "hotpink": "#ff69b4",
  1696. "indianred": "#cd5c5c",
  1697. "indigo": "#4b0082",
  1698. "ivory": "#fffff0",
  1699. "khaki": "#f0e68c",
  1700. "lavender": "#e6e6fa",
  1701. "lavenderblush": "#fff0f5",
  1702. "lawngreen": "#7cfc00",
  1703. "lemonchiffon": "#fffacd",
  1704. "lightblue": "#add8e6",
  1705. "lightcoral": "#f08080",
  1706. "lightcyan": "#e0ffff",
  1707. "lightgoldenrodyellow": "#fafad2",
  1708. "lightgray": "#d3d3d3",
  1709. "lightgreen": "#90ee90",
  1710. "lightgrey": "#d3d3d3",
  1711. "lightpink": "#ffb6c1",
  1712. "lightsalmon": "#ffa07a",
  1713. "lightseagreen": "#20b2aa",
  1714. "lightskyblue": "#87cefa",
  1715. "lightslategray": "#778899",
  1716. "lightslategrey": "#778899",
  1717. "lightsteelblue": "#b0c4de",
  1718. "lightyellow": "#ffffe0",
  1719. "lime": "#00ff00",
  1720. "limegreen": "#32cd32",
  1721. "linen": "#faf0e6",
  1722. "magenta": "#ff00ff",
  1723. "maroon": "#800000",
  1724. "mediumaquamarine": "#66cdaa",
  1725. "mediumblue": "#0000cd",
  1726. "mediumorchid": "#ba55d3",
  1727. "mediumpurple": "#9370db",
  1728. "mediumseagreen": "#3cb371",
  1729. "mediumslateblue": "#7b68ee",
  1730. "mediumspringgreen": "#00fa9a",
  1731. "mediumturquoise": "#48d1cc",
  1732. "mediumvioletred": "#c71585",
  1733. "midnightblue": "#191970",
  1734. "mintcream": "#f5fffa",
  1735. "mistyrose": "#ffe4e1",
  1736. "moccasin": "#ffe4b5",
  1737. "navajowhite": "#ffdead",
  1738. "navy": "#000080",
  1739. "oldlace": "#fdf5e6",
  1740. "olive": "#808000",
  1741. "olivedrab": "#6b8e23",
  1742. "orange": "#ffa500",
  1743. "orangered": "#ff4500",
  1744. "orchid": "#da70d6",
  1745. "palegoldenrod": "#eee8aa",
  1746. "palegreen": "#98fb98",
  1747. "paleturquoise": "#afeeee",
  1748. "palevioletred": "#db7093",
  1749. "papayawhip": "#ffefd5",
  1750. "peachpuff": "#ffdab9",
  1751. "peru": "#cd853f",
  1752. "pink": "#ffc0cb",
  1753. "plum": "#dda0dd",
  1754. "powderblue": "#b0e0e6",
  1755. "purple": "#800080",
  1756. "red": "#ff0000",
  1757. "rosybrown": "#bc8f8f",
  1758. "royalblue": "#4169e1",
  1759. "saddlebrown": "#8b4513",
  1760. "salmon": "#fa8072",
  1761. "sandybrown": "#f4a460",
  1762. "seagreen": "#2e8b57",
  1763. "seashell": "#fff5ee",
  1764. "sienna": "#a0522d",
  1765. "silver": "#c0c0c0",
  1766. "skyblue": "#87ceeb",
  1767. "slateblue": "#6a5acd",
  1768. "slategray": "#708090",
  1769. "slategrey": "#708090",
  1770. "snow": "#fffafa",
  1771. "springgreen": "#00ff7f",
  1772. "steelblue": "#4682b4",
  1773. "tan": "#d2b48c",
  1774. "teal": "#008080",
  1775. "thistle": "#d8bfd8",
  1776. "tomato": "#ff6347",
  1777. "turquoise": "#40e0d0",
  1778. "transparent": "rgba(0,0,0,0)",
  1779. "violet": "#ee82ee",
  1780. "wheat": "#f5deb3",
  1781. "white": "#ffffff",
  1782. "whitesmoke": "#f5f5f5",
  1783. "yellow": "#ffff00",
  1784. "yellowgreen": "#9acd32"
  1785. };
  1786. })(); Jyo.Rectangle = function () {
  1787. /// <summary>矩形类</summary>
  1788. /// <returns type="Jyo.Rectangle"></returns>
  1789. Jyo.Rectangle.constructor.apply(this, arguments);
  1790. };
  1791. Jyo.Rectangle.constructor = Jyo.Overload().
  1792. add(null, function () {
  1793. /// <summary>矩形对象构造函数</summary>
  1794. /// <returns type="Jyo.Rectangle"></returns>
  1795. Jyo.Color.call(this, 0, 0, 0, 0);
  1796. }).
  1797. add("Jyo.Rectangle", function (rect) {
  1798. /// <summary>矩形对象构造函数</summary>
  1799. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  1800. /// <returns type="Jyo.Rectangle"></returns>
  1801. Jyo.Color.call(this, rect.x, rect.y, rect.width, rect.height);
  1802. }).
  1803. add("Number, Number, Number, Number", function (x, y, width, height) {
  1804. /// <summary>矩形对象构造函数</summary>
  1805. /// <param name="x" type="Number">起始X坐标</param>
  1806. /// <param name="y" type="Number">起始Y坐标</param>
  1807. /// <param name="width" type="Number">矩形宽度</param>
  1808. /// <param name="height" type="Number">矩形高度</param>
  1809. /// <returns type="Jyo.Rectangle"></returns>
  1810. this.x = x;
  1811. this.y = y;
  1812. this.width = width < 0 ? 0 : width;
  1813. this.height = height < 0 ? 0 : height;
  1814. });
  1815. Jyo.Rectangle.intersect = Jyo.Overload().
  1816. add("Jyo.Rectangle, Jyo.Rectangle", function (value1, value2) {
  1817. /// <summary>找到相交的矩形</summary>
  1818. /// <param name="value1" type="Jyo.Rectangle">要检测的第一个矩形</param>
  1819. /// <param name="value2" type="Jyo.Rectangle">要检测的第二个矩形</param>
  1820. /// <returns type="Jyo.Rectangle"></returns>
  1821. var x, y, width, height;
  1822. x = value1.x > value2.x ? value1.x : value2.x;
  1823. y = value1.y > value2.y ? value1.y : value2.y;
  1824. width = value1.x + value1.width < value2.x + value2.width ? value1.x + value1.width : value2.x + value2.width - x;
  1825. height = value1.y + value1.height < value2.y + value2.height ? value1.y + value1.height : value2.y + value2.height - y;
  1826. if (width < 0 || height < 0) {
  1827. width = 0;
  1828. height = 0;
  1829. }
  1830. return new Jyo.Rectangle(x, y, width, height);
  1831. });
  1832. Jyo.Rectangle.prototype = new Jyo.Object({
  1833. intersects: Jyo.Overload().
  1834. add("Jyo.Rectangle", function (rect) {
  1835. /// <summary>检测两个矩形是否相交</summary>
  1836. /// <param name="rect" type="Jyo.Rectangle">要与之检测的矩形</param>
  1837. /// <returns type="Boolean"></returns>
  1838. return this.intersects(rect.x, rect.y, rect.width, rect.height);
  1839. }).
  1840. add("Number, Number, Number, Number", function (x, y, width, height) {
  1841. /// <summary>检测两个矩形是否相交</summary>
  1842. /// <param name="x" type="Number">起始X坐标</param>
  1843. /// <param name="y" type="Number">起始Y坐标</param>
  1844. /// <param name="width" type="Number">矩形宽度</param>
  1845. /// <param name="height" type="Number">矩形高度</param>
  1846. /// <returns type="Boolean"></returns>
  1847. return !(this.x + this.width < x ||
  1848. x + width < this.x ||
  1849. this.y + this.height < y ||
  1850. y + height < this.y);
  1851. }),
  1852. getHashCode: function () {
  1853. /// <summary>返回此矩形的哈希代码</summary>
  1854. /// <returns type="Number">一个指定此矩形的哈希代码的整数</returns>
  1855. return this.x ^ this.y ^ this.width ^ this.height;
  1856. },
  1857. equals: function (value) {
  1858. /// <summary>测试两个矩形是否相等</summary>
  1859. /// <param name="value" type="Jyo.Rectangle">要进行比较的Jyo.Rectangle</param>
  1860. /// <returns type="Boolean"></returns>
  1861. if (this === value ||
  1862. value instanceof Jyo.Rectangle &&
  1863. this.getHashCode() === value.getHashCode() &&
  1864. this.x === value.x &&
  1865. this.y === value.y &&
  1866. this.width === value.width &&
  1867. this.height === value.height) {
  1868. return true;
  1869. }
  1870. return false;
  1871. }
  1872. }); Jyo.Shader = function () {
  1873. /// <summary>渲染器类</summary>
  1874. /// <returns type="Jyo.Shader"></returns>
  1875. // 具体对象
  1876. this.object = null;
  1877. // 是否为软件渲染
  1878. this.isSoftware = false;
  1879. // 着色器类型
  1880. this.type = "unkonw";
  1881. };
  1882. Jyo.Shader.prototype = new Jyo.Object({
  1883. // 指示可用加载器
  1884. useLoader: "Shader",
  1885. bind: function (renderer, webglShader) {
  1886. /// <summary>绑定具体对象到托管对象</summary>
  1887. /// <param name="renderer" type="Jyo.Renderer">绑定的渲染器</param>
  1888. /// <param name="webglShader" type="WebGLShader">要绑定的具体对象</param>
  1889. this.object = webglShader;
  1890. if (renderer.mode == "WebGL") {
  1891. var gl = renderer.context;
  1892. if (webglShader instanceof WebGLShader) {
  1893. this.type = gl.getShaderParameter(webglShader, gl.SHADER_TYPE);
  1894. switch (gl.getShaderParameter(webglShader, gl.SHADER_TYPE)) {
  1895. case gl.VERTEX_SHADER:
  1896. this.type = "VERTEX_SHADER";
  1897. break;
  1898. case gl.FRAGMENT_SHADER:
  1899. this.type = "FRAGMENT_SHADER";
  1900. break;
  1901. }
  1902. }
  1903. this.gl = gl;
  1904. } else if (renderer.mode == "Canvas") {
  1905. // 转换GLSL为像素处理函数
  1906. }
  1907. },
  1908. getHashCode: function () {
  1909. /// <summary>返回此着色器的哈希代码</summary>
  1910. /// <returns type="Number">一个指定此着色器的哈希代码的整数</returns>
  1911. return 111;
  1912. },
  1913. equals: function (value) {
  1914. /// <summary>测试两个着色器是否相等</summary>
  1915. /// <param name="value" type="Jyo.Shader">要进行比较的Jyo.Shader</param>
  1916. /// <returns type="Boolean"></returns>
  1917. if (this === value ||
  1918. value instanceof Jyo.Shader &&
  1919. this.getHashCode() === value.getHashCode() &&
  1920. this.object === value.object) {
  1921. return true;
  1922. }
  1923. return false;
  1924. },
  1925. destroy: function () {
  1926. /// <summary>销毁对象</summary>
  1927. if (this.gl) {
  1928. this.gl.deleteShader(this.object);
  1929. }
  1930. this.object = null;
  1931. delete this.object;
  1932. }
  1933. }); Jyo.Audio = function () {
  1934. /// <summary>音频类</summary>
  1935. /// <returns type="Jyo.Audio"></returns>
  1936. // 具体对象
  1937. this.object = null;
  1938. };
  1939. Jyo.Audio.prototype = new Jyo.Object({
  1940. // 指示可用加载器
  1941. useLoader: "Audio",
  1942. bind: function (renderer, audio) {
  1943. /// <summary>绑定具体对象到托管对象</summary>
  1944. /// <param name="renderer" type="Jyo.Renderer">绑定的渲染器</param>
  1945. /// <param name="audio" type="Audio">要绑定的具体对象</param>
  1946. this.object = audio;
  1947. },
  1948. play: function () {
  1949. /// <summary>开始播放</summary>
  1950. if (this.object != null) {
  1951. this.object.play();
  1952. }
  1953. },
  1954. pause: function () {
  1955. /// <summary>暂停音乐</summary>
  1956. if (this.object != null) {
  1957. this.object.pause();
  1958. }
  1959. },
  1960. stop: function () {
  1961. /// <summary>停止播放音乐</summary>
  1962. if (this.object != null) {
  1963. this.object.pause();
  1964. this.reset();
  1965. }
  1966. },
  1967. getHashCode: function () {
  1968. /// <summary>返回此材质的哈希代码</summary>
  1969. /// <returns type="Number">一个指定此材质的哈希代码的整数</returns>
  1970. return 113;
  1971. },
  1972. equals: function (value) {
  1973. /// <summary>测试两个音频是否相等</summary>
  1974. /// <param name="value" type="Jyo.Audio">要进行比较的Jyo.Audio</param>
  1975. /// <returns type="Boolean"></returns>
  1976. if (this === value ||
  1977. value instanceof Jyo.Audio &&
  1978. this.getHashCode() === value.getHashCode() &&
  1979. this.object === value.object) {
  1980. return true;
  1981. }
  1982. return false;
  1983. },
  1984. destroy: function () {
  1985. /// <summary>销毁对象</summary>
  1986. this.stop();
  1987. this.object = null;
  1988. delete this.object;
  1989. }
  1990. }); Jyo.Timer = function () {
  1991. /// <summary>计时器类</summary>
  1992. /// <returns type="Jyo.Timer"></returns>
  1993. Jyo.Timer.constructor.apply(this, arguments);
  1994. };
  1995. // 计时器列表
  1996. Jyo.Timer.list = [];
  1997. // 检测计时器
  1998. Jyo.Timer.checkTimer = null;
  1999. Jyo.Timer.constructor = Jyo.Overload().
  2000. add(null, function () {
  2001. /// <summary>计时器对象构造函数</summary>
  2002. /// <returns type="Jyo.Timer"></returns>
  2003. this.interval = 0;
  2004. this.tick = null;
  2005. }).
  2006. add("Function, Number", function (callback, interval) {
  2007. /// <summary>计时器对象构造函数</summary>
  2008. /// <param name="callback" type="Function">回调函数</param>
  2009. /// <param name="interval" type="Number">间隔时间</param>
  2010. /// <returns type="Jyo.Timer"></returns>
  2011. var _this = this;
  2012. Jyo.Timer.call(this);
  2013. this.interval = interval;
  2014. this.tick = callback;
  2015. }).
  2016. add("Function, String", function (callback, expression) {
  2017. /// <summary>计时器对象构造函数</summary>
  2018. /// <param name="callback" type="Function">回调函数</param>
  2019. /// <param name="etaExpression" type="String">η表达式</param>
  2020. /// <returns type="Jyo.Timer"></returns>
  2021. this.beginTime = 0;
  2022. this.interval = expression;
  2023. this.tick = callback;
  2024. var t = this.time = {
  2025. expression: expression,
  2026. h: null,
  2027. m: null,
  2028. s: null
  2029. };
  2030. var arr = expression.split(" ");
  2031. var rexCheck = /(\d+~\d+|\d+-\d+|\d+[,\d+]+|\d+\/\d+|\d+|\*)/;
  2032. if (arr.length != 3 || !rexCheck.test(arr[0]) || !rexCheck.test(arr[1]) || !rexCheck.test(arr[2])) {
  2033. throw new Error("Invalid expression");
  2034. }
  2035. if (arr[2].indexOf(",") >= 0) {
  2036. t.h = arr[2].split(",");
  2037. } else {
  2038. t.h = [arr[2]];
  2039. }
  2040. if (arr[1].indexOf(",") >= 0) {
  2041. t.m = arr[1].split(",");
  2042. } else {
  2043. t.m = [arr[1]];
  2044. }
  2045. if (arr[0].indexOf(",") >= 0) {
  2046. t.s = arr[0].split(",");
  2047. } else {
  2048. t.s = [arr[0]];
  2049. }
  2050. });
  2051. Jyo.Timer.prototype = new Jyo.Object({
  2052. start: function () {
  2053. /// <summary>开启计时器</summary>
  2054. if (this.tick == null) return;
  2055. if (!isNaN(this.interval)) {
  2056. var _this = this;
  2057. this.time = setInterval(function () {
  2058. if (_this.interval != _this.time.interval) {
  2059. _this.stop();
  2060. _this.start();
  2061. }
  2062. _this.tick();
  2063. }, this.interval);
  2064. this.time.interval = this.interval;
  2065. return;
  2066. }
  2067. this.beginTime = new Date().getTime();
  2068. Jyo.Timer.list.push(this);
  2069. if (Jyo.Timer.checkTimer == null) {
  2070. Jyo.Timer.checkTimer = setInterval(function () {
  2071. var list = Jyo.Timer.list;
  2072. var currentTime = new Date().getTime();
  2073. for (var i = list.length; i--;) {
  2074. list[i].run(new Date(currentTime - list[i].beginTime));
  2075. }
  2076. }, 1000);
  2077. }
  2078. },
  2079. stop: function () {
  2080. /// <summary>停止计时器</summary>
  2081. if (!isNaN(this.interval)) {
  2082. var _this = this;
  2083. clearInterval(this.time);
  2084. this.time = null;
  2085. return;
  2086. }
  2087. var list = Jyo.Timer.list;
  2088. for (var i = list.length; i--;) {
  2089. if (list[i] == this) {
  2090. Jyo.Timer.list = list.remove(i);
  2091. break;
  2092. }
  2093. }
  2094. if (Jyo.Timer.list.length == 0) {
  2095. clearInterval(Jyo.Timer.checkTimer);
  2096. Jyo.Timer.checkTimer = null;
  2097. }
  2098. this.beginTime = 0;
  2099. },
  2100. run: function (intervalTime) {
  2101. /// <summary>检查是否可以触发函数</summary>
  2102. /// <param name="intervalTime" type="Date">间隔时间</param>
  2103. if (this.time.expression != this.interval) {
  2104. Jyo.Time.call(this.callback, this.expression);
  2105. }
  2106. var hourPass = false,
  2107. minutePass = false,
  2108. secondPass = false;
  2109. if (this.check(this.time.h, intervalTime.getHours() + intervalTime.getTimezoneOffset() / 60)) hourPass = true;
  2110. if (this.check(this.time.m, intervalTime.getMinutes())) minutePass = true;
  2111. if (this.check(this.time.s, intervalTime.getSeconds() - 1)) secondPass = true;
  2112. if (hourPass && minutePass && secondPass) {
  2113. this.tick();
  2114. }
  2115. },
  2116. check: function (set, current) {
  2117. /// <summary>检查是否可以触发</summary>
  2118. /// <param name="set" type="String">设置的计时器</param>
  2119. /// <param name="current" type="Number">当前间隔时间</param>
  2120. /// <returns type="Boolean"></returns>
  2121. var strs = null;
  2122. if (set == "*") return true;
  2123. if (/(\d+)/.test(set) && set == current) return true;
  2124. if (/(\d+-\d+)/.test(set)) {
  2125. strs = set[0].split("-");
  2126. if (current >= strs[0] && current <= strs[1]) {
  2127. return true;
  2128. }
  2129. }
  2130. if (/(\d+\/\d+)/.test(set)) {
  2131. strs = set[0].split("/");
  2132. if (current >= strs[0] && (current - strs[0]) % strs[1] == 0) {
  2133. return true;
  2134. }
  2135. }
  2136. if (/\d+[,\d+]+/.test(set)) {
  2137. for (var i = set.length; i--;) {
  2138. if (set[i] == current.toString()) return true;
  2139. }
  2140. }
  2141. return false;
  2142. },
  2143. getHashCode: function () {
  2144. /// <summary>返回此矩形的哈希代码</summary>
  2145. /// <returns type="Number">一个指定此矩形的哈希代码的整数</returns>
  2146. return 120;
  2147. },
  2148. equals: function (value) {
  2149. /// <summary>测试两个计时器是否相等</summary>
  2150. /// <param name="value" type="Jyo.Timer">要进行比较的Jyo.Timer</param>
  2151. /// <returns type="Boolean"></returns>
  2152. if (this === value ||
  2153. value instanceof Jyo.Timer &&
  2154. this.getHashCode() === value.getHashCode() &&
  2155. this.interval === value.interval &&
  2156. this.tick === value.tick) {
  2157. return true;
  2158. }
  2159. return false;
  2160. }
  2161. }); Jyo.Content = function () {
  2162. /// <summary>内容管理器类</summary>
  2163. /// <returns type="Jyo.Content"></returns>
  2164. // 要加载的文件根路径
  2165. this.rootDirectory = "";
  2166. Jyo.Content.constructor.apply(this, arguments);
  2167. };
  2168. Jyo.Content.constructor = Jyo.Overload().
  2169. add("Jyo.Renderer", function (renderer) {
  2170. /// <summary>内容管理器构造函数</summary>
  2171. /// <param name="renderer" type="Jyo.Renderer">要绑定到的渲染器对象</param>
  2172. /// <returns type="Jyo.Content"></returns>
  2173. // 同步加载中数量
  2174. this.loadNum = 0;
  2175. // 加载完成数量
  2176. this.loadDoneNum = 0;
  2177. // 绑定到的渲染器
  2178. this.renderer = renderer;
  2179. }).
  2180. add("Jyo.Renderer, String", function (renderer, rootDirectory) {
  2181. /// <summary>内容管理器构造函数</summary>
  2182. /// <param name="renderer" type="Jyo.Renderer">要绑定到的渲染器对象</param>
  2183. /// <param name="rootDirectory" type="String">要加载的文件根路径</param>
  2184. /// <returns type="Jyo.Content"></returns>
  2185. // 路径检测
  2186. if (rootDirectory.lastIndexOf("/") != rootDirectory.length - 1) {
  2187. rootDirectory += "/";
  2188. }
  2189. // 设置默认加载路径
  2190. this.rootDirectory = rootDirectory;
  2191. Jyo.Content.call(this, renderer);
  2192. });
  2193. Jyo.Content.prototype = new Jyo.Object({
  2194. load: Jyo.Overload().
  2195. add("Object, String", function (object, filename) {
  2196. /// <summary>加载文件</summary>
  2197. /// <param name="object" type="Object">要绑定到的对象</param>
  2198. /// <param name="filename" type="String">要加载的文件名</param>
  2199. this.load(object, filename, function () { });
  2200. }).
  2201. add("Object, String, Function", function (object, filename, callback) {
  2202. /// <summary>加载文件</summary>
  2203. /// <param name="object" type="Object">要绑定到的对象</param>
  2204. /// <param name="filename" type="String">要加载的文件名</param>
  2205. /// <param name="callback" type="Function">加载完成后处理函数</param>
  2206. if (object.object) return;
  2207. var _this = this;
  2208. // 获取文件后缀名
  2209. var extName = /\.([^\.]+)$/.exec(filename)[1].trim().toLowerCase().split("?")[0];
  2210. // 是否为网络资源
  2211. var isNetworkResources = false;
  2212. if (filename.indexOf("//") == 0 ||
  2213. filename.indexOf("http://") == 0 ||
  2214. filename.indexOf("https://") == 0) {
  2215. isNetworkResources = true;
  2216. }
  2217. if (typeof object.useLoader != "undefined") {
  2218. this.loadNum++;
  2219. var loader = null;
  2220. for (var i in Jyo.Content) {
  2221. loader = Jyo.Content[i];
  2222. if (typeof loader.supportList != "undefined") {
  2223. for (var extIndex = loader.supportList.length; extIndex--;) {
  2224. if (extName == loader.supportList[extIndex] && object.useLoader == loader.type) {
  2225. loader.load(this, object, (isNetworkResources ? "" : this.rootDirectory + "/") + filename, callback);
  2226. return;
  2227. }
  2228. }
  2229. }
  2230. }
  2231. throw new Error("\"" + extName + "\" file does not support the import");
  2232. } else {
  2233. throw new Error("Does not support the type of file to load");
  2234. }
  2235. }).
  2236. add("Object, String, Object", function (object, filename, loader) {
  2237. /// <summary>加载文件</summary>
  2238. /// <param name="object" type="Object">要绑定到的对象</param>
  2239. /// <param name="filename" type="String">要加载的文件名</param>
  2240. /// <param name="loader" type="Function">自定义加载器</param>
  2241. if (object.object) return;
  2242. var _this = this;
  2243. // 获取文件后缀名
  2244. var extName = /\.([^\.]+)$/.exec(filename)[1].trim().toLowerCase().split("?")[0];
  2245. // 是否为网络资源
  2246. var isNetworkResources = false;
  2247. if (filename.indexOf("//") == 0 ||
  2248. filename.indexOf("http://") == 0 ||
  2249. filename.indexOf("https://") == 0) {
  2250. isNetworkResources = true;
  2251. }
  2252. if (typeof object.useLoader != "undefined") {
  2253. this.loadNum++;
  2254. if (typeof loader.supportList != "undefined") {
  2255. for (var extIndex = loader.supportList.length; extIndex--;) {
  2256. if (extName == loader.supportList[extIndex] && object.useLoader == loader.type) {
  2257. loader.load(this, object, (isNetworkResources ? "" : this.rootDirectory + "/") + filename);
  2258. return;
  2259. }
  2260. }
  2261. }
  2262. throw new Error("\"" + extName + "\" file does not support the import");
  2263. } else {
  2264. throw new Error("Does not support the type of file to load");
  2265. }
  2266. }),
  2267. isLoading: function () {
  2268. /// <summary>指示是否已加载完成</summary>
  2269. /// <returns type="Boolean"></returns>
  2270. if (this.loadNum > this.loadDoneNum) {
  2271. return true;
  2272. }
  2273. return false;
  2274. },
  2275. getHashCode: function () {
  2276. /// <summary>返回此内容管理器的哈希代码</summary>
  2277. /// <returns type="Number">一个指定此内容管理器的哈希代码的整数</returns>
  2278. return this.renderer.getHashCode() ^ 10;
  2279. },
  2280. equals: function (value) {
  2281. /// <summary>测试两个内容管理器是否相等</summary>
  2282. /// <param name="value" type="Jyo.Content">要进行比较的Jyo.Content</param>
  2283. /// <returns type="Boolean"></returns>
  2284. if (this === value ||
  2285. value instanceof Jyo.Content &&
  2286. this.getHashCode() === value.getHashCode() &&
  2287. this.rootDirectory === value.rootDirectory &&
  2288. this.loadNum === value.loadNum &&
  2289. this.loadDoneNum === value.loadDoneNum) {
  2290. return true;
  2291. }
  2292. return false;
  2293. }
  2294. }); Jyo.Game = function () {
  2295. /// <summary>游戏类</summary>
  2296. /// <field name="content" type="Jyo.Content">内容管理器对象</field>
  2297. /// <field name="touch" type="Array">触摸列表</field>
  2298. /// <field name="mouse" type="Jyo.Mouse">鼠标对象</field>
  2299. /// <field name="isFixedTimeStep" type="Boolean">是否使用固定时间步长</field>
  2300. /// <field name="targetElapsedTime" type="Number">当isFixedTimeStep为true时Update调用间的目标时间</field>
  2301. /// <field name="renderer" type="Jyo.Renderer">渲染器对象</field>
  2302. /// <returns type="Jyo.Game"></returns>
  2303. Jyo.Game.constructor.apply(this, arguments);
  2304. };
  2305. Jyo.Game.constructor = Jyo.Overload().
  2306. add("String", function (elementId) {
  2307. /// <summary>游戏构造函数</summary>
  2308. /// <param name="elementId" type="String">元素id</param>
  2309. /// <returns type="Jyo.Game"></returns>
  2310. // 是否使用固定时间步长
  2311. this.isFixedTimeStep = false;
  2312. // 当isFixedTimeStep为true时Update调用间的目标时间
  2313. this.targetElapsedTime = 30;
  2314. if (typeof this.renderer == "undefined") {
  2315. // 渲染器
  2316. this.renderer = new Jyo.Renderer(elementId);
  2317. }
  2318. // 内容管理器
  2319. this.content = new Jyo.Content(this.renderer);
  2320. // 触摸列表
  2321. this.touch = new Jyo.Touch(this.renderer);
  2322. // 鼠标对象
  2323. this.mouse = new Jyo.Mouse(this.renderer);
  2324. // 当前状态
  2325. this._currentStatus = null;
  2326. // 最后一次调用update的时间
  2327. this._lastUpdateTime = Date.now();
  2328. // 最后一此调用draw的时间
  2329. this._lastDrawTime = Date.now();
  2330. // 游戏主计时器
  2331. this._mainTimer = null;
  2332. // 调用update的计时器
  2333. this._updateTimer = null;
  2334. }).
  2335. add("String, String", function (elementId, assign) {
  2336. /// <summary>游戏构造函数</summary>
  2337. /// <param name="elementId" type="String">元素id</param>
  2338. /// <param name="assign" type="String" optional="true">指定使用的渲染技术,可选如下:&#10;WebGL&#10;Canvas&#10;Svg&#10;Css&#10;VML -> (IE专有,不推荐)</param>
  2339. /// <returns type="Jyo.Game"></returns>
  2340. // 渲染器
  2341. this.renderer = new Jyo.Renderer(elementId, assign);
  2342. Jyo.Game.call(this, elementId);
  2343. });
  2344. Jyo.Game.prototype = new Jyo.Object({
  2345. run: function () {
  2346. /// <summary>调用该方法可以初始化游戏、开始循环运行游戏,并开始处理游戏的事件</summary>
  2347. var _this = this;
  2348. if (this.isFixedTimeStep && status.update) {
  2349. this._updateTimer = setInterval(function () {
  2350. !_this.isPause && status.update(Date.now());
  2351. }, this.targetElapsedTime);
  2352. }
  2353. function renderLoop(gameTime) {
  2354. gameTime = gameTime | 0;
  2355. var status = _this._currentStatus;
  2356. if (status && !_this.isPause) {
  2357. if (_this.content.isLoading()) {
  2358. status.loadingScreen && status.loadingScreen(gameTime);
  2359. } else {
  2360. !_this.isFixedTimeStep && status.update && status.update(gameTime);
  2361. status.draw && status.draw(gameTime);
  2362. }
  2363. }
  2364. _this._mainTimer = window.requestAnimationFrame(renderLoop);
  2365. };
  2366. renderLoop(Date.now());
  2367. },
  2368. exit: function () {
  2369. /// <summary>退出游戏</summary>
  2370. cancelAnimationFrame(this._mainTimer);
  2371. if (this._updateTimer) {
  2372. clearInterval(this._updateTimer);
  2373. }
  2374. this._currentStatus && this._currentStatus.unload && this._currentStatus.unload();
  2375. this.renderer.clear();
  2376. this._currentStatus = null;
  2377. },
  2378. useStatus: function (status) {
  2379. /// <summary>使用新状态</summary>
  2380. /// <param name="status" type="Jyo.Status">状态对象</param>
  2381. if (this._currentStatus) {
  2382. this._currentStatus.unload && this._currentStatus.unload();
  2383. this._currentStatus.using = false;
  2384. delete this.touch.ontouchstart;
  2385. delete this.touch.ontouchmove;
  2386. delete this.touch.ontouchend;
  2387. }
  2388. this.renderer.clear();
  2389. if (!(status instanceof Jyo.Status)) {
  2390. this._currentStatus = null;
  2391. } else {
  2392. status.load && status.load();
  2393. this._currentStatus = status;
  2394. this._currentStatus.using = true;
  2395. }
  2396. }
  2397. }); Jyo.Mouse = function () {
  2398. /// <summary>鼠标类</summary>
  2399. /// <returns type="Jyo.Mouse"></returns>
  2400. Jyo.Mouse.constructor.apply(this, arguments);
  2401. };
  2402. Jyo.Mouse.constructor = Jyo.Overload().
  2403. add("Jyo.Renderer", function (renderer) {
  2404. // 与之有关的渲染器对象
  2405. this.renderer = renderer;
  2406. // 当前鼠标监听的元素
  2407. this.element = renderer.domElement;
  2408. // 是否已经被锁定
  2409. this.isLocked = false;
  2410. // 是否按下了鼠标左键
  2411. this.leftButton = false;
  2412. // 是否按下了鼠标右键
  2413. this.rightButton = false;
  2414. // 是否按下了鼠标中键
  2415. this.middleButton = false;
  2416. // 鼠标当前X坐标
  2417. this.x = 0;
  2418. // 鼠标当前Y坐标
  2419. this.y = 0;
  2420. this.clear = function () {
  2421. /// <summary>重置鼠标坐标</summary>
  2422. this.x = 0;
  2423. this.y = 0;
  2424. };
  2425. this._bind();
  2426. });
  2427. Jyo.Mouse.prototype = new Jyo.Object({
  2428. _bind: function () {
  2429. /// <summary>绑定事件</summary>
  2430. var _this = this;
  2431. var el = this.element;
  2432. // 绑定鼠标锁定事件
  2433. document.addEventListener("pointerlockchange", function () { _this._lockChange(); }, false);
  2434. document.addEventListener(Jyo.prefix.lowercase + "pointerlockchange", function () { _this._lockChange(); }, false);
  2435. // 监听鼠标按下事件
  2436. el.addEventListener("mousedown", function (e) {
  2437. _this._updateLocation(e);
  2438. _this._updateState(e, true);
  2439. });
  2440. // 监听鼠标移动事件
  2441. el.addEventListener("mousemove", function (e) {
  2442. _this._updateLocation(e);
  2443. });
  2444. // 监听鼠标抬起事件
  2445. el.addEventListener("mouseup", function (e) {
  2446. _this._updateLocation(e);
  2447. _this._updateState(e, false);
  2448. });
  2449. },
  2450. lock: function (isLock) {
  2451. /// <summary>锁定鼠标</summary>
  2452. /// <param name="isLock" type="Boolean">是否锁定</param>
  2453. /// <returns type="Boolean"></returns>
  2454. if (!this.element.requestPointerLock || !document.exitPointerLock) {
  2455. return false;
  2456. }
  2457. if (isLock || typeof isLock == "undefined") {
  2458. this.element.requestPointerLock();
  2459. Jyo.Mouse.lockObject = this;
  2460. } else {
  2461. document.exitPointerLock();
  2462. return false;
  2463. }
  2464. return true;
  2465. },
  2466. _lockChange: function () {
  2467. /// <summary>锁定状态被更改</summary>
  2468. this.isLocked = document.pointerLockElement == this.element ||
  2469. document[Jyo.prefix.lowercase + "PointerLockElement"] == this.element;
  2470. if (this == Jyo.Mouse.lockObject && !this.isLocked) {
  2471. Jyo.Mouse.lockObject = null;
  2472. }
  2473. },
  2474. _updateLocation: function (e) {
  2475. /// <summary>更新鼠标位置</summary>
  2476. /// <param name="e" type="MouseEvent">鼠标事件对象</param>
  2477. var el = this.element,
  2478. styleWidth = this.renderer.width,
  2479. styleHeight = this.renderer.height;
  2480. if (this.isLocked) {
  2481. // 鼠标被锁定时设置位置为偏移
  2482. this.x = e.movementX || e[Jyo.prefix.lowercase + "MovementX"] || 0;
  2483. this.y = e.movementY || e[Jyo.prefix.lowercase + "MovementY"] || 0;
  2484. return;
  2485. }
  2486. this.x = e.offsetX || e.layerX;
  2487. this.y = e.offsetY || e.layerY;
  2488. if (styleWidth) this.x *= styleWidth / el.clientWidth;
  2489. if (styleHeight) this.y *= styleHeight / el.clientHeight;
  2490. this.x |= 0;
  2491. this.y |= 0;
  2492. },
  2493. _updateState: function (e, isDown) {
  2494. /// <summary>更新按键状态</summary>
  2495. /// <param name="e" type="MouseEvent">鼠标事件状态</param>
  2496. /// <param name="isDown" type="Boolean">按下状态</param>
  2497. if (!+"\v1") {
  2498. switch (e.button) {
  2499. case 1: this.leftButton = isDown; break;
  2500. case 2: this.rightButton = isDown; break;
  2501. case 4: this.middleButton = isDown; break;
  2502. }
  2503. }
  2504. else {
  2505. switch (e.which) {
  2506. case 1: this.leftButton = isDown; break;
  2507. case 2: this.middleButton = isDown; break;
  2508. case 3: this.rightButton = isDown; break;
  2509. }
  2510. }
  2511. }
  2512. }); Jyo.Touch = function () {
  2513. /// <summary>触摸类</summary>
  2514. /// <returns type="Jyo.Touch"></returns>
  2515. Jyo.Touch.constructor.apply(this, arguments);
  2516. };
  2517. Jyo.Touch.constructor = Jyo.Overload().
  2518. add("Jyo.Renderer", function (renderer) {
  2519. // 与之有关的渲染器对象
  2520. this.renderer = renderer;
  2521. // 当前触摸监听的元素
  2522. this.element = renderer.domElement;
  2523. // 检查是否支持多点触摸
  2524. this.supportMultipleTouches = function () {
  2525. var ua = navigator.userAgent.toLowerCase();
  2526. if (ua.indexOf("android") > 0 && parseFloat(((ua.split("android ")[1] || "").split(";")[0])) <= 2.3) {
  2527. return false;
  2528. } else {
  2529. return true;
  2530. }
  2531. }();
  2532. // 触摸列表
  2533. this.list = [];
  2534. this._bind();
  2535. });
  2536. Jyo.Touch.prototype = new Jyo.Object({
  2537. _bind: function () {
  2538. /// <summary>绑定事件</summary>
  2539. var _this = this;
  2540. var el = this.element;
  2541. // 监听触摸按下事件
  2542. el.addEventListener("touchstart", function (e) {
  2543. var changeList = [];
  2544. var x = 0,
  2545. y = 0;
  2546. for (var i = 0; i < e.changedTouches.length; i++) {
  2547. if (_this.renderer.mode == "Css") {
  2548. var scaling = 1 / _this.renderer.scaling;
  2549. x = e.changedTouches[i].pageX * scaling,
  2550. y = e.changedTouches[i].pageY * scaling;
  2551. } else {
  2552. x = ((e.changedTouches[i].pageX - el.offsetLeft) * (_this.renderer.width / el.clientWidth)) | 0,
  2553. y = ((e.changedTouches[i].pageY - el.offsetTop) * (_this.renderer.height / el.clientHeight)) | 0;
  2554. }
  2555. var object = {
  2556. id: e.changedTouches[i].identifier,
  2557. x: x,
  2558. y: y
  2559. };
  2560. _this.list.push(object);
  2561. changeList.push(object);
  2562. }
  2563. typeof _this.ontouchstart != "undefined" && _this.ontouchstart(changeList);
  2564. });
  2565. // 监听触摸移动事件
  2566. el.addEventListener("touchmove", function (e) {
  2567. (typeof event != "undefined" ? event : e).preventDefault();
  2568. var changeList = [];
  2569. var x = 0,
  2570. y = 0;
  2571. for (var i = 0; i < _this.list.length; i++) {
  2572. for (var n = 0; n < e.changedTouches.length; n++) {
  2573. if (_this.renderer.mode == "Css") {
  2574. var scaling = 1 / _this.renderer.scaling;
  2575. x = e.changedTouches[n].pageX * scaling,
  2576. y = e.changedTouches[n].pageY * scaling;
  2577. } else {
  2578. x = ((e.changedTouches[n].pageX - el.offsetLeft) * (_this.renderer.width / el.clientWidth)) | 0,
  2579. y = ((e.changedTouches[n].pageY - el.offsetTop) * (_this.renderer.height / el.clientHeight)) | 0;
  2580. }
  2581. if (e.changedTouches[n].identifier == _this.list[i].id) {
  2582. _this.list[i].x = x,
  2583. _this.list[i].y = y;
  2584. changeList.push(_this.list[i]);
  2585. }
  2586. }
  2587. }
  2588. typeof _this.ontouchmove != "undefined" && _this.ontouchmove(changeList);
  2589. });
  2590. function end(e) {
  2591. var changeList = [];
  2592. for (var i = 0; i < _this.list.length; i++) {
  2593. for (var n = 0; n < e.changedTouches.length; n++) {
  2594. if (e.changedTouches[n].identifier == _this.list[i].id) {
  2595. changeList.push(_this.list[i]);
  2596. _this.list = function (l, i) {
  2597. return (i < 0) ? l : l.slice(0, i).concat(l.slice(i + 1, l.length))
  2598. }(_this.list, i);
  2599. }
  2600. }
  2601. }
  2602. typeof _this.ontouchend != "undefined" && _this.ontouchend(changeList);
  2603. }
  2604. // 监听触摸抬起事件
  2605. el.addEventListener("touchend", end);
  2606. // 监听触摸取消事件
  2607. el.addEventListener('touchcancel', end);
  2608. }
  2609. }); Jyo.Content.Shader = new Jyo.Object({
  2610. // 指示加载器类型
  2611. type: "Shader",
  2612. // 指示支持的格式
  2613. supportList: ["vs", "fs", "glvs", "glfs"],
  2614. load: function (content, object, filename, callback) {
  2615. /// <summary>加载</summary>
  2616. /// <param name="content" type="Jyo.Content">内容管理器对象</param>
  2617. /// <param name="object" type="Object">要绑定到的对象</param>
  2618. /// <param name="filename" type="String">文件名</param>
  2619. /// <param name="callback" type="Function" optional="true">加载完成后的处理函数</param>
  2620. // 获取文件后缀名
  2621. var extName = /\.([^\.]+)$/.exec(filename)[1].trim().toLowerCase();
  2622. var type = "";
  2623. // 判断类型
  2624. if (extName == "vs" || extName == "glvs") {
  2625. type = "VERTEX_SHADER";
  2626. } else {
  2627. type = "FRAGMENT_SHADER";
  2628. }
  2629. if (content.renderer.mode == "WebGL") {
  2630. // 检测是否绑定到WebGL渲染器
  2631. var gl = content.renderer.context;
  2632. }
  2633. Jyo.loadFile(filename, true, null, function (str) {
  2634. if (typeof gl != "undefined") {
  2635. var shaderObj = gl.createShader(gl[type]);
  2636. gl.shaderSource(shaderObj, str);
  2637. gl.compileShader(shaderObj);
  2638. // 检查错误
  2639. var error = gl.getError();
  2640. if (error !== gl.NO_ERROR && error !== gl.CONTEXT_LOST_WEBGL) {
  2641. throw new Error(error);
  2642. }
  2643. if (!gl.getShaderParameter(shaderObj, gl.COMPILE_STATUS)) {
  2644. throw new Error("Shader \"" + filename + "\" compile error" + ":\r\n" + gl.getShaderInfoLog(shaderObj));
  2645. }
  2646. object.bind(content.renderer, shaderObj);
  2647. content.loadDoneNum++;
  2648. callback && callback(object);
  2649. }
  2650. });
  2651. },
  2652. getHashCode: function () {
  2653. /// <summary>返回此加载器的哈希代码</summary>
  2654. /// <returns type="Number">一个指定此加载器的哈希代码的整数</returns>
  2655. return this.supportList.length ^ 1001;
  2656. },
  2657. equals: function (value) {
  2658. /// <summary>测试两个加载器是否相等</summary>
  2659. /// <param name="value" type="Jyo.Object">要进行比较的Jyo.Object</param>
  2660. /// <returns type="Boolean"></returns>
  2661. if (this === value ||
  2662. this.getHashCode() === value.getHashCode() &&
  2663. this.type === value.type) {
  2664. return true;
  2665. }
  2666. return false;
  2667. }
  2668. }); Jyo.Content.Texture = new Jyo.Object({
  2669. // 指示加载器类型
  2670. type: "Texture",
  2671. // 指示支持的格式
  2672. supportList: ["bmp", "png", "jpg", "jpeg", "gif"],
  2673. load: function (content, object, filename, callback) {
  2674. /// <summary>加载</summary>
  2675. /// <param name="content" type="Jyo.Content">内容管理器对象</param>
  2676. /// <param name="object" type="Object">要绑定到的对象</param>
  2677. /// <param name="filename" type="String">文件名</param>
  2678. /// <param name="callback" type="Function" optional="true">加载完成后的处理函数</param>
  2679. var img = new Image();
  2680. img.onerror = function () {
  2681. throw new Error("File \"" + filename + "\" failed to load");
  2682. };
  2683. img.src = filename;
  2684. if (img.complete) {
  2685. object.bind(content.renderer, img);
  2686. content.loadDoneNum++;
  2687. callback && callback(object);
  2688. } else {
  2689. img.onload = function () {
  2690. object.bind(content.renderer, this);
  2691. content.loadDoneNum++;
  2692. callback && callback(object);
  2693. this.onload = null;
  2694. };
  2695. }
  2696. },
  2697. getHashCode: function () {
  2698. /// <summary>返回此加载器的哈希代码</summary>
  2699. /// <returns type="Number">一个指定此加载器的哈希代码的整数</returns>
  2700. return this.supportList.length ^ 1002;
  2701. },
  2702. equals: function (value) {
  2703. /// <summary>测试两个加载器是否相等</summary>
  2704. /// <param name="value" type="Jyo.Object">要进行比较的Jyo.Object</param>
  2705. /// <returns type="Boolean"></returns>
  2706. if (this === value ||
  2707. this.getHashCode() === value.getHashCode() &&
  2708. this.type === value.type) {
  2709. return true;
  2710. }
  2711. return false;
  2712. }
  2713. }); Jyo.Content.Audio = new Jyo.Object({
  2714. // 指示加载器类型
  2715. type: "Audio",
  2716. // 指示支持的格式
  2717. supportList: ["mp3", "ogg", "wav", "aac"],
  2718. load: function (content, object, filename, callback) {
  2719. /// <summary>加载</summary>
  2720. /// <param name="content" type="Jyo.Content">内容管理器对象</param>
  2721. /// <param name="object" type="Object">要绑定到的对象</param>
  2722. /// <param name="filename" type="String">文件名</param>
  2723. /// <param name="callback" type="Function" optional="true">加载完成后的处理函数</param>
  2724. var audio = document.createElement("audio");
  2725. audio.setAttribute("preload", "preload");
  2726. audio.addEventListener("pause", function () {
  2727. object.isPlaying = false;
  2728. });
  2729. audio.addEventListener("play", function () {
  2730. object.isPlaying = true;
  2731. });
  2732. audio.addEventListener("ended", function () {
  2733. if (object.isLoop) {
  2734. //object.stop();
  2735. object.play();
  2736. }
  2737. });
  2738. audio.addEventListener("error", function (e) {
  2739. if (this.error.code == 4) {
  2740. object.bind(content.renderer, this);
  2741. content.loadDoneNum++;
  2742. callback && callback(object);
  2743. } else {
  2744. throw new Error("File \"" + filename + "\" failed to load");
  2745. }
  2746. });
  2747. audio.addEventListener("canplaythrough", function () {
  2748. object.bind(content.renderer, this);
  2749. content.loadDoneNum++;
  2750. callback && callback(object);
  2751. });
  2752. audio.reset = function () {
  2753. this.object.currentTime = 0;
  2754. };
  2755. audio.src = filename;
  2756. audio.load();
  2757. },
  2758. getHashCode: function () {
  2759. /// <summary>返回此加载器的哈希代码</summary>
  2760. /// <returns type="Number">一个指定此加载器的哈希代码的整数</returns>
  2761. return this.supportList.length ^ 1003;
  2762. },
  2763. equals: function (value) {
  2764. /// <summary>测试两个加载器是否相等</summary>
  2765. /// <param name="value" type="Jyo.Object">要进行比较的Jyo.Object</param>
  2766. /// <returns type="Boolean"></returns>
  2767. if (this === value ||
  2768. this.getHashCode() === value.getHashCode() &&
  2769. this.type === value.type) {
  2770. return true;
  2771. }
  2772. return false;
  2773. }
  2774. }); Jyo.Renderer.WebGL = function () {
  2775. // 添加渲染元素
  2776. this._addRenderElement("canvas");
  2777. // 获取上下文
  2778. this.context = Jyo.Renderer.WebGL.tryGetContext(this.canvas);
  2779. // 使WebGL上下文拥有Canvas2DApi
  2780. Jyo.Renderer.WebGL["2d"](this.context);
  2781. };
  2782. Jyo.Renderer.WebGL.isSupport = function () {
  2783. /// <summary>检测是否支持</summary>
  2784. /// <returns type="Boolean"></returns>
  2785. if (typeof HTMLCanvasElement.prototype.getContext == "undefined") {
  2786. return false;
  2787. }
  2788. if (Jyo.Renderer.WebGL.tryGetContext() != null) {
  2789. return true;
  2790. }
  2791. return false;
  2792. }
  2793. // 上下文列表
  2794. Jyo.Renderer.WebGL.contextList = ["webgl2", "experimental-webgl2", "webgl", "experimental-webgl", "webkit-3d", "moz-webgl", "3d"];
  2795. // 尝试获取上下文函数重载
  2796. Jyo.Renderer.WebGL.tryGetContext = Jyo.Overload().
  2797. add(null, function () {
  2798. /// <summary>尝试获取上下文对象</summary>
  2799. /// <returns type="WebGLRenderingContext"></returns>
  2800. var canvas = document.createElement("canvas");
  2801. return Jyo.Renderer.WebGL.tryGetContext(canvas);
  2802. }).
  2803. add("HTMLCanvasElement", function (canvas) {
  2804. /// <summary>尝试获取上下文对象</summary>
  2805. /// <param name="canvas" type="HTMLCanvasElement">画布对象</param>
  2806. /// <returns type="WebGLRenderingContext"></returns>
  2807. var list = Jyo.Renderer.WebGL.contextList;
  2808. var gl = null;
  2809. // 获取上下文
  2810. for (var i = 0; i < list.length && gl == null; i++) {
  2811. gl = canvas.getContext(list[i]);
  2812. }
  2813. return gl;
  2814. });
  2815. Jyo.Renderer.WebGL.prototype = new Jyo.Object({
  2816. mode: "WebGL",
  2817. clear: Jyo.Overload().
  2818. add(null, function () {
  2819. /// <summary>清空画布</summary>
  2820. var ctx = this.context;
  2821. ctx.clear(ctx.COLOR_BUFFER_BIT | ctx.DEPTH_BUFFER_BIT);
  2822. }).
  2823. add("Jyo.Color", function (color) {
  2824. /// <summary>清空画布</summary>
  2825. /// <param name="color" type="Jyo.Color">颜色对象</param>
  2826. var ctx = this.context;
  2827. ctx.clearColor(color.red / 255, color.green / 255, color.blue / 255, color.alpha);
  2828. this.clear();
  2829. }).
  2830. add("String", function (colorStr) {
  2831. /// <summary>清空画布</summary>
  2832. /// <param name="colorStr" type="String">颜色字符串值</param>
  2833. this.clear(new Jyo.Color(colorStr));
  2834. }),
  2835. begin: function () {
  2836. this.context.save();
  2837. },
  2838. end: function () {
  2839. this.context.restore();
  2840. },
  2841. fillRect: Jyo.Overload().
  2842. add("Jyo.Rectangle", function (rect) {
  2843. /// <summary>绘制实心矩形</summary>
  2844. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  2845. this.fillRect(rect.x, rect.y, rect.width, rect.height, "");
  2846. }).
  2847. add("Number, Number, Number, Number", function (x, y, width, height) {
  2848. /// <summary>绘制实心矩形</summary>
  2849. /// <param name="x" type="Number">起始X坐标</param>
  2850. /// <param name="y" type="Number">起始Y坐标</param>
  2851. /// <param name="width" type="Number">矩形宽度</param>
  2852. /// <param name="height" type="Number">矩形高度</param>
  2853. this.fillRect(x, y, width, height, "");
  2854. }).
  2855. add("Jyo.Rectangle, Jyo.Color", function (rect, color) {
  2856. /// <summary>绘制实心矩形</summary>
  2857. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  2858. /// <param name="color" type="Jyo.Color">颜色对象</param>
  2859. this.fillRect(rect.x, rect.y, rect.width, rect.height, color.toRgba());
  2860. }).
  2861. add("Number, Number, Number, Number, Jyo.Color", function (x, y, width, height, color) {
  2862. /// <summary>绘制实心矩形</summary>
  2863. /// <param name="x" type="Number">起始X坐标</param>
  2864. /// <param name="y" type="Number">起始Y坐标</param>
  2865. /// <param name="width" type="Number">矩形宽度</param>
  2866. /// <param name="height" type="Number">矩形高度</param>
  2867. /// <param name="color" type="Jyo.Color">颜色对象</param>
  2868. this.fillRect(x, y, width, height, color.toRgba());
  2869. }).
  2870. add("Jyo.Rectangle, String", function (rect, colorStr) {
  2871. /// <summary>绘制实心矩形</summary>
  2872. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  2873. /// <param name="colorStr" type="String">颜色字符串值</param>
  2874. this.fillRect(rect.x, rect.y, rect.width, rect.height, colorStr);
  2875. }).
  2876. add("Number, Number, Number, Number, String", function (x, y, width, height, colorStr) {
  2877. /// <summary>绘制实心矩形</summary>
  2878. /// <param name="x" type="Number">起始X坐标</param>
  2879. /// <param name="y" type="Number">起始Y坐标</param>
  2880. /// <param name="width" type="Number">矩形宽度</param>
  2881. /// <param name="height" type="Number">矩形高度</param>
  2882. /// <param name="colorStr" type="String">颜色字符串值</param>
  2883. ctx = this.context;
  2884. ctx.fillStyle = colorStr;
  2885. ctx.fillRect(x, y, width, height);
  2886. }),
  2887. drawRect: Jyo.Overload().
  2888. add("Jyo.Rectangle, Jyo.Color", function (rect, color) {
  2889. /// <summary>绘制空心矩形</summary>
  2890. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  2891. /// <param name="color" type="Jyo.Color">颜色对象</param>
  2892. this.drawRect(rect.x, rect.y, rect.width, rect.height, color.toRgba(), 1);
  2893. }).
  2894. add("Number, Number, Number, Number, Jyo.Color", function (x, y, width, height, color) {
  2895. /// <summary>绘制空心矩形</summary>
  2896. /// <param name="x" type="Number">起始X坐标</param>
  2897. /// <param name="y" type="Number">起始Y坐标</param>
  2898. /// <param name="width" type="Number">矩形宽度</param>
  2899. /// <param name="height" type="Number">矩形高度</param>
  2900. /// <param name="color" type="Jyo.Color">颜色对象</param>
  2901. this.drawRect(x, y, width, height, color.toRgba(), 1);
  2902. }).
  2903. add("Jyo.Rectangle, String", function (rect, colorStr) {
  2904. /// <summary>绘制空心矩形</summary>
  2905. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  2906. /// <param name="colorStr" type="String">颜色字符串值</param>
  2907. this.drawRect(rect.x, rect.y, rect.width, rect.height, colorStr, 1);
  2908. }).
  2909. add("Number, Number, Number, Number, String", function (x, y, width, height, colorStr) {
  2910. /// <summary>绘制空心矩形</summary>
  2911. /// <param name="x" type="Number">起始X坐标</param>
  2912. /// <param name="y" type="Number">起始Y坐标</param>
  2913. /// <param name="width" type="Number">矩形宽度</param>
  2914. /// <param name="height" type="Number">矩形高度</param>
  2915. /// <param name="colorStr" type="String">颜色字符串值</param>
  2916. this.drawRect(x, y, width, height, colorStr, 1);
  2917. }).
  2918. add("Jyo.Rectangle, Jyo.Color, Number", function (rect, color, lineWidth) {
  2919. /// <summary>绘制空心矩形</summary>
  2920. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  2921. /// <param name="color" type="Jyo.Color">颜色对象</param>
  2922. /// <param name="lineWidth" type="Number">线条宽度</param>
  2923. this.drawRect(rect.x, rect.y, rect.width, rect.height, color.toRgba(), lineWidth);
  2924. }).
  2925. add("Number, Number, Number, Number, Jyo.Color, Number", function (x, y, width, height, color, lineWidth) {
  2926. /// <summary>绘制空心矩形</summary>
  2927. /// <param name="x" type="Number">起始X坐标</param>
  2928. /// <param name="y" type="Number">起始Y坐标</param>
  2929. /// <param name="width" type="Number">矩形宽度</param>
  2930. /// <param name="height" type="Number">矩形高度</param>
  2931. /// <param name="color" type="Jyo.Color">颜色对象</param>
  2932. /// <param name="lineWidth" type="Number">线条宽度</param>
  2933. this.drawRect(x, y, width, height, color.toRgba(), lineWidth);
  2934. }).
  2935. add("Jyo.Rectangle, String, Number", function (rect, colorStr, lineWidth) {
  2936. /// <summary>绘制空心矩形</summary>
  2937. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  2938. /// <param name="colorStr" type="String">颜色字符串值</param>
  2939. /// <param name="lineWidth" type="Number">线条宽度</param>
  2940. this.drawRect(rect.x, rect.y, rect.width, rect.height, colorStr, lineWidth);
  2941. }).
  2942. add("Number, Number, Number, Number, String, Number", function (x, y, width, height, colorStr, lineWidth) {
  2943. /// <summary>绘制空心矩形</summary>
  2944. /// <param name="x" type="Number">起始X坐标</param>
  2945. /// <param name="y" type="Number">起始Y坐标</param>
  2946. /// <param name="width" type="Number">矩形宽度</param>
  2947. /// <param name="height" type="Number">矩形高度</param>
  2948. /// <param name="colorStr" type="String">颜色字符串值</param>
  2949. /// <param name="lineWidth" type="Number">线条宽度</param>
  2950. ctx = this.context;
  2951. ctx.lineWidth = lineWidth;
  2952. ctx.strokeStyle = colorStr;
  2953. ctx.strokeRect(x, y, width, height);
  2954. if (lineWidth > 1) {
  2955. this.drawRect(x + 1, y + 1, width - 2, height - 2, colorStr, lineWidth - 1);
  2956. }
  2957. }),
  2958. fillRoundRect: Jyo.Overload().
  2959. add("Jyo.Rectangle, Number", function (rect, radius) {
  2960. /// <summary>绘制实心圆角矩形</summary>
  2961. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  2962. /// <param name="radius" type="Number">圆角半径</param>
  2963. this.fillRoundRect(rect.x, rect.y, rect.width, rect.height, radius, String.empty);
  2964. }).
  2965. add("Jyo.Rectangle, Number, String", function (rect, radius, colorStr) {
  2966. /// <summary>绘制实心圆角矩形</summary>
  2967. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  2968. /// <param name="radius" type="Number">圆角半径</param>
  2969. /// <param name="colorStr" type="String">颜色字符串值</param>
  2970. this.fillRoundRect(rect.x, rect.y, rect.width, rect.height, radius, colorStr);
  2971. }).
  2972. add("Jyo.Rectangle, Number, Jyo.Color", function (rect, radius, color) {
  2973. /// <summary>绘制实心圆角矩形</summary>
  2974. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  2975. /// <param name="radius" type="Number">圆角半径</param>
  2976. /// <param name="color" type="Jyo.Color">颜色对象</param>
  2977. this.fillRoundRect(rect.x, rect.y, rect.width, rect.height, radius, color.toRgba());
  2978. }).
  2979. add("Number, Number, Number, Number, Number", function (x, y, width, height, radius) {
  2980. /// <summary>绘制实心圆角矩形</summary>
  2981. /// <param name="x" type="Number">起始X坐标</param>
  2982. /// <param name="y" type="Number">起始Y坐标</param>
  2983. /// <param name="width" type="Number">矩形宽度</param>
  2984. /// <param name="height" type="Number">矩形高度</param>
  2985. /// <param name="radius" type="Number">圆角半径</param>
  2986. this.fillRoundRect(x, y, width, height, radius, String.empty);
  2987. }).
  2988. add("Number, Number, Number, Number, Number, Jyo.Color", function (x, y, width, height, radius, color) {
  2989. /// <summary>绘制实心圆角矩形</summary>
  2990. /// <param name="x" type="Number">起始X坐标</param>
  2991. /// <param name="y" type="Number">起始Y坐标</param>
  2992. /// <param name="width" type="Number">矩形宽度</param>
  2993. /// <param name="height" type="Number">矩形高度</param>
  2994. /// <param name="radius" type="Number">圆角半径</param>
  2995. /// <param name="color" type="Jyo.Color">颜色对象</param>
  2996. this.fillRoundRect(x, y, width, height, radius, color.toRgba());
  2997. }).
  2998. add("Number, Number, Number, Number, Number, String", function (x, y, width, height, radius, colorStr) {
  2999. /// <summary>绘制实心矩形</summary>
  3000. /// <param name="x" type="Number">起始X坐标</param>
  3001. /// <param name="y" type="Number">起始Y坐标</param>
  3002. /// <param name="width" type="Number">矩形宽度</param>
  3003. /// <param name="height" type="Number">矩形高度</param>
  3004. /// <param name="radius" type="Number">圆角半径</param>
  3005. /// <param name="colorStr" type="String">颜色字符串值</param>
  3006. var ps = [];
  3007. ps.push(x, y + radius);
  3008. ps = ps.concat(Math.getBezierCurvePoints(x, y + height - radius, x, y + height, x + radius, y + height));
  3009. ps = ps.concat(Math.getBezierCurvePoints(x + width - radius, y + height, x + width, y + height, x + width, y + height - radius));
  3010. ps = ps.concat(Math.getBezierCurvePoints(x + width, y + radius, x + width, y, x + width - radius, y));
  3011. ps = ps.concat(Math.getBezierCurvePoints(x + radius, y, x, y, x, y + radius));
  3012. this.fillPolygon(ps, colorStr || "#000000");
  3013. }),
  3014. drawRoundRect: Jyo.Overload().
  3015. add("Jyo.Rectangle, Number", function (rect, radius) {
  3016. /// <summary>绘制实心圆角矩形</summary>
  3017. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  3018. /// <param name="radius" type="Number">圆角半径</param>
  3019. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, String.empty, 1);
  3020. }).
  3021. add("Jyo.Rectangle, Number, Number", function (rect, radius, lineWidth) {
  3022. /// <summary>绘制实心圆角矩形</summary>
  3023. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  3024. /// <param name="radius" type="Number">圆角半径</param>
  3025. /// <param name="lineWidth" type="Number">线段宽度</param>
  3026. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, String.empty, lineWidth);
  3027. }).
  3028. add("Jyo.Rectangle, Number, String", function (rect, radius, colorStr) {
  3029. /// <summary>绘制实心圆角矩形</summary>
  3030. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  3031. /// <param name="radius" type="Number">圆角半径</param>
  3032. /// <param name="colorStr" type="String">颜色字符串值</param>
  3033. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, colorStr, 1);
  3034. }).
  3035. add("Jyo.Rectangle, Number, String, Number", function (rect, radius, colorStr, lineWidth) {
  3036. /// <summary>绘制实心圆角矩形</summary>
  3037. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  3038. /// <param name="radius" type="Number">圆角半径</param>
  3039. /// <param name="colorStr" type="String">颜色字符串值</param>
  3040. /// <param name="lineWidth" type="Number">线段宽度</param>
  3041. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, colorStr, lineWidth);
  3042. }).
  3043. add("Jyo.Rectangle, Number, Jyo.Color", function (rect, radius, color) {
  3044. /// <summary>绘制实心圆角矩形</summary>
  3045. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  3046. /// <param name="radius" type="Number">圆角半径</param>
  3047. /// <param name="color" type="Jyo.Color">颜色对象</param>
  3048. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, color.toRgba(), 1);
  3049. }).
  3050. add("Jyo.Rectangle, Number, Jyo.Color, Number", function (rect, radius, color, lineWidth) {
  3051. /// <summary>绘制实心圆角矩形</summary>
  3052. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  3053. /// <param name="radius" type="Number">圆角半径</param>
  3054. /// <param name="color" type="Jyo.Color">颜色对象</param>
  3055. /// <param name="lineWidth" type="Number">线段宽度</param>
  3056. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, color.toRgba(), lineWidth);
  3057. }).
  3058. add("Number, Number, Number, Number, Number", function (x, y, width, height, radius) {
  3059. /// <summary>绘制实心圆角矩形</summary>
  3060. /// <param name="x" type="Number">起始X坐标</param>
  3061. /// <param name="y" type="Number">起始Y坐标</param>
  3062. /// <param name="width" type="Number">矩形宽度</param>
  3063. /// <param name="height" type="Number">矩形高度</param>
  3064. /// <param name="radius" type="Number">圆角半径</param>
  3065. this.drawRoundRect(x, y, width, height, radius, String.empty, 1);
  3066. }).
  3067. add("Number, Number, Number, Number, Number, Number", function (x, y, width, height, radius, lineWidth) {
  3068. /// <summary>绘制实心圆角矩形</summary>
  3069. /// <param name="x" type="Number">起始X坐标</param>
  3070. /// <param name="y" type="Number">起始Y坐标</param>
  3071. /// <param name="width" type="Number">矩形宽度</param>
  3072. /// <param name="height" type="Number">矩形高度</param>
  3073. /// <param name="radius" type="Number">圆角半径</param>
  3074. /// <param name="lineWidth" type="Number">线段宽度</param>
  3075. this.drawRoundRect(x, y, width, height, radius, String.empty, lineWidth);
  3076. }).
  3077. add("Number, Number, Number, Number, Number, Jyo.Color", function (x, y, width, height, radius, color) {
  3078. /// <summary>绘制实心圆角矩形</summary>
  3079. /// <param name="x" type="Number">起始X坐标</param>
  3080. /// <param name="y" type="Number">起始Y坐标</param>
  3081. /// <param name="width" type="Number">矩形宽度</param>
  3082. /// <param name="height" type="Number">矩形高度</param>
  3083. /// <param name="radius" type="Number">圆角半径</param>
  3084. /// <param name="color" type="Jyo.Color">颜色对象</param>
  3085. this.drawRoundRect(x, y, width, height, radius, color.toRgba(), 1);
  3086. }).
  3087. add("Number, Number, Number, Number, Number, Jyo.Color, Number", function (x, y, width, height, radius, color, lineWidth) {
  3088. /// <summary>绘制实心圆角矩形</summary>
  3089. /// <param name="x" type="Number">起始X坐标</param>
  3090. /// <param name="y" type="Number">起始Y坐标</param>
  3091. /// <param name="width" type="Number">矩形宽度</param>
  3092. /// <param name="height" type="Number">矩形高度</param>
  3093. /// <param name="radius" type="Number">圆角半径</param>
  3094. /// <param name="color" type="Jyo.Color">颜色对象</param>
  3095. /// <param name="lineWidth" type="Number">线段宽度</param>
  3096. this.drawRoundRect(x, y, width, height, radius, color.toRgba(), lineWidth);
  3097. }).
  3098. add("Number, Number, Number, Number, Number, String", function (x, y, width, height, radius, colorStr) {
  3099. /// <summary>绘制实心矩形</summary>
  3100. /// <param name="x" type="Number">起始X坐标</param>
  3101. /// <param name="y" type="Number">起始Y坐标</param>
  3102. /// <param name="width" type="Number">矩形宽度</param>
  3103. /// <param name="height" type="Number">矩形高度</param>
  3104. /// <param name="radius" type="Number">圆角半径</param>
  3105. /// <param name="colorStr" type="String">颜色字符串值</param>
  3106. this.drawRoundRect(x, y, width, height, radius, colorStr, 1);
  3107. }).
  3108. add("Number, Number, Number, Number, Number, String, Number", function (x, y, width, height, radius, colorStr, lineWidth) {
  3109. /// <summary>绘制实心矩形</summary>
  3110. /// <param name="x" type="Number">起始X坐标</param>
  3111. /// <param name="y" type="Number">起始Y坐标</param>
  3112. /// <param name="width" type="Number">矩形宽度</param>
  3113. /// <param name="height" type="Number">矩形高度</param>
  3114. /// <param name="radius" type="Number">圆角半径</param>
  3115. /// <param name="colorStr" type="String">颜色字符串值</param>
  3116. /// <param name="lineWidth" type="Number">线段宽度</param>
  3117. var ps = [];
  3118. ps.push(x, y + radius);
  3119. ps = ps.concat(Math.getBezierCurvePoints(x, y + height - radius, x, y + height, x + radius, y + height));
  3120. ps = ps.concat(Math.getBezierCurvePoints(x + width - radius, y + height, x + width, y + height, x + width, y + height - radius));
  3121. ps = ps.concat(Math.getBezierCurvePoints(x + width, y + radius, x + width, y, x + width - radius, y));
  3122. ps = ps.concat(Math.getBezierCurvePoints(x + radius, y, x, y, x, y + radius));
  3123. this.drawPolygon(ps, colorStr || "#000000", lineWidth);
  3124. }),
  3125. drawImage: Jyo.Overload().
  3126. add("*, Number, Number", function (element, x, y) {
  3127. /// <summary>绘制图象</summary>
  3128. /// <param name="element" type="Object">要绘制的元素</param>
  3129. /// <param name="x" type="Number">起始X坐标</param>
  3130. /// <param name="y" type="Number">起始Y坐标</param>
  3131. this.context.drawImage(element.object || element, x, y);
  3132. }).
  3133. add("*, Jyo.Rectangle", function (element, rect) {
  3134. /// <summary>绘制图象</summary>
  3135. /// <param name="element" type="Object">要绘制的元素</param>
  3136. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  3137. this.drawImage(element.object || element, rect.x, rect.y, rect.width, rect.height);
  3138. }).
  3139. add("*, Number, Number, Number, Number", function (element, x, y, width, height) {
  3140. /// <summary>绘制图象</summary>
  3141. /// <param name="element" type="Object">要绘制的元素</param>
  3142. /// <param name="x" type="Number">起始X坐标</param>
  3143. /// <param name="y" type="Number">起始Y坐标</param>
  3144. /// <param name="width" type="Number">图像宽度</param>
  3145. /// <param name="height" type="Number">图像高度</param>
  3146. this.context.drawImage(element.object || element, x, y, width, height);
  3147. }).
  3148. add("*, Number, Number, Number, Number, Number, Number, Number, Number", function (element, x, y, width, height, cx, cy, cwidth, cheight) {
  3149. /// <summary>绘制图象</summary>
  3150. /// <param name="element" type="Object">要绘制的元素</param>
  3151. /// <param name="x" type="Number">起始X坐标</param>
  3152. /// <param name="y" type="Number">起始Y坐标</param>
  3153. /// <param name="width" type="Number">图像宽度</param>
  3154. /// <param name="height" type="Number">图像高度</param>
  3155. /// <param name="cx" type="Number">在原图坐标上进行剪裁的起始X坐标</param>
  3156. /// <param name="cy" type="Number">在原图坐标上进行剪裁的起始Y坐标</param>
  3157. /// <param name="cwidth" type="Number">在原图坐标上进行剪裁的图像宽度</param>
  3158. /// <param name="cheight" type="Number">在原图坐标上进行剪裁的图像高度</param>
  3159. this.context.drawImage(element.object || element, cx, cy, cwidth, cheight, x, y, width, height);
  3160. }),
  3161. drawText: Jyo.Overload().
  3162. add("String, Number, Number", function (str, x, y) {
  3163. /// <summary>绘制文字</summary>
  3164. /// <param name="str" type="String">要显示的文字</param>
  3165. /// <param name="x" type="Number">起始X坐标</param>
  3166. /// <param name="y" type="Number">起始Y坐标</param>
  3167. this.drawText(str, x, y, "", "");
  3168. }).
  3169. add("String, Number, Number, Jyo.Color", function (str, x, y, color) {
  3170. /// <summary>绘制文字</summary>
  3171. /// <param name="str" type="String">要显示的文字</param>
  3172. /// <param name="x" type="Number">起始X坐标</param>
  3173. /// <param name="y" type="Number">起始Y坐标</param>
  3174. /// <param name="color" type="Jyo.Color">颜色对象</param>
  3175. this.drawText(str, x, y, color.toRgba(), "");
  3176. }).
  3177. add("String, Number, Number, String", function (str, x, y, colorStr) {
  3178. /// <summary>绘制文字</summary>
  3179. /// <param name="str" type="String">要显示的文字</param>
  3180. /// <param name="x" type="Number">起始X坐标</param>
  3181. /// <param name="y" type="Number">起始Y坐标</param>
  3182. /// <param name="colorStr" type="String">颜色字符串值</param>
  3183. this.drawText(str, x, y, colorStr, "");
  3184. }).
  3185. add("String, Number, Number, Jyo.Color, String", function (str, x, y, color, font) {
  3186. /// <summary>绘制文字</summary>
  3187. /// <param name="str" type="String">要显示的文字</param>
  3188. /// <param name="x" type="Number">起始X坐标</param>
  3189. /// <param name="y" type="Number">起始Y坐标</param>
  3190. /// <param name="color" type="Jyo.Color">颜色对象</param>
  3191. /// <param name="font" type="String">字体字符串值</param>
  3192. this.drawText(str, x, y, color.toRgba(), font);
  3193. }).
  3194. add("String, Number, Number, String, String", function (str, x, y, colorStr, font) {
  3195. /// <summary>绘制文字</summary>
  3196. /// <param name="str" type="String">要显示的文字</param>
  3197. /// <param name="x" type="Number">起始X坐标</param>
  3198. /// <param name="y" type="Number">起始Y坐标</param>
  3199. /// <param name="colorStr" type="String">颜色字符串值</param>
  3200. /// <param name="font" type="String">字体字符串值</param>
  3201. var ctx = this.context;
  3202. ctx.fillStyle = colorStr || "#000000";
  3203. ctx.font = font || "14px Arial";
  3204. var fontHeight = this.getTextHeight(str, ctx.font);
  3205. var strList = str.split(/\r\n|\n|\r/ig);
  3206. for (var i = 0; i < strList.length; i++) {
  3207. ctx.fillText(strList[i], x, y + fontHeight * (i + 0.8));
  3208. }
  3209. }),
  3210. drawLine: Jyo.Overload().
  3211. add("Number, Number, Number, Number", function (x1, y1, x2, y2) {
  3212. /// <summary>绘制线段</summary>
  3213. /// <param name="x1" type="Number">起始X坐标</param>
  3214. /// <param name="y1" type="Number">起始Y坐标</param>
  3215. /// <param name="x2" type="Number">结束X坐标</param>
  3216. /// <param name="y2" type="Number">结束Y坐标</param>
  3217. this.drawLine(x1, y1, x2, y2, "", 1, "");
  3218. }).
  3219. add("Number, Number, Number, Number, Jyo.Color", function (x1, y1, x2, y2, color) {
  3220. /// <summary>绘制线段</summary>
  3221. /// <param name="x1" type="Number">起始X坐标</param>
  3222. /// <param name="y1" type="Number">起始Y坐标</param>
  3223. /// <param name="x2" type="Number">结束X坐标</param>
  3224. /// <param name="y2" type="Number">结束Y坐标</param>
  3225. /// <param name="color" type="Jyo.Color">颜色对象</param>
  3226. this.drawLine(x1, y1, x2, y2, color.toRgba(), 1, "");
  3227. }).
  3228. add("Number, Number, Number, Number, String", function (x1, y1, x2, y2, colorStr) {
  3229. /// <summary>绘制线段</summary>
  3230. /// <param name="x1" type="Number">起始X坐标</param>
  3231. /// <param name="y1" type="Number">起始Y坐标</param>
  3232. /// <param name="x2" type="Number">结束X坐标</param>
  3233. /// <param name="y2" type="Number">结束Y坐标</param>
  3234. /// <param name="colorStr" type="String">颜色字符串值</param>
  3235. this.drawLine(x1, y1, x2, y2, colorStr, 1, "");
  3236. }).
  3237. add("Number, Number, Number, Number, Jyo.Color, Number", function (x1, y1, x2, y2, color, lineWidth) {
  3238. /// <summary>绘制线段</summary>
  3239. /// <param name="x1" type="Number">起始X坐标</param>
  3240. /// <param name="y1" type="Number">起始Y坐标</param>
  3241. /// <param name="x2" type="Number">结束X坐标</param>
  3242. /// <param name="y2" type="Number">结束Y坐标</param>
  3243. /// <param name="color" type="Jyo.Color">颜色对象</param>
  3244. /// <param name="lineWidth" type="Number">线条宽度</param>
  3245. this.drawLine(x1, y1, x2, y2, color.toRgba(), lineWidth, "");
  3246. }).
  3247. add("Number, Number, Number, Number, String, Number", function (x1, y1, x2, y2, colorStr, lineWidth) {
  3248. /// <summary>绘制线段</summary>
  3249. /// <param name="x1" type="Number">起始X坐标</param>
  3250. /// <param name="y1" type="Number">起始Y坐标</param>
  3251. /// <param name="x2" type="Number">结束X坐标</param>
  3252. /// <param name="y2" type="Number">结束Y坐标</param>
  3253. /// <param name="colorStr" type="String">颜色字符串值</param>
  3254. /// <param name="lineWidth" type="Number">线条宽度</param>
  3255. this.drawLine(x1, y1, x2, y2, colorStr, lineWidth, "");
  3256. }).
  3257. add("Number, Number, Number, Number, Jyo.Color, Number, String", function (x1, y1, x2, y2, color, lineWidth, cap) {
  3258. /// <summary>绘制线段</summary>
  3259. /// <param name="x1" type="Number">起始X坐标</param>
  3260. /// <param name="y1" type="Number">起始Y坐标</param>
  3261. /// <param name="x2" type="Number">结束X坐标</param>
  3262. /// <param name="y2" type="Number">结束Y坐标</param>
  3263. /// <param name="color" type="Jyo.Color">颜色对象</param>
  3264. /// <param name="lineWidth" type="Number">线条宽度</param>
  3265. /// <param name="cap" type="String">闭合样式</param>
  3266. this.drawLine(x1, y1, x2, y2, color.toRgba(), lineWidth, cap);
  3267. }).
  3268. add("Number, Number, Number, Number, String, Number, String", function (x1, y1, x2, y2, colorStr, lineWidth, cap) {
  3269. /// <summary>绘制线段</summary>
  3270. /// <param name="x1" type="Number">起始X坐标</param>
  3271. /// <param name="y1" type="Number">起始Y坐标</param>
  3272. /// <param name="x2" type="Number">结束X坐标</param>
  3273. /// <param name="y2" type="Number">结束Y坐标</param>
  3274. /// <param name="colorStr" type="String">颜色字符串值</param>
  3275. /// <param name="lineWidth" type="Number">线条宽度</param>
  3276. /// <param name="cap" type="String">闭合样式</param>
  3277. var ctx = this.context;
  3278. ctx.strokeStyle = colorStr || "#000000";
  3279. ctx.lineWidth = lineWidth || 1.0;
  3280. ctx.lineCap = cap || "butt";
  3281. ctx.beginPath();
  3282. ctx.moveTo(x1, y1);
  3283. ctx.lineTo(x2, y2);
  3284. ctx.closePath();
  3285. ctx.stroke();
  3286. }),
  3287. drawPolygon: Jyo.Overload().
  3288. add("Array", function (list) {
  3289. /// <summary>绘制空心多边形</summary>
  3290. /// <param name="list" type="Array">顶点列表</param>
  3291. this.drawPolygon(list, "", 1, "");
  3292. }).
  3293. add("Array, Jyo.Color", function (list, color) {
  3294. /// <summary>绘制空心多边形</summary>
  3295. /// <param name="list" type="Array">顶点列表</param>
  3296. /// <param name="color" type="Jyo.Color">颜色对象</param>
  3297. this.drawPolygon(list, color.toRgba(), 1, "");
  3298. }).
  3299. add("Array, String", function (list, colorStr) {
  3300. /// <summary>绘制空心多边形</summary>
  3301. /// <param name="list" type="Array">顶点列表</param>
  3302. /// <param name="colorStr" type="String">颜色字符串值</param>
  3303. this.drawPolygon(list, colorStr, 1, "");
  3304. }).
  3305. add("Array, Jyo.Color, Number", function (list, color, lineWidth) {
  3306. /// <summary>绘制空心多边形</summary>
  3307. /// <param name="list" type="Array">顶点列表</param>
  3308. /// <param name="color" type="Jyo.Color">颜色对象</param>
  3309. /// <param name="lineWidth" type="Number">线条宽度</param>
  3310. this.drawPolygon(list, color.toRgba(), lineWidth, "");
  3311. }).
  3312. add("Array, String, Number", function (list, colorStr, lineWidth) {
  3313. /// <summary>绘制空心多边形</summary>
  3314. /// <param name="list" type="Array">顶点列表</param>
  3315. /// <param name="colorStr" type="String">颜色字符串值</param>
  3316. /// <param name="lineWidth" type="Number">线条宽度</param>
  3317. this.drawPolygon(list, colorStr, lineWidth, "");
  3318. }).
  3319. add("Array, Jyo.Color, Number, String", function (list, color, lineWidth, lineJoin) {
  3320. /// <summary>绘制空心多边形</summary>
  3321. /// <param name="list" type="Array">顶点列表</param>
  3322. /// <param name="color" type="Jyo.Color">颜色对象</param>
  3323. /// <param name="lineWidth" type="Number">线条宽度</param>
  3324. /// <param name="lineJoin" type="String">线条闭合样式</param>
  3325. this.drawPolygon(list, color.toRgba(), lineWidth, lineJoin);
  3326. }).
  3327. add("Array, String, Number, String", function (list, colorStr, lineWidth, lineJoin) {
  3328. /// <summary>绘制空心多边形</summary>
  3329. /// <param name="list" type="Array">顶点列表</param>
  3330. /// <param name="colorStr" type="String">颜色字符串值</param>
  3331. /// <param name="lineWidth" type="Number">线条宽度</param>
  3332. /// <param name="lineJoin" type="String">线条闭合样式</param>
  3333. var ctx = this.context;
  3334. ctx.strokeStyle = colorStr || "#000000";
  3335. ctx.lineWidth = lineWidth || 1.0;
  3336. ctx.lineJoin = lineJoin || "miter";
  3337. ctx.beginPath();
  3338. ctx.moveTo(list[0], list[1]);
  3339. for (var i = 2, len = list.length; i < len; i += 2) ctx.lineTo(list[i], list[i + 1]);
  3340. ctx.closePath();
  3341. ctx.stroke();
  3342. }),
  3343. fillPolygon: Jyo.Overload().
  3344. add("Array", function (list) {
  3345. /// <summary>绘制实心多边形</summary>
  3346. /// <param name="list" type="Array">顶点列表</param>
  3347. this.fillPolygon(list, "");
  3348. }).
  3349. add("Array, Jyo.Color", function (list, color) {
  3350. /// <summary>绘制实心多边形</summary>
  3351. /// <param name="list" type="Array">顶点列表</param>
  3352. /// <param name="color" type="Jyo.Color">颜色对象</param>
  3353. this.fillPolygon(list, color.toRgba());
  3354. }).
  3355. add("Array, String", function (list, colorStr) {
  3356. /// <summary>绘制实心多边形</summary>
  3357. /// <param name="list" type="Array">顶点列表</param>
  3358. /// <param name="colorStr" type="String">颜色字符串值</param>
  3359. var ctx = this.context;
  3360. ctx.fillStyle = colorStr || "#000000";
  3361. ctx.beginPath();
  3362. ctx.moveTo(list[0], list[1]);
  3363. for (var i = 2, len = list.length; i < len; i += 2) ctx.lineTo(list[i], list[i + 1]);
  3364. ctx.closePath();
  3365. ctx.fill();
  3366. })
  3367. });
  3368. (function (Math, undefined) {
  3369. if (!Jyo.Renderer.WebGL.isSupport()) return;
  3370. var M_PI = 3.1415926535897932384626433832795028841968;
  3371. var M_TWO_PI = 2.0 * M_PI;
  3372. var M_HALF_PI = M_PI / 2.0;
  3373. function isPOT(value) {
  3374. return value > 0 && ((value - 1) & value) === 0;
  3375. }
  3376. var vec3 = {
  3377. length: function (pt) {
  3378. return Math.sqrt(pt[0] * pt[0] + pt[1] * pt[1] + pt[2] * pt[2]);
  3379. },
  3380. normalize: function (pt) {
  3381. var d = Math.sqrt((pt[0] * pt[0]) + (pt[1] * pt[1]) + (pt[2] * pt[2]));
  3382. if (d === 0) {
  3383. return [0, 0, 0];
  3384. }
  3385. return [pt[0] / d, pt[1] / d, pt[2] / d];
  3386. },
  3387. dot: function (v1, v2) {
  3388. return v1[0] * v2[0] + v1[1] * v2[1] + v1[2] * v2[2];
  3389. },
  3390. angle: function (v1, v2) {
  3391. return Math.acos((v1[0] * v2[0] + v1[1] * v2[1] + v1[2] * v2[2]) / (Math.sqrt(v1[0] * v1[0] + v1[1] * v1[1] + v1[2] * v1[2]) * Math.sqrt(v2[0] * v2[0] + v2[1] * v2[1] + v2[2] * v2[2])));
  3392. },
  3393. cross: function (vectA, vectB) {
  3394. return [vectA[1] * vectB[2] - vectB[1] * vectA[2], vectA[2] * vectB[0] - vectB[2] * vectA[0], vectA[0] * vectB[1] - vectB[0] * vectA[1]];
  3395. },
  3396. multiply: function (vectA, constB) {
  3397. return [vectA[0] * constB, vectA[1] * constB, vectA[2] * constB];
  3398. },
  3399. add: function (vectA, vectB) {
  3400. return [vectA[0] + vectB[0], vectA[1] + vectB[1], vectA[2] + vectB[2]];
  3401. },
  3402. subtract: function (vectA, vectB) {
  3403. return [vectA[0] - vectB[0], vectA[1] - vectB[1], vectA[2] - vectB[2]];
  3404. },
  3405. equal: function (a, b) {
  3406. var epsilon = 0.0000001;
  3407. if ((a === undefined) && (b === undefined)) {
  3408. return true;
  3409. }
  3410. if ((a === undefined) || (b === undefined)) {
  3411. return false;
  3412. }
  3413. return (Math.abs(a[0] - b[0]) < epsilon && Math.abs(a[1] - b[1]) < epsilon && Math.abs(a[2] - b[2]) < epsilon);
  3414. }
  3415. };
  3416. var mat3 = {
  3417. identity: [1.0, 0.0, 0.0,
  3418. 0.0, 1.0, 0.0,
  3419. 0.0, 0.0, 1.0],
  3420. multiply: function (m1, m2) {
  3421. var m10 = m1[0], m11 = m1[1], m12 = m1[2], m13 = m1[3], m14 = m1[4], m15 = m1[5], m16 = m1[6], m17 = m1[7], m18 = m1[8],
  3422. m20 = m2[0], m21 = m2[1], m22 = m2[2], m23 = m2[3], m24 = m2[4], m25 = m2[5], m26 = m2[6], m27 = m2[7], m28 = m2[8];
  3423. m2[0] = m20 * m10 + m23 * m11 + m26 * m12;
  3424. m2[1] = m21 * m10 + m24 * m11 + m27 * m12;
  3425. m2[2] = m22 * m10 + m25 * m11 + m28 * m12;
  3426. m2[3] = m20 * m13 + m23 * m14 + m26 * m15;
  3427. m2[4] = m21 * m13 + m24 * m14 + m27 * m15;
  3428. m2[5] = m22 * m13 + m25 * m14 + m28 * m15;
  3429. m2[6] = m20 * m16 + m23 * m17 + m26 * m18;
  3430. m2[7] = m21 * m16 + m24 * m17 + m27 * m18;
  3431. m2[8] = m22 * m16 + m25 * m17 + m28 * m18;
  3432. },
  3433. vec2_multiply: function (m1, m2) {
  3434. var mOut = [];
  3435. mOut[0] = m2[0] * m1[0] + m2[3] * m1[1] + m2[6];
  3436. mOut[1] = m2[1] * m1[0] + m2[4] * m1[1] + m2[7];
  3437. return mOut;
  3438. },
  3439. transpose: function (m) {
  3440. return [m[0], m[3], m[6], m[1], m[4], m[7], m[2], m[5], m[8]];
  3441. }
  3442. }; //mat3
  3443. function Transform(mat) {
  3444. return this.clearStack(mat);
  3445. }
  3446. var STACK_DEPTH_LIMIT = 16;
  3447. Transform.prototype.clearStack = function (init_mat) {
  3448. this.m_stack = [];
  3449. this.m_cache = [];
  3450. this.c_stack = 0;
  3451. this.valid = 0;
  3452. this.result = null;
  3453. for (var i = 0; i < STACK_DEPTH_LIMIT; i++) {
  3454. this.m_stack[i] = this.getIdentity();
  3455. }
  3456. if (init_mat !== undefined) {
  3457. this.m_stack[0] = init_mat;
  3458. } else {
  3459. this.setIdentity();
  3460. }
  3461. }; //clearStack
  3462. Transform.prototype.setIdentity = function () {
  3463. this.m_stack[this.c_stack] = this.getIdentity();
  3464. if (this.valid === this.c_stack && this.c_stack) {
  3465. this.valid--;
  3466. }
  3467. };
  3468. Transform.prototype.getIdentity = function () {
  3469. return [1.0, 0.0, 0.0,
  3470. 0.0, 1.0, 0.0,
  3471. 0.0, 0.0, 1.0];
  3472. };
  3473. Transform.prototype.getResult = function () {
  3474. if (!this.c_stack) {
  3475. return this.m_stack[0];
  3476. }
  3477. var m = mat3.identity;
  3478. if (this.valid > this.c_stack - 1) { this.valid = this.c_stack - 1; }
  3479. for (var i = this.valid; i < this.c_stack + 1; i++) {
  3480. m = mat3.multiply(this.m_stack[i], m);
  3481. this.m_cache[i] = m;
  3482. }
  3483. this.valid = this.c_stack - 1;
  3484. this.result = this.m_cache[this.c_stack];
  3485. return this.result;
  3486. };
  3487. Transform.prototype.pushMatrix = function () {
  3488. this.c_stack++;
  3489. this.m_stack[this.c_stack] = this.getIdentity();
  3490. };
  3491. Transform.prototype.popMatrix = function () {
  3492. if (this.c_stack === 0) { return; }
  3493. this.c_stack--;
  3494. };
  3495. var translateMatrix = Transform.prototype.getIdentity();
  3496. Transform.prototype.translate = function (x, y) {
  3497. translateMatrix[6] = x;
  3498. translateMatrix[7] = y;
  3499. mat3.multiply(translateMatrix, this.m_stack[this.c_stack]);
  3500. /*
  3501. if (this.valid === this.c_stack && this.c_stack) {
  3502. this.valid--;
  3503. }
  3504. */
  3505. };
  3506. var scaleMatrix = Transform.prototype.getIdentity();
  3507. Transform.prototype.scale = function (x, y) {
  3508. scaleMatrix[0] = x;
  3509. scaleMatrix[4] = y;
  3510. mat3.multiply(scaleMatrix, this.m_stack[this.c_stack]);
  3511. /*
  3512. if (this.valid === this.c_stack && this.c_stack) {
  3513. this.valid--;
  3514. }
  3515. */
  3516. };
  3517. var rotateMatrix = Transform.prototype.getIdentity();
  3518. Transform.prototype.rotate = function (ang) {
  3519. var sAng, cAng;
  3520. sAng = Math.sin(-ang);
  3521. cAng = Math.cos(-ang);
  3522. rotateMatrix[0] = cAng;
  3523. rotateMatrix[3] = sAng;
  3524. rotateMatrix[1] = -sAng;
  3525. rotateMatrix[4] = cAng;
  3526. mat3.multiply(rotateMatrix, this.m_stack[this.c_stack]);
  3527. /*
  3528. if (this.valid === this.c_stack && this.c_stack) {
  3529. this.valid--;
  3530. }
  3531. */
  3532. };
  3533. var WebGL2D = function WebGL2D(gl) {
  3534. /// <summary>启用WebGL2D支持</summary>
  3535. /// <param name="gl" type="WebGLRenderingContext">WebGL上下文对象</param>
  3536. if (!(this instanceof WebGL2D)) {
  3537. return new WebGL2D(gl);
  3538. }
  3539. this.canvas = gl.canvas;
  3540. this.gl = gl;
  3541. this.fs = undefined;
  3542. this.vs = undefined;
  3543. this.shaderProgram = undefined;
  3544. this.transform = new Transform();
  3545. this.shaderPool = [];
  3546. this.maxTextureSize = undefined;
  3547. this.initShaders();
  3548. this.initBuffers();
  3549. // Append Canvas2D API features to the WebGL context
  3550. this.initCanvas2DAPI();
  3551. gl.viewport(0, 0, this.canvas.width, this.canvas.height);
  3552. // 默认蓝色背景
  3553. //gl.clearColor(99 / 255, 149 / 255, 236 / 255, 1);
  3554. gl.clear(gl.COLOR_BUFFER_BIT); // | gl.DEPTH_BUFFER_BIT);
  3555. // Depth options
  3556. //gl.enable(gl.DEPTH_TEST);
  3557. //gl.depthFunc(gl.LEQUAL);
  3558. // Blending options
  3559. gl.enable(gl.BLEND);
  3560. gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
  3561. this.maxTextureSize = gl.getParameter(gl.MAX_TEXTURE_SIZE);
  3562. this.postInit();
  3563. };
  3564. // Shader Pool BitMasks, i.e. sMask = (shaderMask.texture+shaderMask.stroke)
  3565. var shaderMask = {
  3566. texture: 1,
  3567. crop: 2,
  3568. path: 4
  3569. };
  3570. // Fragment shader source
  3571. WebGL2D.prototype.getFragmentShaderSource = function getFragmentShaderSource(sMask) {
  3572. var fsSource = [
  3573. "#ifdef GL_ES",
  3574. "precision highp float;",
  3575. "#endif",
  3576. "#define hasTexture " + ((sMask & shaderMask.texture) ? "1" : "0"),
  3577. "#define hasCrop " + ((sMask & shaderMask.crop) ? "1" : "0"),
  3578. "varying vec4 vColor;",
  3579. "#if hasTexture",
  3580. "varying vec2 vTextureCoord;",
  3581. "uniform sampler2D uSampler;",
  3582. "#if hasCrop",
  3583. "uniform vec4 uCropSource;",
  3584. "#endif",
  3585. "#endif",
  3586. "void main(void) {",
  3587. "#if hasTexture",
  3588. "#if hasCrop",
  3589. "gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x * uCropSource.z, vTextureCoord.y * uCropSource.w) + uCropSource.xy);",
  3590. "#else",
  3591. "gl_FragColor = texture2D(uSampler, vTextureCoord);",
  3592. "#endif",
  3593. "#else",
  3594. "gl_FragColor = vColor;",
  3595. "#endif",
  3596. "}"
  3597. ].join("\n");
  3598. return fsSource;
  3599. };
  3600. WebGL2D.prototype.getVertexShaderSource = function getVertexShaderSource(stackDepth, sMask) {
  3601. var w = 2 / this.canvas.width, h = -2 / this.canvas.height;
  3602. stackDepth = stackDepth || 1;
  3603. var vsSource = [
  3604. "#define hasTexture " + ((sMask & shaderMask.texture) ? "1" : "0"),
  3605. "attribute vec4 aVertexPosition;",
  3606. "#if hasTexture",
  3607. "varying vec2 vTextureCoord;",
  3608. "#endif",
  3609. "uniform vec4 uColor;",
  3610. "uniform mat3 uTransforms[" + stackDepth + "];",
  3611. "varying vec4 vColor;",
  3612. "const mat4 pMatrix = mat4(" + w + ",0,0,0, 0," + h + ",0,0, 0,0,1.0,1.0, -1.0,1.0,0,0);",
  3613. "mat3 crunchStack(void) {",
  3614. "mat3 result = uTransforms[0];",
  3615. "for (int i = 1; i < " + stackDepth + "; ++i) {",
  3616. "result = uTransforms[i] * result;",
  3617. "}",
  3618. "return result;",
  3619. "}",
  3620. "void main(void) {",
  3621. "vec3 position = crunchStack() * vec3(aVertexPosition.x, aVertexPosition.y, 1.0);",
  3622. "gl_Position = pMatrix * vec4(position, 1.0);",
  3623. "vColor = uColor;",
  3624. "#if hasTexture",
  3625. "vTextureCoord = aVertexPosition.zw;",
  3626. "#endif",
  3627. "}"
  3628. ].join("\n");
  3629. return vsSource;
  3630. };
  3631. // Initialize fragment and vertex shaders
  3632. WebGL2D.prototype.initShaders = function initShaders(transformStackDepth, sMask) {
  3633. var gl = this.gl;
  3634. transformStackDepth = transformStackDepth || 1;
  3635. sMask = sMask || 0;
  3636. var storedShader = this.shaderPool[transformStackDepth];
  3637. if (!storedShader) { storedShader = this.shaderPool[transformStackDepth] = []; }
  3638. storedShader = storedShader[sMask];
  3639. if (storedShader) {
  3640. gl.useProgram(storedShader);
  3641. this.shaderProgram = storedShader;
  3642. return storedShader;
  3643. } else {
  3644. var fs = this.fs = gl.createShader(gl.FRAGMENT_SHADER);
  3645. gl.shaderSource(this.fs, this.getFragmentShaderSource(sMask));
  3646. gl.compileShader(this.fs);
  3647. if (!gl.getShaderParameter(this.fs, gl.COMPILE_STATUS)) {
  3648. throw "fragment shader error: " + gl.getShaderInfoLog(this.fs);
  3649. }
  3650. var vs = this.vs = gl.createShader(gl.VERTEX_SHADER);
  3651. gl.shaderSource(this.vs, this.getVertexShaderSource(transformStackDepth, sMask));
  3652. gl.compileShader(this.vs);
  3653. if (!gl.getShaderParameter(this.vs, gl.COMPILE_STATUS)) {
  3654. throw "vertex shader error: " + gl.getShaderInfoLog(this.vs);
  3655. }
  3656. var shaderProgram = this.shaderProgram = gl.createProgram();
  3657. shaderProgram.stackDepth = transformStackDepth;
  3658. gl.attachShader(shaderProgram, fs);
  3659. gl.attachShader(shaderProgram, vs);
  3660. gl.linkProgram(shaderProgram);
  3661. if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) {
  3662. throw "Could not initialise shaders.";
  3663. }
  3664. gl.useProgram(shaderProgram);
  3665. shaderProgram.vertexPositionAttribute = gl.getAttribLocation(shaderProgram, "aVertexPosition");
  3666. gl.enableVertexAttribArray(shaderProgram.vertexPositionAttribute);
  3667. shaderProgram.uColor = gl.getUniformLocation(shaderProgram, 'uColor');
  3668. shaderProgram.uSampler = gl.getUniformLocation(shaderProgram, 'uSampler');
  3669. shaderProgram.uCropSource = gl.getUniformLocation(shaderProgram, 'uCropSource');
  3670. shaderProgram.uTransforms = [];
  3671. for (var i = 0; i < transformStackDepth; ++i) {
  3672. shaderProgram.uTransforms[i] = gl.getUniformLocation(shaderProgram, 'uTransforms[' + i + ']');
  3673. } //for
  3674. this.shaderPool[transformStackDepth][sMask] = shaderProgram;
  3675. return shaderProgram;
  3676. } //if
  3677. };
  3678. var rectVertexPositionBuffer;
  3679. var rectVertexColorBuffer;
  3680. var pathVertexPositionBuffer;
  3681. var pathVertexColorBuffer;
  3682. // 2D Vertices and Texture UV coords
  3683. var rectVerts = new Float32Array([
  3684. 0, 0, 0, 0,
  3685. 0, 1, 0, 1,
  3686. 1, 1, 1, 1,
  3687. 1, 0, 1, 0
  3688. ]);
  3689. WebGL2D.prototype.initBuffers = function initBuffers() {
  3690. var gl = this.gl;
  3691. rectVertexPositionBuffer = gl.createBuffer();
  3692. rectVertexColorBuffer = gl.createBuffer();
  3693. pathVertexPositionBuffer = gl.createBuffer();
  3694. pathVertexColorBuffer = gl.createBuffer();
  3695. gl.bindBuffer(gl.ARRAY_BUFFER, rectVertexPositionBuffer);
  3696. gl.bufferData(gl.ARRAY_BUFFER, rectVerts, gl.STATIC_DRAW);
  3697. };
  3698. // Maintains an array of all WebGL2D instances
  3699. WebGL2D.instances = [];
  3700. WebGL2D.prototype.postInit = function () {
  3701. WebGL2D.instances.push(this);
  3702. };
  3703. // Extends gl context with Canvas2D API
  3704. WebGL2D.prototype.initCanvas2DAPI = function initCanvas2DAPI() {
  3705. var gl2d = this,
  3706. gl = this.gl;
  3707. var textCanvas = document.createElement("canvas");
  3708. textCanvas.width = gl.canvas.width;
  3709. textCanvas.height = gl.canvas.height;
  3710. textCanvas.noCatch = true;
  3711. var textCtx = textCanvas.getContext("2d");
  3712. var reRGBAColor = /^rgb(a)?\(\s*(-?[\d]+)(%)?\s*,\s*(-?[\d]+)(%)?\s*,\s*(-?[\d]+)(%)?\s*,?\s*(-?[\d\.]+)?\s*\)$/;
  3713. var reHSLAColor = /^hsl(a)?\(\s*(-?[\d\.]+)\s*,\s*(-?[\d\.]+)%\s*,\s*(-?[\d\.]+)%\s*,?\s*(-?[\d\.]+)?\s*\)$/;
  3714. var reHex6Color = /^#([0-9A-Fa-f]{6})$/;
  3715. var reHex3Color = /^#([0-9A-Fa-f])([0-9A-Fa-f])([0-9A-Fa-f])$/;
  3716. function HSLAToRGBA(h, s, l, a) {
  3717. var r, g, b, m1, m2;
  3718. // Clamp and Normalize values
  3719. h = (((h % 360) + 360) % 360) / 360;
  3720. s = s > 100 ? 1 : s / 100;
  3721. s = s < 0 ? 0 : s;
  3722. l = l > 100 ? 1 : l / 100;
  3723. l = l < 0 ? 0 : l;
  3724. m2 = l <= 0.5 ? l * (s + 1) : l + s - l * s;
  3725. m1 = l * 2 - m2;
  3726. function getHue(value) {
  3727. var hue;
  3728. if (value * 6 < 1) {
  3729. hue = m1 + (m2 - m1) * value * 6;
  3730. } else if (value * 2 < 1) {
  3731. hue = m2;
  3732. } else if (value * 3 < 2) {
  3733. hue = m1 + (m2 - m1) * (2 / 3 - value) * 6;
  3734. } else {
  3735. hue = m1;
  3736. }
  3737. return hue;
  3738. }
  3739. r = getHue(h + 1 / 3);
  3740. g = getHue(h);
  3741. b = getHue(h - 1 / 3);
  3742. return [r, g, b, a];
  3743. }
  3744. // Converts rgb(a) color string to gl color vector
  3745. function colorStringToVec4(value) {
  3746. var result = [], match, channel, isPercent, hasAlpha, alphaChannel, sameType;
  3747. if ((match = reRGBAColor.exec(value))) {
  3748. hasAlpha = match[1], alphaChannel = parseFloat(match[8]);
  3749. if ((hasAlpha && isNaN(alphaChannel)) || (!hasAlpha && !isNaN(alphaChannel))) {
  3750. return false;
  3751. }
  3752. sameType = match[3];
  3753. for (var i = 2; i < 8; i += 2) {
  3754. channel = match[i], isPercent = match[i + 1];
  3755. if (isPercent !== sameType) {
  3756. return false;
  3757. }
  3758. // Clamp and normalize values
  3759. if (isPercent) {
  3760. channel = channel > 100 ? 1 : channel / 100;
  3761. channel = channel < 0 ? 0 : channel;
  3762. } else {
  3763. channel = channel > 255 ? 1 : channel / 255;
  3764. channel = channel < 0 ? 0 : channel;
  3765. }
  3766. result.push(channel);
  3767. }
  3768. result.push(hasAlpha ? alphaChannel : 1.0);
  3769. } else if ((match = reHSLAColor.exec(value))) {
  3770. hasAlpha = match[1], alphaChannel = parseFloat(match[5]);
  3771. result = HSLAToRGBA(match[2], match[3], match[4], parseFloat(hasAlpha && alphaChannel ? alphaChannel : 1.0));
  3772. } else if ((match = reHex6Color.exec(value))) {
  3773. var colorInt = parseInt(match[1], 16);
  3774. result = [((colorInt & 0xFF0000) >> 16) / 255, ((colorInt & 0x00FF00) >> 8) / 255, (colorInt & 0x0000FF) / 255, 1.0];
  3775. } else if ((match = reHex3Color.exec(value))) {
  3776. var hexString = "#" + [match[1], match[1], match[2], match[2], match[3], match[3]].join("");
  3777. result = colorStringToVec4(hexString);
  3778. } else if (value.toLowerCase() in colorKeywords) {
  3779. result = colorStringToVec4(colorKeywords[value.toLowerCase()]);
  3780. } else if (value.toLowerCase() === "transparent") {
  3781. result = [0, 0, 0, 0];
  3782. } else {
  3783. // Color keywords not yet implemented, ie "orange", return hot pink
  3784. return false;
  3785. }
  3786. return result;
  3787. }
  3788. function colorVecToString(vec4) {
  3789. return "rgba(" + (vec4[0] * 255) + ", " + (vec4[1] * 255) + ", " + (vec4[2] * 255) + ", " + parseFloat(vec4[3]) + ")";
  3790. }
  3791. var colorKeywords = Jyo.Color.colorMap;
  3792. // Maintain drawing state params during gl.save and gl.restore. see saveDrawState() and restoreDrawState()
  3793. var drawState = {}, drawStateStack = [];
  3794. // A fast simple shallow clone
  3795. function cloneObject(obj) {
  3796. var target = {};
  3797. for (var i in obj) {
  3798. if (obj.hasOwnProperty(i)) {
  3799. target[i] = obj[i];
  3800. }
  3801. }
  3802. return target;
  3803. }
  3804. function saveDrawState() {
  3805. var bakedDrawState = {
  3806. fillStyle: [drawState.fillStyle[0], drawState.fillStyle[1], drawState.fillStyle[2], drawState.fillStyle[3]],
  3807. strokeStyle: [drawState.strokeStyle[0], drawState.strokeStyle[1], drawState.strokeStyle[2], drawState.strokeStyle[3]],
  3808. globalAlpha: drawState.globalAlpha,
  3809. globalCompositeOperation: drawState.globalCompositeOperation,
  3810. lineCap: drawState.lineCap,
  3811. lineJoin: drawState.lineJoin,
  3812. lineWidth: drawState.lineWidth,
  3813. miterLimit: drawState.miterLimit,
  3814. shadowColor: drawState.shadowColor,
  3815. shadowBlur: drawState.shadowBlur,
  3816. shadowOffsetX: drawState.shadowOffsetX,
  3817. shadowOffsetY: drawState.shadowOffsetY,
  3818. textAlign: drawState.textAlign,
  3819. font: drawState.font,
  3820. textBaseline: drawState.textBaseline
  3821. };
  3822. drawStateStack.push(bakedDrawState);
  3823. }
  3824. function restoreDrawState() {
  3825. if (drawStateStack.length) {
  3826. drawState = drawStateStack.pop();
  3827. }
  3828. }
  3829. // WebGL requires colors as a vector while Canvas2D sets colors as an rgba string
  3830. // These getters and setters store the original rgba string as well as convert to a vector
  3831. drawState.fillStyle = [0, 0, 0, 1]; // default black
  3832. Object.defineProperty(gl, "fillStyle", {
  3833. get: function () { return colorVecToString(drawState.fillStyle); },
  3834. set: function (value) {
  3835. drawState.fillStyle = colorStringToVec4(value) || drawState.fillStyle;
  3836. textCtx.fillStyle = value;
  3837. }
  3838. });
  3839. drawState.strokeStyle = [0, 0, 0, 1]; // default black
  3840. Object.defineProperty(gl, "strokeStyle", {
  3841. get: function () { return colorVecToString(drawState.strokeStyle); },
  3842. set: function (value) {
  3843. drawState.strokeStyle = colorStringToVec4(value) || drawStyle.strokeStyle;
  3844. textCtx.strokeStyle = value;
  3845. }
  3846. });
  3847. // WebGL already has a lineWidth() function but Canvas2D requires a lineWidth property
  3848. // Store the original lineWidth() function for later use
  3849. gl.$lineWidth = gl.lineWidth;
  3850. drawState.lineWidth = 1.0;
  3851. Object.defineProperty(gl, "lineWidth", {
  3852. get: function () { return drawState.lineWidth; },
  3853. set: function (value) {
  3854. gl.$lineWidth(value);
  3855. drawState.lineWidth = value;
  3856. }
  3857. });
  3858. // Currently unsupported attributes and their default values
  3859. drawState.lineCap = "butt";
  3860. Object.defineProperty(gl, "lineCap", {
  3861. get: function () { return drawState.lineCap; },
  3862. set: function (value) {
  3863. drawState.lineCap = value;
  3864. }
  3865. });
  3866. drawState.lineJoin = "miter";
  3867. Object.defineProperty(gl, "lineJoin", {
  3868. get: function () { return drawState.lineJoin; },
  3869. set: function (value) {
  3870. drawState.lineJoin = value;
  3871. }
  3872. });
  3873. drawState.miterLimit = 10;
  3874. Object.defineProperty(gl, "miterLimit", {
  3875. get: function () { return drawState.miterLimit; },
  3876. set: function (value) {
  3877. drawState.miterLimit = value;
  3878. }
  3879. });
  3880. drawState.shadowOffsetX = 0;
  3881. Object.defineProperty(gl, "shadowOffsetX", {
  3882. get: function () { return drawState.shadowOffsetX; },
  3883. set: function (value) {
  3884. drawState.shadowOffsetX = value;
  3885. textCtx.shadowOffsetX = value;
  3886. }
  3887. });
  3888. drawState.shadowOffsetY = 0;
  3889. Object.defineProperty(gl, "shadowOffsetY", {
  3890. get: function () { return drawState.shadowOffsetY; },
  3891. set: function (value) {
  3892. drawState.shadowOffsetY = value;
  3893. textCtx.shadowOffsetY = value;
  3894. }
  3895. });
  3896. drawState.shadowBlur = 0;
  3897. Object.defineProperty(gl, "shadowBlur", {
  3898. get: function () { return drawState.shadowBlur; },
  3899. set: function (value) {
  3900. drawState.shadowBlur = value;
  3901. textCtx.shadowBlur = value;
  3902. }
  3903. });
  3904. drawState.shadowColor = "rgba(0, 0, 0, 0.0)";
  3905. Object.defineProperty(gl, "shadowColor", {
  3906. get: function () { return drawState.shadowColor; },
  3907. set: function (value) {
  3908. drawState.shadowColor = value;
  3909. textCtx.shadowColor = value;
  3910. }
  3911. });
  3912. drawState.font = "10px sans-serif";
  3913. Object.defineProperty(gl, "font", {
  3914. get: function () { return drawState.font; },
  3915. set: function (value) {
  3916. drawState.font = value;
  3917. textCtx.font = value;
  3918. }
  3919. });
  3920. drawState.textAlign = "start";
  3921. Object.defineProperty(gl, "textAlign", {
  3922. get: function () { return drawState.textAlign; },
  3923. set: function (value) {
  3924. drawState.textAlign = value;
  3925. textCtx.textAlign = value;
  3926. }
  3927. });
  3928. drawState.textBaseline = "alphabetic";
  3929. Object.defineProperty(gl, "textBaseline", {
  3930. get: function () { return drawState.textBaseline; },
  3931. set: function (value) {
  3932. drawState.textBaseline = value;
  3933. textCtx.textBaseline = value;
  3934. }
  3935. });
  3936. // This attribute will need to control global alpha of objects drawn.
  3937. drawState.globalAlpha = 1.0;
  3938. Object.defineProperty(gl, "globalAlpha", {
  3939. get: function () { return drawState.globalAlpha; },
  3940. set: function (value) {
  3941. drawState.globalAlpha = value;
  3942. textCtx.globalAlpha = value;
  3943. }
  3944. });
  3945. // This attribute will need to set the gl.blendFunc mode
  3946. drawState.globalCompositeOperation = "source-over";
  3947. Object.defineProperty(gl, "globalCompositeOperation", {
  3948. get: function () { return drawState.globalCompositeOperation; },
  3949. set: function (value) {
  3950. drawState.globalCompositeOperation = value;
  3951. }
  3952. });
  3953. var tempCanvas = document.createElement('canvas');
  3954. var tempCtx = tempCanvas.getContext('2d');
  3955. gl.save = function save() {
  3956. gl2d.transform.pushMatrix();
  3957. saveDrawState();
  3958. };
  3959. gl.restore = function restore() {
  3960. gl2d.transform.popMatrix();
  3961. restoreDrawState();
  3962. };
  3963. gl.translate = function translate(x, y) {
  3964. gl2d.transform.translate(x, y);
  3965. };
  3966. gl.rotate = function rotate(a) {
  3967. gl2d.transform.rotate(a);
  3968. };
  3969. gl.scale = function scale(x, y) {
  3970. gl2d.transform.scale(x, y);
  3971. };
  3972. gl.createImageData = function createImageData(width, height) {
  3973. return tempCtx.createImageData(width, height);
  3974. };
  3975. gl.getImageData = function getImageData(x, y, width, height) {
  3976. var data = tempCtx.createImageData(width, height);
  3977. var buffer = new Uint8Array(width * height * 4);
  3978. gl.readPixels(x, y, width, height, gl.RGBA, gl.UNSIGNED_BYTE, buffer);
  3979. var w = width * 4, h = height;
  3980. for (var i = 0, maxI = h / 2; i < maxI; ++i) {
  3981. for (var j = 0, maxJ = w; j < maxJ; ++j) {
  3982. var index1 = i * w + j;
  3983. var index2 = (h - i - 1) * w + j;
  3984. data.data[index1] = buffer[index2];
  3985. data.data[index2] = buffer[index1];
  3986. } //for
  3987. } //for
  3988. return data;
  3989. };
  3990. gl.putImageData = function putImageData(imageData, x, y) {
  3991. gl.drawImage(imageData, x, y);
  3992. };
  3993. gl.transform = function transform(m11, m12, m21, m22, dx, dy) {
  3994. var m = gl2d.transform.m_stack[gl2d.transform.c_stack];
  3995. m[0] *= m11;
  3996. m[1] *= m21;
  3997. m[2] *= dx;
  3998. m[3] *= m12;
  3999. m[4] *= m22;
  4000. m[5] *= dy;
  4001. m[6] = 0;
  4002. m[7] = 0;
  4003. };
  4004. function sendTransformStack(sp) {
  4005. var stack = gl2d.transform.m_stack;
  4006. for (var i = 0, maxI = gl2d.transform.c_stack + 1; i < maxI; ++i) {
  4007. gl.uniformMatrix3fv(sp.uTransforms[i], false, stack[maxI - 1 - i]);
  4008. } //for
  4009. }
  4010. gl.setTransform = function setTransform(m11, m12, m21, m22, dx, dy) {
  4011. gl2d.transform.setIdentity();
  4012. gl.transform.apply(this, arguments);
  4013. };
  4014. gl.fillRect = function fillRect(x, y, width, height) {
  4015. var transform = gl2d.transform;
  4016. var shaderProgram = gl2d.initShaders(transform.c_stack + 2, 0);
  4017. gl.bindBuffer(gl.ARRAY_BUFFER, rectVertexPositionBuffer);
  4018. gl.vertexAttribPointer(shaderProgram.vertexPositionAttribute, 4, gl.FLOAT, false, 0, 0);
  4019. transform.pushMatrix();
  4020. transform.translate(x, y);
  4021. transform.scale(width, height);
  4022. sendTransformStack(shaderProgram);
  4023. gl.uniform4f(shaderProgram.uColor, drawState.fillStyle[0], drawState.fillStyle[1], drawState.fillStyle[2], drawState.fillStyle[3]);
  4024. gl.drawArrays(gl.TRIANGLE_FAN, 0, 4);
  4025. transform.popMatrix();
  4026. };
  4027. gl.strokeRect = function strokeRect(x, y, width, height) {
  4028. var transform = gl2d.transform;
  4029. var shaderProgram = gl2d.initShaders(transform.c_stack + 2, 0);
  4030. gl.bindBuffer(gl.ARRAY_BUFFER, rectVertexPositionBuffer);
  4031. gl.vertexAttribPointer(shaderProgram.vertexPositionAttribute, 4, gl.FLOAT, false, 0, 0);
  4032. transform.pushMatrix();
  4033. transform.translate(x, y);
  4034. transform.scale(width, height);
  4035. sendTransformStack(shaderProgram);
  4036. gl.uniform4f(shaderProgram.uColor, drawState.strokeStyle[0], drawState.strokeStyle[1], drawState.strokeStyle[2], drawState.strokeStyle[3]);
  4037. gl.drawArrays(gl.LINE_LOOP, 0, 4);
  4038. transform.popMatrix();
  4039. };
  4040. gl.clearRect = function clearRect(x, y, width, height) { };
  4041. gl.fillText = function (text, x, y, fontSize) {
  4042. textCtx.clearRect(0, 0, this.canvas.width, this.canvas.height);
  4043. textCtx.fillText(text, x, y);
  4044. this.drawImage(textCanvas, 0, 0);
  4045. };
  4046. gl.strokeText = function (text, x, y, fontHeight) {
  4047. // 暂不支持strokeText
  4048. };
  4049. gl.measureText = function (text) {
  4050. // 暂不支持measureText
  4051. };
  4052. gl.quadraticCurveTo = function (cp1x, cp1y, x, y) {
  4053. // 暂不支持quadraticCurveTo
  4054. };
  4055. gl.bezierCurveTo = function (cp1x, cp1y, cp2x, cp2y, x, y) {
  4056. // 暂不支持bezierCurveTo
  4057. };
  4058. gl.arcTo = function (x1, y1, x2, y2, radius) {
  4059. // 暂不支持arcTo
  4060. };
  4061. gl.arc = function (x, y, radius, startAngle, endAngle, anticlockwise) {
  4062. // 暂不支持arc
  4063. };
  4064. gl.clip = function clip() {
  4065. // 暂不支持clip
  4066. };
  4067. var subPaths = [];
  4068. function SubPath(x, y) {
  4069. this.closed = false;
  4070. this.verts = [x, y, 0, 0];
  4071. }
  4072. // Empty the list of subpaths so that the context once again has zero subpaths
  4073. gl.beginPath = function beginPath() {
  4074. subPaths.length = 0;
  4075. };
  4076. // Mark last subpath as closed and create a new subpath with the same starting point as the previous subpath
  4077. gl.closePath = function closePath() {
  4078. if (subPaths.length) {
  4079. // Mark last subpath closed.
  4080. var prevPath = subPaths[subPaths.length - 1], startX = prevPath.verts[0], startY = prevPath.verts[1];
  4081. prevPath.closed = true;
  4082. // Create new subpath using the starting position of previous subpath
  4083. var newPath = new SubPath(startX, startY);
  4084. subPaths.push(newPath);
  4085. }
  4086. };
  4087. // Create a new subpath with the specified point as its first (and only) point
  4088. gl.moveTo = function moveTo(x, y) {
  4089. subPaths.push(new SubPath(x, y));
  4090. };
  4091. gl.lineTo = function lineTo(x, y) {
  4092. if (subPaths.length) {
  4093. subPaths[subPaths.length - 1].verts.push(x, y, 0, 0);
  4094. } else {
  4095. // Create a new subpath if none currently exist
  4096. gl.moveTo(x, y);
  4097. }
  4098. };
  4099. // Adds a closed rect subpath and creates a new subpath
  4100. gl.rect = function rect(x, y, w, h) {
  4101. gl.moveTo(x, y);
  4102. gl.lineTo(x + w, y);
  4103. gl.lineTo(x + w, y + h);
  4104. gl.lineTo(x, y + h);
  4105. gl.closePath();
  4106. };
  4107. function fillSubPath(index) {
  4108. var transform = gl2d.transform;
  4109. var shaderProgram = gl2d.initShaders(transform.c_stack + 2, 0);
  4110. var subPath = subPaths[index];
  4111. var verts = subPath.verts;
  4112. gl.bindBuffer(gl.ARRAY_BUFFER, pathVertexPositionBuffer);
  4113. gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(verts), gl.STATIC_DRAW);
  4114. gl.vertexAttribPointer(shaderProgram.vertexPositionAttribute, 4, gl.FLOAT, false, 0, 0);
  4115. transform.pushMatrix();
  4116. sendTransformStack(shaderProgram);
  4117. gl.uniform4f(shaderProgram.uColor, drawState.fillStyle[0], drawState.fillStyle[1], drawState.fillStyle[2], drawState.fillStyle[3]);
  4118. gl.drawArrays(gl.TRIANGLE_FAN, 0, verts.length / 4);
  4119. transform.popMatrix();
  4120. }
  4121. gl.fill = function fill() {
  4122. for (var i = 0; i < subPaths.length; i++) {
  4123. fillSubPath(i);
  4124. }
  4125. };
  4126. function strokeSubPath(index) {
  4127. var transform = gl2d.transform;
  4128. var shaderProgram = gl2d.initShaders(transform.c_stack + 2, 0);
  4129. var subPath = subPaths[index];
  4130. var verts = subPath.verts;
  4131. gl.bindBuffer(gl.ARRAY_BUFFER, pathVertexPositionBuffer);
  4132. gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(verts), gl.STATIC_DRAW);
  4133. gl.vertexAttribPointer(shaderProgram.vertexPositionAttribute, 4, gl.FLOAT, false, 0, 0);
  4134. transform.pushMatrix();
  4135. sendTransformStack(shaderProgram);
  4136. gl.uniform4f(shaderProgram.uColor, drawState.strokeStyle[0], drawState.strokeStyle[1], drawState.strokeStyle[2], drawState.strokeStyle[3]);
  4137. if (subPath.closed) {
  4138. gl.drawArrays(gl.LINE_LOOP, 0, verts.length / 4);
  4139. } else {
  4140. gl.drawArrays(gl.LINE_STRIP, 0, verts.length / 4);
  4141. }
  4142. transform.popMatrix();
  4143. }
  4144. gl.stroke = function stroke() {
  4145. for (var i = 0; i < subPaths.length; i++) {
  4146. strokeSubPath(i);
  4147. }
  4148. };
  4149. gl.isPointInPath = function isPointInPath() { };
  4150. gl.drawFocusRing = function drawFocusRing() { };
  4151. var imageCache = [], textureCache = [];
  4152. function Texture(image) {
  4153. this.obj = gl.createTexture();
  4154. if (!image.noCatch) {
  4155. this.index = textureCache.push(this);
  4156. imageCache.push(image);
  4157. }
  4158. // we may wish to consider tiling large images like this instead of scaling and
  4159. // adjust appropriately (flip to next texture source and tile offset) when drawing
  4160. if (image.width > gl2d.maxTextureSize || image.height > gl2d.maxTextureSize) {
  4161. var canvas = document.createElement("canvas");
  4162. canvas.width = (image.width > gl2d.maxTextureSize) ? gl2d.maxTextureSize : image.width;
  4163. canvas.height = (image.height > gl2d.maxTextureSize) ? gl2d.maxTextureSize : image.height;
  4164. var ctx = canvas.getContext("2d");
  4165. ctx.drawImage(image, 0, 0, image.width, image.height, 0, 0, canvas.width, canvas.height);
  4166. image = canvas;
  4167. }
  4168. gl.bindTexture(gl.TEXTURE_2D, this.obj);
  4169. gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);
  4170. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
  4171. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
  4172. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
  4173. // Enable Mip mapping on power-of-2 textures
  4174. if (isPOT(image.width) && isPOT(image.height)) {
  4175. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_LINEAR);
  4176. gl.generateMipmap(gl.TEXTURE_2D);
  4177. } else {
  4178. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
  4179. }
  4180. // Unbind texture
  4181. gl.bindTexture(gl.TEXTURE_2D, null);
  4182. }
  4183. gl.drawImage = function drawImage(image, a, b, c, d, e, f, g, h) {
  4184. image = image.image || image;
  4185. var transform = gl2d.transform;
  4186. transform.pushMatrix();
  4187. var sMask = shaderMask.texture;
  4188. var doCrop = false;
  4189. //drawImage(image, dx, dy)
  4190. if (arguments.length === 3) {
  4191. transform.translate(a, b);
  4192. transform.scale(image.width, image.height);
  4193. }
  4194. //drawImage(image, dx, dy, dw, dh)
  4195. else if (arguments.length === 5) {
  4196. transform.translate(a, b);
  4197. transform.scale(c, d);
  4198. }
  4199. //drawImage(image, sx, sy, sw, sh, dx, dy, dw, dh)
  4200. else if (arguments.length === 9) {
  4201. transform.translate(e, f);
  4202. transform.scale(g, h);
  4203. sMask = sMask | shaderMask.crop;
  4204. doCrop = true;
  4205. }
  4206. var shaderProgram = gl2d.initShaders(transform.c_stack, sMask);
  4207. var texture, cacheIndex = imageCache.indexOf(image);
  4208. if (cacheIndex !== -1) {
  4209. texture = textureCache[cacheIndex];
  4210. } else {
  4211. texture = new Texture(image);
  4212. }
  4213. if (doCrop) {
  4214. gl.uniform4f(shaderProgram.uCropSource, a / image.width, b / image.height, c / image.width, d / image.height);
  4215. }
  4216. gl.bindBuffer(gl.ARRAY_BUFFER, rectVertexPositionBuffer);
  4217. gl.vertexAttribPointer(shaderProgram.vertexPositionAttribute, 4, gl.FLOAT, false, 0, 0);
  4218. gl.bindTexture(gl.TEXTURE_2D, texture.obj);
  4219. gl.activeTexture(gl.TEXTURE0);
  4220. gl.uniform1i(shaderProgram.uSampler, 0);
  4221. sendTransformStack(shaderProgram);
  4222. gl.drawArrays(gl.TRIANGLE_FAN, 0, 4);
  4223. transform.popMatrix();
  4224. };
  4225. };
  4226. Jyo.Renderer.WebGL["2d"] = WebGL2D;
  4227. }(Math)); Jyo.Renderer.Canvas = function () {
  4228. // 添加渲染元素
  4229. this._addRenderElement("canvas");
  4230. // 获取上下文
  4231. this.context = this.canvas.getContext("2d");
  4232. };
  4233. Jyo.Renderer.Canvas.isSupport = function () {
  4234. /// <summary>检测是否支持</summary>
  4235. /// <returns type="Boolean"></returns>
  4236. if (typeof HTMLCanvasElement.prototype.getContext == "undefined") {
  4237. return false;
  4238. }
  4239. return true;
  4240. }
  4241. Jyo.Renderer.Canvas.prototype = new Jyo.Object({
  4242. mode: "Canvas",
  4243. clear: Jyo.Overload().
  4244. add(null, function () {
  4245. /// <summary>清空画布</summary>
  4246. var ctx = this.context;
  4247. ctx.clearRect(0, 0, this.width, this.height);
  4248. }).
  4249. add("Jyo.Color", function (color) {
  4250. /// <summary>清空画布</summary>
  4251. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4252. this.clear(color.toRgba());
  4253. }).
  4254. add("String", function (colorStr) {
  4255. /// <summary>清空画布</summary>
  4256. /// <param name="colorStr" type="String">颜色字符串值</param>
  4257. var ctx = this.context;
  4258. ctx.fillStyle = colorStr;
  4259. ctx.fillRect(0, 0, this.width, this.height);
  4260. }),
  4261. begin: function () {
  4262. this.context.save();
  4263. },
  4264. end: function () {
  4265. this.context.restore();
  4266. },
  4267. fillRect: Jyo.Overload().
  4268. add("Jyo.Rectangle", function (rect) {
  4269. /// <summary>绘制实心矩形</summary>
  4270. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4271. this.fillRect(rect.x, rect.y, rect.width, rect.height, String.empty);
  4272. }).
  4273. add("Number, Number, Number, Number", function (x, y, width, height) {
  4274. /// <summary>绘制实心矩形</summary>
  4275. /// <param name="x" type="Number">起始X坐标</param>
  4276. /// <param name="y" type="Number">起始Y坐标</param>
  4277. /// <param name="width" type="Number">矩形宽度</param>
  4278. /// <param name="height" type="Number">矩形高度</param>
  4279. this.fillRect(x, y, width, height, String.empty);
  4280. }).
  4281. add("Jyo.Rectangle, Jyo.Color", function (rect, color) {
  4282. /// <summary>绘制实心矩形</summary>
  4283. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4284. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4285. this.fillRect(rect.x, rect.y, rect.width, rect.height, color.toRgba());
  4286. }).
  4287. add("Number, Number, Number, Number, Jyo.Color", function (x, y, width, height, color) {
  4288. /// <summary>绘制实心矩形</summary>
  4289. /// <param name="x" type="Number">起始X坐标</param>
  4290. /// <param name="y" type="Number">起始Y坐标</param>
  4291. /// <param name="width" type="Number">矩形宽度</param>
  4292. /// <param name="height" type="Number">矩形高度</param>
  4293. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4294. this.fillRect(x, y, width, height, color.toRgba());
  4295. }).
  4296. add("Jyo.Rectangle, String", function (rect, colorStr) {
  4297. /// <summary>绘制实心矩形</summary>
  4298. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4299. /// <param name="colorStr" type="String">颜色字符串值</param>
  4300. this.fillRect(rect.x, rect.y, rect.width, rect.height, colorStr);
  4301. }).
  4302. add("Number, Number, Number, Number, String", function (x, y, width, height, colorStr) {
  4303. /// <summary>绘制实心矩形</summary>
  4304. /// <param name="x" type="Number">起始X坐标</param>
  4305. /// <param name="y" type="Number">起始Y坐标</param>
  4306. /// <param name="width" type="Number">矩形宽度</param>
  4307. /// <param name="height" type="Number">矩形高度</param>
  4308. /// <param name="colorStr" type="String">颜色字符串值</param>
  4309. ctx = this.context;
  4310. ctx.fillStyle = colorStr;
  4311. ctx.fillRect(x, y, width, height);
  4312. }),
  4313. drawRect: Jyo.Overload().
  4314. add("Jyo.Rectangle, Jyo.Color", function (rect, color) {
  4315. /// <summary>绘制空心矩形</summary>
  4316. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4317. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4318. this.drawRect(rect.x, rect.y, rect.width, rect.height, color.toRgba(), 1);
  4319. }).
  4320. add("Number, Number, Number, Number, Jyo.Color", function (x, y, width, height, color) {
  4321. /// <summary>绘制空心矩形</summary>
  4322. /// <param name="x" type="Number">起始X坐标</param>
  4323. /// <param name="y" type="Number">起始Y坐标</param>
  4324. /// <param name="width" type="Number">矩形宽度</param>
  4325. /// <param name="height" type="Number">矩形高度</param>
  4326. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4327. this.drawRect(x, y, width, height, color.toRgba(), 1);
  4328. }).
  4329. add("Jyo.Rectangle, String", function (rect, colorStr) {
  4330. /// <summary>绘制空心矩形</summary>
  4331. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4332. /// <param name="colorStr" type="String">颜色字符串值</param>
  4333. this.drawRect(rect.x, rect.y, rect.width, rect.height, colorStr, 1);
  4334. }).
  4335. add("Number, Number, Number, Number, String", function (x, y, width, height, colorStr) {
  4336. /// <summary>绘制空心矩形</summary>
  4337. /// <param name="x" type="Number">起始X坐标</param>
  4338. /// <param name="y" type="Number">起始Y坐标</param>
  4339. /// <param name="width" type="Number">矩形宽度</param>
  4340. /// <param name="height" type="Number">矩形高度</param>
  4341. /// <param name="colorStr" type="String">颜色字符串值</param>
  4342. this.drawRect(x, y, width, height, colorStr, 1);
  4343. }).
  4344. add("Jyo.Rectangle, Jyo.Color, Number", function (rect, color, lineWidth) {
  4345. /// <summary>绘制空心矩形</summary>
  4346. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4347. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4348. /// <param name="lineWidth" type="Number">线条宽度</param>
  4349. this.drawRect(rect.x, rect.y, rect.width, rect.height, color.toRgba(), lineWidth);
  4350. }).
  4351. add("Number, Number, Number, Number, Jyo.Color, Number", function (x, y, width, height, color, lineWidth) {
  4352. /// <summary>绘制空心矩形</summary>
  4353. /// <param name="x" type="Number">起始X坐标</param>
  4354. /// <param name="y" type="Number">起始Y坐标</param>
  4355. /// <param name="width" type="Number">矩形宽度</param>
  4356. /// <param name="height" type="Number">矩形高度</param>
  4357. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4358. /// <param name="lineWidth" type="Number">线条宽度</param>
  4359. this.drawRect(x, y, width, height, color.toRgba(), lineWidth);
  4360. }).
  4361. add("Jyo.Rectangle, String, Number", function (rect, colorStr, lineWidth) {
  4362. /// <summary>绘制空心矩形</summary>
  4363. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4364. /// <param name="colorStr" type="String">颜色字符串值</param>
  4365. /// <param name="lineWidth" type="Number">线条宽度</param>
  4366. this.drawRect(rect.x, rect.y, rect.width, rect.height, colorStr, lineWidth);
  4367. }).
  4368. add("Number, Number, Number, Number, String, Number", function (x, y, width, height, colorStr, lineWidth) {
  4369. /// <summary>绘制空心矩形</summary>
  4370. /// <param name="x" type="Number">起始X坐标</param>
  4371. /// <param name="y" type="Number">起始Y坐标</param>
  4372. /// <param name="width" type="Number">矩形宽度</param>
  4373. /// <param name="height" type="Number">矩形高度</param>
  4374. /// <param name="colorStr" type="String">颜色字符串值</param>
  4375. /// <param name="lineWidth" type="Number">线条宽度</param>
  4376. ctx = this.context;
  4377. ctx.lineWidth = lineWidth;
  4378. ctx.strokeStyle = colorStr;
  4379. ctx.strokeRect(x + lineWidth / 2, y + lineWidth / 2, width - lineWidth, height - lineWidth);
  4380. }),
  4381. fillRoundRect: Jyo.Overload().
  4382. add("Jyo.Rectangle, Number", function (rect, radius) {
  4383. /// <summary>绘制实心圆角矩形</summary>
  4384. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4385. /// <param name="radius" type="Number">圆角半径</param>
  4386. this.fillRoundRect(rect.x, rect.y, rect.width, rect.height, radius, String.empty);
  4387. }).
  4388. add("Jyo.Rectangle, Number, String", function (rect, radius, colorStr) {
  4389. /// <summary>绘制实心圆角矩形</summary>
  4390. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4391. /// <param name="radius" type="Number">圆角半径</param>
  4392. /// <param name="colorStr" type="String">颜色字符串值</param>
  4393. this.fillRoundRect(rect.x, rect.y, rect.width, rect.height, radius, colorStr);
  4394. }).
  4395. add("Jyo.Rectangle, Number, Jyo.Color", function (rect, radius, color) {
  4396. /// <summary>绘制实心圆角矩形</summary>
  4397. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4398. /// <param name="radius" type="Number">圆角半径</param>
  4399. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4400. this.fillRoundRect(rect.x, rect.y, rect.width, rect.height, radius, color.toRgba());
  4401. }).
  4402. add("Number, Number, Number, Number, Number", function (x, y, width, height, radius) {
  4403. /// <summary>绘制实心圆角矩形</summary>
  4404. /// <param name="x" type="Number">起始X坐标</param>
  4405. /// <param name="y" type="Number">起始Y坐标</param>
  4406. /// <param name="width" type="Number">矩形宽度</param>
  4407. /// <param name="height" type="Number">矩形高度</param>
  4408. /// <param name="radius" type="Number">圆角半径</param>
  4409. this.fillRoundRect(x, y, width, height, radius, String.empty);
  4410. }).
  4411. add("Number, Number, Number, Number, Number, Jyo.Color", function (x, y, width, height, radius, color) {
  4412. /// <summary>绘制实心圆角矩形</summary>
  4413. /// <param name="x" type="Number">起始X坐标</param>
  4414. /// <param name="y" type="Number">起始Y坐标</param>
  4415. /// <param name="width" type="Number">矩形宽度</param>
  4416. /// <param name="height" type="Number">矩形高度</param>
  4417. /// <param name="radius" type="Number">圆角半径</param>
  4418. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4419. this.fillRoundRect(x, y, width, height, radius, color.toRgba());
  4420. }).
  4421. add("Number, Number, Number, Number, Number, String", function (x, y, width, height, radius, colorStr) {
  4422. /// <summary>绘制实心矩形</summary>
  4423. /// <param name="x" type="Number">起始X坐标</param>
  4424. /// <param name="y" type="Number">起始Y坐标</param>
  4425. /// <param name="width" type="Number">矩形宽度</param>
  4426. /// <param name="height" type="Number">矩形高度</param>
  4427. /// <param name="radius" type="Number">圆角半径</param>
  4428. /// <param name="colorStr" type="String">颜色字符串值</param>
  4429. var ps = [];
  4430. ps.push(x, y + radius);
  4431. ps = ps.concat(Math.getBezierCurvePoints(x, y + height - radius, x, y + height, x + radius, y + height));
  4432. ps = ps.concat(Math.getBezierCurvePoints(x + width - radius, y + height, x + width, y + height, x + width, y + height - radius));
  4433. ps = ps.concat(Math.getBezierCurvePoints(x + width, y + radius, x + width, y, x + width - radius, y));
  4434. ps = ps.concat(Math.getBezierCurvePoints(x + radius, y, x, y, x, y + radius));
  4435. this.fillPolygon(ps, colorStr || "#000000");
  4436. }),
  4437. drawRoundRect: Jyo.Overload().
  4438. add("Jyo.Rectangle, Number", function (rect, radius) {
  4439. /// <summary>绘制实心圆角矩形</summary>
  4440. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4441. /// <param name="radius" type="Number">圆角半径</param>
  4442. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, String.empty, 1);
  4443. }).
  4444. add("Jyo.Rectangle, Number, Number", function (rect, radius, lineWidth) {
  4445. /// <summary>绘制实心圆角矩形</summary>
  4446. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4447. /// <param name="radius" type="Number">圆角半径</param>
  4448. /// <param name="lineWidth" type="Number">线段宽度</param>
  4449. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, String.empty, lineWidth);
  4450. }).
  4451. add("Jyo.Rectangle, Number, String", function (rect, radius, colorStr) {
  4452. /// <summary>绘制实心圆角矩形</summary>
  4453. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4454. /// <param name="radius" type="Number">圆角半径</param>
  4455. /// <param name="colorStr" type="String">颜色字符串值</param>
  4456. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, colorStr, 1);
  4457. }).
  4458. add("Jyo.Rectangle, Number, String, Number", function (rect, radius, colorStr, lineWidth) {
  4459. /// <summary>绘制实心圆角矩形</summary>
  4460. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4461. /// <param name="radius" type="Number">圆角半径</param>
  4462. /// <param name="colorStr" type="String">颜色字符串值</param>
  4463. /// <param name="lineWidth" type="Number">线段宽度</param>
  4464. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, colorStr, lineWidth);
  4465. }).
  4466. add("Jyo.Rectangle, Number, Jyo.Color", function (rect, radius, color) {
  4467. /// <summary>绘制实心圆角矩形</summary>
  4468. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4469. /// <param name="radius" type="Number">圆角半径</param>
  4470. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4471. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, color.toRgba(), 1);
  4472. }).
  4473. add("Jyo.Rectangle, Number, Jyo.Color, Number", function (rect, radius, color, lineWidth) {
  4474. /// <summary>绘制实心圆角矩形</summary>
  4475. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4476. /// <param name="radius" type="Number">圆角半径</param>
  4477. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4478. /// <param name="lineWidth" type="Number">线段宽度</param>
  4479. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, color.toRgba(), lineWidth);
  4480. }).
  4481. add("Number, Number, Number, Number, Number", function (x, y, width, height, radius) {
  4482. /// <summary>绘制实心圆角矩形</summary>
  4483. /// <param name="x" type="Number">起始X坐标</param>
  4484. /// <param name="y" type="Number">起始Y坐标</param>
  4485. /// <param name="width" type="Number">矩形宽度</param>
  4486. /// <param name="height" type="Number">矩形高度</param>
  4487. /// <param name="radius" type="Number">圆角半径</param>
  4488. this.drawRoundRect(x, y, width, height, radius, String.empty, 1);
  4489. }).
  4490. add("Number, Number, Number, Number, Number, Number", function (x, y, width, height, radius, lineWidth) {
  4491. /// <summary>绘制实心圆角矩形</summary>
  4492. /// <param name="x" type="Number">起始X坐标</param>
  4493. /// <param name="y" type="Number">起始Y坐标</param>
  4494. /// <param name="width" type="Number">矩形宽度</param>
  4495. /// <param name="height" type="Number">矩形高度</param>
  4496. /// <param name="radius" type="Number">圆角半径</param>
  4497. /// <param name="lineWidth" type="Number">线段宽度</param>
  4498. this.drawRoundRect(x, y, width, height, radius, String.empty, lineWidth);
  4499. }).
  4500. add("Number, Number, Number, Number, Number, Jyo.Color", function (x, y, width, height, radius, color) {
  4501. /// <summary>绘制实心圆角矩形</summary>
  4502. /// <param name="x" type="Number">起始X坐标</param>
  4503. /// <param name="y" type="Number">起始Y坐标</param>
  4504. /// <param name="width" type="Number">矩形宽度</param>
  4505. /// <param name="height" type="Number">矩形高度</param>
  4506. /// <param name="radius" type="Number">圆角半径</param>
  4507. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4508. this.drawRoundRect(x, y, width, height, radius, color.toRgba(), 1);
  4509. }).
  4510. add("Number, Number, Number, Number, Number, Jyo.Color, Number", function (x, y, width, height, radius, color, lineWidth) {
  4511. /// <summary>绘制实心圆角矩形</summary>
  4512. /// <param name="x" type="Number">起始X坐标</param>
  4513. /// <param name="y" type="Number">起始Y坐标</param>
  4514. /// <param name="width" type="Number">矩形宽度</param>
  4515. /// <param name="height" type="Number">矩形高度</param>
  4516. /// <param name="radius" type="Number">圆角半径</param>
  4517. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4518. /// <param name="lineWidth" type="Number">线段宽度</param>
  4519. this.drawRoundRect(x, y, width, height, radius, color.toRgba(), lineWidth);
  4520. }).
  4521. add("Number, Number, Number, Number, Number, String", function (x, y, width, height, radius, colorStr) {
  4522. /// <summary>绘制实心圆角矩形</summary>
  4523. /// <param name="x" type="Number">起始X坐标</param>
  4524. /// <param name="y" type="Number">起始Y坐标</param>
  4525. /// <param name="width" type="Number">矩形宽度</param>
  4526. /// <param name="height" type="Number">矩形高度</param>
  4527. /// <param name="radius" type="Number">圆角半径</param>
  4528. /// <param name="colorStr" type="String">颜色字符串值</param>
  4529. this.drawRoundRect(x, y, width, height, radius, colorStr, 1);
  4530. }).
  4531. add("Number, Number, Number, Number, Number, String, Number", function (x, y, width, height, radius, colorStr, lineWidth) {
  4532. /// <summary>绘制实心圆角矩形</summary>
  4533. /// <param name="x" type="Number">起始X坐标</param>
  4534. /// <param name="y" type="Number">起始Y坐标</param>
  4535. /// <param name="width" type="Number">矩形宽度</param>
  4536. /// <param name="height" type="Number">矩形高度</param>
  4537. /// <param name="radius" type="Number">圆角半径</param>
  4538. /// <param name="colorStr" type="String">颜色字符串值</param>
  4539. /// <param name="lineWidth" type="Number">线段宽度</param>
  4540. var ps = [];
  4541. ps.push(x, y + radius);
  4542. ps = ps.concat(Math.getBezierCurvePoints(x, y + height - radius, x, y + height, x + radius, y + height));
  4543. ps = ps.concat(Math.getBezierCurvePoints(x + width - radius, y + height, x + width, y + height, x + width, y + height - radius));
  4544. ps = ps.concat(Math.getBezierCurvePoints(x + width, y + radius, x + width, y, x + width - radius, y));
  4545. ps = ps.concat(Math.getBezierCurvePoints(x + radius, y, x, y, x, y + radius));
  4546. this.drawPolygon(ps, colorStr || "#000000", lineWidth);
  4547. }),
  4548. drawImage: Jyo.Overload().
  4549. add("*, Number, Number", function (element, x, y) {
  4550. /// <summary>绘制图象</summary>
  4551. /// <param name="element" type="Object">要绘制的元素</param>
  4552. /// <param name="x" type="Number">起始X坐标</param>
  4553. /// <param name="y" type="Number">起始Y坐标</param>
  4554. this.context.drawImage(element.object || element, x, y);
  4555. }).
  4556. add("*, Jyo.Rectangle", function (element, rect) {
  4557. /// <summary>绘制图象</summary>
  4558. /// <param name="element" type="Object">要绘制的元素</param>
  4559. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4560. this.drawImage(element.object || element, rect.x, rect.y, rect.width, rect.height);
  4561. }).
  4562. add("*, Number, Number, Number, Number", function (element, x, y, width, height) {
  4563. /// <summary>绘制图象</summary>
  4564. /// <param name="element" type="Object">要绘制的元素</param>
  4565. /// <param name="x" type="Number">起始X坐标</param>
  4566. /// <param name="y" type="Number">起始Y坐标</param>
  4567. /// <param name="width" type="Number">图像宽度</param>
  4568. /// <param name="height" type="Number">图像高度</param>
  4569. this.context.drawImage(element.object || element, x, y, width, height);
  4570. }).
  4571. add("*, Number, Number, Number, Number, Number, Number, Number, Number", function (element, x, y, width, height, cx, cy, cwidth, cheight) {
  4572. /// <summary>绘制图象</summary>
  4573. /// <param name="element" type="Object">要绘制的元素</param>
  4574. /// <param name="x" type="Number">起始X坐标</param>
  4575. /// <param name="y" type="Number">起始Y坐标</param>
  4576. /// <param name="width" type="Number">图像宽度</param>
  4577. /// <param name="height" type="Number">图像高度</param>
  4578. /// <param name="cx" type="Number">在原图坐标上进行剪裁的起始X坐标</param>
  4579. /// <param name="cy" type="Number">在原图坐标上进行剪裁的起始Y坐标</param>
  4580. /// <param name="cwidth" type="Number">在原图坐标上进行剪裁的图像宽度</param>
  4581. /// <param name="cheight" type="Number">在原图坐标上进行剪裁的图像高度</param>
  4582. this.context.drawImage(element.object || element, cx, cy, cwidth, cheight, x, y, width, height);
  4583. }),
  4584. drawText: Jyo.Overload().
  4585. add("String, Number, Number", function (str, x, y) {
  4586. /// <summary>绘制文字</summary>
  4587. /// <param name="str" type="String">要显示的文字</param>
  4588. /// <param name="x" type="Number">起始X坐标</param>
  4589. /// <param name="y" type="Number">起始Y坐标</param>
  4590. this.drawText(str, x, y, String.empty, String.empty);
  4591. }).
  4592. add("String, Number, Number, Jyo.Color", function (str, x, y, color) {
  4593. /// <summary>绘制文字</summary>
  4594. /// <param name="str" type="String">要显示的文字</param>
  4595. /// <param name="x" type="Number">起始X坐标</param>
  4596. /// <param name="y" type="Number">起始Y坐标</param>
  4597. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4598. this.drawText(str, x, y, color.toRgba(), String.empty);
  4599. }).
  4600. add("String, Number, Number, String", function (str, x, y, colorStr) {
  4601. /// <summary>绘制文字</summary>
  4602. /// <param name="str" type="String">要显示的文字</param>
  4603. /// <param name="x" type="Number">起始X坐标</param>
  4604. /// <param name="y" type="Number">起始Y坐标</param>
  4605. /// <param name="colorStr" type="String">颜色字符串值</param>
  4606. this.drawText(str, x, y, colorStr, String.empty);
  4607. }).
  4608. add("String, Number, Number, Jyo.Color, String", function (str, x, y, color, font) {
  4609. /// <summary>绘制文字</summary>
  4610. /// <param name="str" type="String">要显示的文字</param>
  4611. /// <param name="x" type="Number">起始X坐标</param>
  4612. /// <param name="y" type="Number">起始Y坐标</param>
  4613. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4614. /// <param name="font" type="String">字体字符串值</param>
  4615. this.drawText(str, x, y, color.toRgba(), font);
  4616. }).
  4617. add("String, Number, Number, String, String", function (str, x, y, colorStr, font) {
  4618. /// <summary>绘制文字</summary>
  4619. /// <param name="str" type="String">要显示的文字</param>
  4620. /// <param name="x" type="Number">起始X坐标</param>
  4621. /// <param name="y" type="Number">起始Y坐标</param>
  4622. /// <param name="colorStr" type="String">颜色字符串值</param>
  4623. /// <param name="font" type="String">字体字符串值</param>
  4624. var ctx = this.context;
  4625. ctx.fillStyle = colorStr || "#000000";
  4626. ctx.font = font || "14px Arial";
  4627. var strList = str.split(/\r\n|\n|\r/ig);
  4628. var fontHeight = this.getTextHeight(str, ctx.font);
  4629. for (var i = 0; i < strList.length; i++) {
  4630. ctx.fillText(strList[i], x, y + fontHeight * (i + 0.8));
  4631. }
  4632. }),
  4633. drawLine: Jyo.Overload().
  4634. add("Number, Number, Number, Number", function (x1, y1, x2, y2) {
  4635. /// <summary>绘制线段</summary>
  4636. /// <param name="x1" type="Number">起始X坐标</param>
  4637. /// <param name="y1" type="Number">起始Y坐标</param>
  4638. /// <param name="x2" type="Number">结束X坐标</param>
  4639. /// <param name="y2" type="Number">结束Y坐标</param>
  4640. this.drawLine(x1, y1, x2, y2, String.empty, 1, String.empty);
  4641. }).
  4642. add("Number, Number, Number, Number, Jyo.Color", function (x1, y1, x2, y2, color) {
  4643. /// <summary>绘制线段</summary>
  4644. /// <param name="x1" type="Number">起始X坐标</param>
  4645. /// <param name="y1" type="Number">起始Y坐标</param>
  4646. /// <param name="x2" type="Number">结束X坐标</param>
  4647. /// <param name="y2" type="Number">结束Y坐标</param>
  4648. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4649. this.drawLine(x1, y1, x2, y2, color.toRgba(), 1, String.empty);
  4650. }).
  4651. add("Number, Number, Number, Number, String", function (x1, y1, x2, y2, colorStr) {
  4652. /// <summary>绘制线段</summary>
  4653. /// <param name="x1" type="Number">起始X坐标</param>
  4654. /// <param name="y1" type="Number">起始Y坐标</param>
  4655. /// <param name="x2" type="Number">结束X坐标</param>
  4656. /// <param name="y2" type="Number">结束Y坐标</param>
  4657. /// <param name="colorStr" type="String">颜色字符串值</param>
  4658. this.drawLine(x1, y1, x2, y2, colorStr, 1, String.empty);
  4659. }).
  4660. add("Number, Number, Number, Number, Jyo.Color, Number", function (x1, y1, x2, y2, color, lineWidth) {
  4661. /// <summary>绘制线段</summary>
  4662. /// <param name="x1" type="Number">起始X坐标</param>
  4663. /// <param name="y1" type="Number">起始Y坐标</param>
  4664. /// <param name="x2" type="Number">结束X坐标</param>
  4665. /// <param name="y2" type="Number">结束Y坐标</param>
  4666. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4667. /// <param name="lineWidth" type="Number">线条宽度</param>
  4668. this.drawLine(x1, y1, x2, y2, color.toRgba(), lineWidth, String.empty);
  4669. }).
  4670. add("Number, Number, Number, Number, String, Number", function (x1, y1, x2, y2, colorStr, lineWidth) {
  4671. /// <summary>绘制线段</summary>
  4672. /// <param name="x1" type="Number">起始X坐标</param>
  4673. /// <param name="y1" type="Number">起始Y坐标</param>
  4674. /// <param name="x2" type="Number">结束X坐标</param>
  4675. /// <param name="y2" type="Number">结束Y坐标</param>
  4676. /// <param name="colorStr" type="String">颜色字符串值</param>
  4677. /// <param name="lineWidth" type="Number">线条宽度</param>
  4678. this.drawLine(x1, y1, x2, y2, colorStr, lineWidth, String.empty);
  4679. }).
  4680. add("Number, Number, Number, Number, Jyo.Color, Number, String", function (x1, y1, x2, y2, color, lineWidth, cap) {
  4681. /// <summary>绘制线段</summary>
  4682. /// <param name="x1" type="Number">起始X坐标</param>
  4683. /// <param name="y1" type="Number">起始Y坐标</param>
  4684. /// <param name="x2" type="Number">结束X坐标</param>
  4685. /// <param name="y2" type="Number">结束Y坐标</param>
  4686. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4687. /// <param name="lineWidth" type="Number">线条宽度</param>
  4688. /// <param name="cap" type="String">闭合样式</param>
  4689. this.drawLine(x1, y1, x2, y2, color.toRgba(), lineWidth, cap);
  4690. }).
  4691. add("Number, Number, Number, Number, String, Number, String", function (x1, y1, x2, y2, colorStr, lineWidth, cap) {
  4692. /// <summary>绘制线段</summary>
  4693. /// <param name="x1" type="Number">起始X坐标</param>
  4694. /// <param name="y1" type="Number">起始Y坐标</param>
  4695. /// <param name="x2" type="Number">结束X坐标</param>
  4696. /// <param name="y2" type="Number">结束Y坐标</param>
  4697. /// <param name="colorStr" type="String">颜色字符串值</param>
  4698. /// <param name="lineWidth" type="Number">线条宽度</param>
  4699. /// <param name="cap" type="String">闭合样式</param>
  4700. var ctx = this.context;
  4701. ctx.strokeStyle = colorStr || "#000000";
  4702. ctx.lineWidth = lineWidth || 1.0;
  4703. ctx.lineCap = cap || "butt";
  4704. ctx.beginPath();
  4705. ctx.moveTo(x1, y1);
  4706. ctx.lineTo(x2, y2);
  4707. ctx.closePath();
  4708. ctx.stroke();
  4709. }),
  4710. drawPolygon: Jyo.Overload().
  4711. add("Array", function (list) {
  4712. /// <summary>绘制空心多边形</summary>
  4713. /// <param name="list" type="Array">顶点列表</param>
  4714. this.drawPolygon(list, String.empty, 1, String.empty);
  4715. }).
  4716. add("Array, Jyo.Color", function (list, color) {
  4717. /// <summary>绘制空心多边形</summary>
  4718. /// <param name="list" type="Array">顶点列表</param>
  4719. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4720. this.drawPolygon(list, color.toRgba(), 1, String.empty);
  4721. }).
  4722. add("Array, String", function (list, colorStr) {
  4723. /// <summary>绘制空心多边形</summary>
  4724. /// <param name="list" type="Array">顶点列表</param>
  4725. /// <param name="colorStr" type="String">颜色字符串值</param>
  4726. this.drawPolygon(list, colorStr, 1, String.empty);
  4727. }).
  4728. add("Array, Jyo.Color, Number", function (list, color, lineWidth) {
  4729. /// <summary>绘制空心多边形</summary>
  4730. /// <param name="list" type="Array">顶点列表</param>
  4731. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4732. /// <param name="lineWidth" type="Number">线条宽度</param>
  4733. this.drawPolygon(list, color.toRgba(), lineWidth, String.empty);
  4734. }).
  4735. add("Array, String, Number", function (list, colorStr, lineWidth) {
  4736. /// <summary>绘制空心多边形</summary>
  4737. /// <param name="list" type="Array">顶点列表</param>
  4738. /// <param name="colorStr" type="String">颜色字符串值</param>
  4739. /// <param name="lineWidth" type="Number">线条宽度</param>
  4740. this.drawPolygon(list, colorStr, lineWidth, String.empty);
  4741. }).
  4742. add("Array, Jyo.Color, Number, String", function (list, color, lineWidth, lineJoin) {
  4743. /// <summary>绘制空心多边形</summary>
  4744. /// <param name="list" type="Array">顶点列表</param>
  4745. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4746. /// <param name="lineWidth" type="Number">线条宽度</param>
  4747. /// <param name="lineJoin" type="String">线条闭合样式</param>
  4748. this.drawPolygon(list, color.toRgba(), lineWidth, lineJoin);
  4749. }).
  4750. add("Array, String, Number, String", function (list, colorStr, lineWidth, lineJoin) {
  4751. /// <summary>绘制空心多边形</summary>
  4752. /// <param name="list" type="Array">顶点列表</param>
  4753. /// <param name="colorStr" type="String">颜色字符串值</param>
  4754. /// <param name="lineWidth" type="Number">线条宽度</param>
  4755. /// <param name="lineJoin" type="String">线条闭合样式</param>
  4756. if (list.length % 2 != 0) list.length = length - 1;
  4757. if (!list.length) return;
  4758. var ctx = this.context;
  4759. ctx.strokeStyle = colorStr || "#000000";
  4760. ctx.lineWidth = lineWidth || 1.0;
  4761. ctx.lineJoin = lineJoin || "miter";
  4762. ctx.beginPath();
  4763. ctx.moveTo(list[0], list[1]);
  4764. for (var i = 2, len = list.length; i < len; i += 2) ctx.lineTo(list[i], list[i + 1]);
  4765. ctx.closePath();
  4766. ctx.stroke();
  4767. }),
  4768. fillPolygon: Jyo.Overload().
  4769. add("Array", function (list) {
  4770. /// <summary>绘制实心多边形</summary>
  4771. /// <param name="list" type="Array">顶点列表</param>
  4772. this.fillPolygon(list, String.empty);
  4773. }).
  4774. add("Array, Jyo.Color", function (list, color) {
  4775. /// <summary>绘制实心多边形</summary>
  4776. /// <param name="list" type="Array">顶点列表</param>
  4777. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4778. this.fillPolygon(list, color.toRgba());
  4779. }).
  4780. add("Array, String", function (list, colorStr) {
  4781. /// <summary>绘制实心多边形</summary>
  4782. /// <param name="list" type="Array">顶点列表</param>
  4783. /// <param name="colorStr" type="String">颜色字符串值</param>
  4784. if (list.length % 2 != 0) list.length = length - 1;
  4785. if (!list.length) return;
  4786. var ctx = this.context;
  4787. ctx.fillStyle = colorStr || "#000000";
  4788. ctx.beginPath();
  4789. ctx.moveTo(list[0], list[1]);
  4790. for (var i = 2, len = list.length; i < len; i += 2) ctx.lineTo(list[i], list[i + 1]);
  4791. ctx.closePath();
  4792. ctx.fill();
  4793. })
  4794. }); Jyo.Renderer.Css = function () {
  4795. // 添加渲染元素
  4796. this._addRenderElement("div");
  4797. // 隐藏超出部分
  4798. this.canvas.style.overflow = "hidden";
  4799. this.context = {};
  4800. // 用于开启硬件加速的样式
  4801. this.css3d = function () {
  4802. var element = document.createElement("div");
  4803. if ("transform" in element.style || Jyo.prefix.lowercase + "Transform" in element.style) {
  4804. element.style["transform"] = "translateZ(1px)";
  4805. element.style[Jyo.prefix.lowercase + "Transform"] = "translateZ(1px)";
  4806. if (element.style["transform"] === "translateZ(1px)" ||
  4807. element.style[Jyo.prefix.lowercase + "Transform"] === "translateZ(1px)") {
  4808. return "transform: translateZ(0px);" +
  4809. Jyo.prefix.css + "transform: translateZ(0px);" +
  4810. "backface-visibility: hidden;" +
  4811. Jyo.prefix.css + "backface-visibility: hidden;" +
  4812. "perspective: 1000;" +
  4813. Jyo.prefix.css + "perspective: 1000;" +
  4814. "transform-origin: 50% 50%;" +
  4815. Jyo.prefix.css + "transform-origin: 50% 50%;";
  4816. }
  4817. } else {
  4818. return String.empty;
  4819. }
  4820. }();
  4821. // 缓存列表
  4822. this.catchList = [];
  4823. // 临时列表
  4824. this.tempList = [];
  4825. // 基础元素
  4826. this.baseElement = document.createElement("div");
  4827. this.baseElement.style.position = "absolute";
  4828. this.baseElement.style["pointer-events"] = "none";
  4829. this.baseElement.style.cssText += this.css3d;
  4830. };
  4831. Jyo.Renderer.Css.isSupport = function () {
  4832. /// <summary>检测是否支持</summary>
  4833. /// <returns type="Boolean"></returns>
  4834. var element = document.createElement("div");
  4835. return "borderRadius" in element.style;
  4836. }
  4837. Jyo.Renderer.Css.prototype = new Jyo.Object({
  4838. mode: "Css",
  4839. _autoSize: function (parentWidth, parentHeight) {
  4840. /// <summary>自动缩放</summary>
  4841. /// <param name="parentWidth" type="Number">父容器宽度</param>
  4842. /// <param name="parentHeight" type="Number">父容器高度</param>
  4843. var cs = this.domElement.style;
  4844. cs.position = "relative";
  4845. cs.width = this.width + "px";
  4846. cs.height = this.height + "px";
  4847. if (this.autoSizeMode == "ratio") {
  4848. // 同比缩放设置
  4849. // 计算缩放值
  4850. var scaling = Math.min(parentWidth / this.width, parentHeight / this.height);
  4851. cs.left = cs.top = "50%";
  4852. cs.marginLeft = "-" + this.width / 2 + "px";
  4853. cs.marginTop = "-" + (this.height * scaling / 2) + "px";
  4854. cs[Jyo.prefix.lowercase + "Transform"] = "scale(" + scaling + "," + scaling + ")";
  4855. cs["transform"] = "scale(" + scaling + "," + scaling + ")";
  4856. cs[Jyo.prefix.lowercase + "TransformOrigin"] = "50% 0%";
  4857. cs["transformOrigin"] = "50% 0%";
  4858. }
  4859. else if (this.autoSizeMode === "fill") {
  4860. // 填充缩放设置
  4861. cs.left = "0px";
  4862. cs.top = "0px";
  4863. cs.marginLeft = "0px";
  4864. cs.marginTop = "0px";
  4865. var scale = "scale(" + parentWidth / this.width + "," + parentHeight / this.height + ")";
  4866. cs[Jyo.prefix.lowercase + "Transform"] = scale;
  4867. cs["transform"] = scale;
  4868. cs[Jyo.prefix.lowercase + "TransformOrigin"] = "0% 0%";
  4869. cs["transformOrigin"] = "0% 0%";
  4870. }
  4871. },
  4872. clear: Jyo.Overload().
  4873. add(null, function () {
  4874. /// <summary>清空画布</summary>
  4875. return;
  4876. }).
  4877. add("Jyo.Color", function (color) {
  4878. /// <summary>清空画布</summary>
  4879. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4880. this.clear(color.toRgba());
  4881. }).
  4882. add("String", function (colorStr) {
  4883. /// <summary>清空画布</summary>
  4884. /// <param name="colorStr" type="String">颜色字符串值</param>
  4885. this.canvas.style.backgroundColor = colorStr;
  4886. this.canvas.innerHTML = String.empty;
  4887. }),
  4888. begin: function () {
  4889. /// <summary>开始绘制</summary>
  4890. this.tempList.clear();
  4891. },
  4892. end: function () {
  4893. /// <summary>结束绘制</summary>
  4894. var tl = this.tempList,
  4895. cl = this.catchList;
  4896. // 检查若有节点增删则重置画布
  4897. if (tl.length != cl.length) {
  4898. cl.clear();
  4899. this.canvas.innerHTML = String.empty;
  4900. }
  4901. // 重新创建元素
  4902. if (!cl.length) {
  4903. var frag = document.createDocumentFragment();
  4904. for (var i = tl.length; i-- ;) {
  4905. cl.push({ element: this.baseElement.cloneNode(false), style: {} });
  4906. frag.appendChild(cl[cl.length - 1].element);
  4907. }
  4908. this.canvas.appendChild(frag);
  4909. }
  4910. var el;
  4911. for (var i = 0; i < cl.length; i++) {
  4912. el = cl[i];
  4913. // 仅更新存在差异的属性
  4914. if (Object.keys(el.style).length != Object.keys(tl[i]).length || function () {
  4915. for (var n in tl[i]) {
  4916. if (tl[i][n] != el.style[n]) return true;
  4917. }
  4918. return false;
  4919. }()) {
  4920. for (var n in tl[i]) {
  4921. if (n == "text") {
  4922. el.element.innerHTML = tl[i][n];
  4923. continue;
  4924. }
  4925. el.element.style[n] = tl[i][n];
  4926. }
  4927. el.style = tl[i];
  4928. }
  4929. }
  4930. },
  4931. fillRect: Jyo.Overload().
  4932. add("Jyo.Rectangle", function (rect) {
  4933. /// <summary>绘制实心矩形</summary>
  4934. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4935. this.fillRect(rect.x, rect.y, rect.width, rect.height, String.empty);
  4936. }).
  4937. add("Number, Number, Number, Number", function (x, y, width, height) {
  4938. /// <summary>绘制实心矩形</summary>
  4939. /// <param name="x" type="Number">起始X坐标</param>
  4940. /// <param name="y" type="Number">起始Y坐标</param>
  4941. /// <param name="width" type="Number">矩形宽度</param>
  4942. /// <param name="height" type="Number">矩形高度</param>
  4943. this.fillRect(x, y, width, height, String.empty);
  4944. }).
  4945. add("Jyo.Rectangle, Jyo.Color", function (rect, color) {
  4946. /// <summary>绘制实心矩形</summary>
  4947. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4948. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4949. this.fillRect(rect.x, rect.y, rect.width, rect.height, color.toRgba());
  4950. }).
  4951. add("Number, Number, Number, Number, Jyo.Color", function (x, y, width, height, color) {
  4952. /// <summary>绘制实心矩形</summary>
  4953. /// <param name="x" type="Number">起始X坐标</param>
  4954. /// <param name="y" type="Number">起始Y坐标</param>
  4955. /// <param name="width" type="Number">矩形宽度</param>
  4956. /// <param name="height" type="Number">矩形高度</param>
  4957. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4958. this.fillRect(x, y, width, height, color.toRgba());
  4959. }).
  4960. add("Jyo.Rectangle, String", function (rect, colorStr) {
  4961. /// <summary>绘制实心矩形</summary>
  4962. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4963. /// <param name="colorStr" type="String">颜色字符串值</param>
  4964. this.fillRect(rect.x, rect.y, rect.width, rect.height, colorStr);
  4965. }).
  4966. add("Number, Number, Number, Number, String", function (x, y, width, height, colorStr) {
  4967. /// <summary>绘制实心矩形</summary>
  4968. /// <param name="x" type="Number">起始X坐标</param>
  4969. /// <param name="y" type="Number">起始Y坐标</param>
  4970. /// <param name="width" type="Number">矩形宽度</param>
  4971. /// <param name="height" type="Number">矩形高度</param>
  4972. /// <param name="colorStr" type="String">颜色字符串值</param>
  4973. this.tempList.push({
  4974. left: x + "px",
  4975. top: y + "px",
  4976. width: width + "px",
  4977. height: height + "px",
  4978. backgroundColor: colorStr || "#000000"
  4979. });
  4980. }),
  4981. drawRect: Jyo.Overload().
  4982. add("Jyo.Rectangle, Jyo.Color", function (rect, color) {
  4983. /// <summary>绘制空心矩形</summary>
  4984. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  4985. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4986. this.drawRect(rect.x, rect.y, rect.width, rect.height, color.toRgba(), 1);
  4987. }).
  4988. add("Number, Number, Number, Number, Jyo.Color", function (x, y, width, height, color) {
  4989. /// <summary>绘制空心矩形</summary>
  4990. /// <param name="x" type="Number">起始X坐标</param>
  4991. /// <param name="y" type="Number">起始Y坐标</param>
  4992. /// <param name="width" type="Number">矩形宽度</param>
  4993. /// <param name="height" type="Number">矩形高度</param>
  4994. /// <param name="color" type="Jyo.Color">颜色对象</param>
  4995. this.drawRect(x, y, width, height, color.toRgba(), 1);
  4996. }).
  4997. add("Jyo.Rectangle, String", function (rect, colorStr) {
  4998. /// <summary>绘制空心矩形</summary>
  4999. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  5000. /// <param name="colorStr" type="String">颜色字符串值</param>
  5001. this.drawRect(rect.x, rect.y, rect.width, rect.height, colorStr, 1);
  5002. }).
  5003. add("Number, Number, Number, Number, String", function (x, y, width, height, colorStr) {
  5004. /// <summary>绘制空心矩形</summary>
  5005. /// <param name="x" type="Number">起始X坐标</param>
  5006. /// <param name="y" type="Number">起始Y坐标</param>
  5007. /// <param name="width" type="Number">矩形宽度</param>
  5008. /// <param name="height" type="Number">矩形高度</param>
  5009. /// <param name="colorStr" type="String">颜色字符串值</param>
  5010. this.drawRect(x, y, width, height, colorStr, 1);
  5011. }).
  5012. add("Jyo.Rectangle, Jyo.Color, Number", function (rect, color, lineWidth) {
  5013. /// <summary>绘制空心矩形</summary>
  5014. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  5015. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5016. /// <param name="lineWidth" type="Number">线条宽度</param>
  5017. this.drawRect(rect.x, rect.y, rect.width, rect.height, color.toRgba(), lineWidth);
  5018. }).
  5019. add("Number, Number, Number, Number, Jyo.Color, Number", function (x, y, width, height, color, lineWidth) {
  5020. /// <summary>绘制空心矩形</summary>
  5021. /// <param name="x" type="Number">起始X坐标</param>
  5022. /// <param name="y" type="Number">起始Y坐标</param>
  5023. /// <param name="width" type="Number">矩形宽度</param>
  5024. /// <param name="height" type="Number">矩形高度</param>
  5025. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5026. /// <param name="lineWidth" type="Number">线条宽度</param>
  5027. this.drawRect(x, y, width, height, color.toRgba(), lineWidth);
  5028. }).
  5029. add("Jyo.Rectangle, String, Number", function (rect, colorStr, lineWidth) {
  5030. /// <summary>绘制空心矩形</summary>
  5031. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  5032. /// <param name="colorStr" type="String">颜色字符串值</param>
  5033. /// <param name="lineWidth" type="Number">线条宽度</param>
  5034. this.drawRect(rect.x, rect.y, rect.width, rect.height, colorStr, lineWidth);
  5035. }).
  5036. add("Number, Number, Number, Number, String, Number", function (x, y, width, height, colorStr, lineWidth) {
  5037. /// <summary>绘制空心矩形</summary>
  5038. /// <param name="x" type="Number">起始X坐标</param>
  5039. /// <param name="y" type="Number">起始Y坐标</param>
  5040. /// <param name="width" type="Number">矩形宽度</param>
  5041. /// <param name="height" type="Number">矩形高度</param>
  5042. /// <param name="colorStr" type="String">颜色字符串值</param>
  5043. /// <param name="lineWidth" type="Number">线条宽度</param>
  5044. lineWidth = lineWidth || 1.0;
  5045. this.tempList.push({
  5046. left: x + "px",
  5047. top: y + "px",
  5048. width: (width - lineWidth * 2) + "px",
  5049. height: (height - lineWidth * 2) + "px",
  5050. border: "solid " + lineWidth + "px " + (colorStr || "#000000")
  5051. });
  5052. }),
  5053. fillRoundRect: Jyo.Overload().
  5054. add("Jyo.Rectangle, Number", function (rect, radius) {
  5055. /// <summary>绘制实心圆角矩形</summary>
  5056. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  5057. /// <param name="radius" type="Number">圆角半径</param>
  5058. this.fillRoundRect(rect.x, rect.y, rect.width, rect.height, radius, String.empty);
  5059. }).
  5060. add("Jyo.Rectangle, Number, String", function (rect, radius, colorStr) {
  5061. /// <summary>绘制实心圆角矩形</summary>
  5062. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  5063. /// <param name="radius" type="Number">圆角半径</param>
  5064. /// <param name="colorStr" type="String">颜色字符串值</param>
  5065. this.fillRoundRect(rect.x, rect.y, rect.width, rect.height, radius, colorStr);
  5066. }).
  5067. add("Jyo.Rectangle, Number, Jyo.Color", function (rect, radius, color) {
  5068. /// <summary>绘制实心圆角矩形</summary>
  5069. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  5070. /// <param name="radius" type="Number">圆角半径</param>
  5071. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5072. this.fillRoundRect(rect.x, rect.y, rect.width, rect.height, radius, color.toRgba());
  5073. }).
  5074. add("Number, Number, Number, Number, Number", function (x, y, width, height, radius) {
  5075. /// <summary>绘制实心圆角矩形</summary>
  5076. /// <param name="x" type="Number">起始X坐标</param>
  5077. /// <param name="y" type="Number">起始Y坐标</param>
  5078. /// <param name="width" type="Number">矩形宽度</param>
  5079. /// <param name="height" type="Number">矩形高度</param>
  5080. /// <param name="radius" type="Number">圆角半径</param>
  5081. this.fillRoundRect(x, y, width, height, radius, String.empty);
  5082. }).
  5083. add("Number, Number, Number, Number, Number, Jyo.Color", function (x, y, width, height, radius, color) {
  5084. /// <summary>绘制实心圆角矩形</summary>
  5085. /// <param name="x" type="Number">起始X坐标</param>
  5086. /// <param name="y" type="Number">起始Y坐标</param>
  5087. /// <param name="width" type="Number">矩形宽度</param>
  5088. /// <param name="height" type="Number">矩形高度</param>
  5089. /// <param name="radius" type="Number">圆角半径</param>
  5090. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5091. this.fillRoundRect(x, y, width, height, radius, color.toRgba());
  5092. }).
  5093. add("Number, Number, Number, Number, Number, String", function (x, y, width, height, radius, colorStr) {
  5094. /// <summary>绘制实心矩形</summary>
  5095. /// <param name="x" type="Number">起始X坐标</param>
  5096. /// <param name="y" type="Number">起始Y坐标</param>
  5097. /// <param name="width" type="Number">矩形宽度</param>
  5098. /// <param name="height" type="Number">矩形高度</param>
  5099. /// <param name="radius" type="Number">圆角半径</param>
  5100. /// <param name="colorStr" type="String">颜色字符串值</param>
  5101. this.tempList.push({
  5102. left: x + "px",
  5103. top: y + "px",
  5104. width: width + "px",
  5105. height: height + "px",
  5106. borderRadius: radius + "px",
  5107. backgroundColor: colorStr || "#000000"
  5108. });
  5109. }),
  5110. drawRoundRect: Jyo.Overload().
  5111. add("Jyo.Rectangle, Number", function (rect, radius) {
  5112. /// <summary>绘制实心圆角矩形</summary>
  5113. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  5114. /// <param name="radius" type="Number">圆角半径</param>
  5115. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, String.empty, 1);
  5116. }).
  5117. add("Jyo.Rectangle, Number, Number", function (rect, radius, lineWidth) {
  5118. /// <summary>绘制实心圆角矩形</summary>
  5119. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  5120. /// <param name="radius" type="Number">圆角半径</param>
  5121. /// <param name="lineWidth" type="Number">线段宽度</param>
  5122. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, String.empty, lineWidth);
  5123. }).
  5124. add("Jyo.Rectangle, Number, String", function (rect, radius, colorStr) {
  5125. /// <summary>绘制实心圆角矩形</summary>
  5126. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  5127. /// <param name="radius" type="Number">圆角半径</param>
  5128. /// <param name="colorStr" type="String">颜色字符串值</param>
  5129. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, colorStr, 1);
  5130. }).
  5131. add("Jyo.Rectangle, Number, String, Number", function (rect, radius, colorStr, lineWidth) {
  5132. /// <summary>绘制实心圆角矩形</summary>
  5133. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  5134. /// <param name="radius" type="Number">圆角半径</param>
  5135. /// <param name="colorStr" type="String">颜色字符串值</param>
  5136. /// <param name="lineWidth" type="Number">线段宽度</param>
  5137. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, colorStr, lineWidth);
  5138. }).
  5139. add("Jyo.Rectangle, Number, Jyo.Color", function (rect, radius, color) {
  5140. /// <summary>绘制实心圆角矩形</summary>
  5141. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  5142. /// <param name="radius" type="Number">圆角半径</param>
  5143. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5144. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, color.toRgba(), 1);
  5145. }).
  5146. add("Jyo.Rectangle, Number, Jyo.Color, Number", function (rect, radius, color, lineWidth) {
  5147. /// <summary>绘制实心圆角矩形</summary>
  5148. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  5149. /// <param name="radius" type="Number">圆角半径</param>
  5150. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5151. /// <param name="lineWidth" type="Number">线段宽度</param>
  5152. this.drawRoundRect(rect.x, rect.y, rect.width, rect.height, radius, color.toRgba(), lineWidth);
  5153. }).
  5154. add("Number, Number, Number, Number, Number", function (x, y, width, height, radius) {
  5155. /// <summary>绘制实心圆角矩形</summary>
  5156. /// <param name="x" type="Number">起始X坐标</param>
  5157. /// <param name="y" type="Number">起始Y坐标</param>
  5158. /// <param name="width" type="Number">矩形宽度</param>
  5159. /// <param name="height" type="Number">矩形高度</param>
  5160. /// <param name="radius" type="Number">圆角半径</param>
  5161. this.drawRoundRect(x, y, width, height, radius, String.empty, 1);
  5162. }).
  5163. add("Number, Number, Number, Number, Number, Number", function (x, y, width, height, radius, lineWidth) {
  5164. /// <summary>绘制实心圆角矩形</summary>
  5165. /// <param name="x" type="Number">起始X坐标</param>
  5166. /// <param name="y" type="Number">起始Y坐标</param>
  5167. /// <param name="width" type="Number">矩形宽度</param>
  5168. /// <param name="height" type="Number">矩形高度</param>
  5169. /// <param name="radius" type="Number">圆角半径</param>
  5170. /// <param name="lineWidth" type="Number">线段宽度</param>
  5171. this.drawRoundRect(x, y, width, height, radius, String.empty, lineWidth);
  5172. }).
  5173. add("Number, Number, Number, Number, Number, Jyo.Color", function (x, y, width, height, radius, color) {
  5174. /// <summary>绘制实心圆角矩形</summary>
  5175. /// <param name="x" type="Number">起始X坐标</param>
  5176. /// <param name="y" type="Number">起始Y坐标</param>
  5177. /// <param name="width" type="Number">矩形宽度</param>
  5178. /// <param name="height" type="Number">矩形高度</param>
  5179. /// <param name="radius" type="Number">圆角半径</param>
  5180. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5181. this.drawRoundRect(x, y, width, height, radius, color.toRgba(), 1);
  5182. }).
  5183. add("Number, Number, Number, Number, Number, Jyo.Color, Number", function (x, y, width, height, radius, color, lineWidth) {
  5184. /// <summary>绘制实心圆角矩形</summary>
  5185. /// <param name="x" type="Number">起始X坐标</param>
  5186. /// <param name="y" type="Number">起始Y坐标</param>
  5187. /// <param name="width" type="Number">矩形宽度</param>
  5188. /// <param name="height" type="Number">矩形高度</param>
  5189. /// <param name="radius" type="Number">圆角半径</param>
  5190. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5191. /// <param name="lineWidth" type="Number">线段宽度</param>
  5192. this.drawRoundRect(x, y, width, height, radius, color.toRgba(), lineWidth);
  5193. }).
  5194. add("Number, Number, Number, Number, Number, String", function (x, y, width, height, radius, colorStr) {
  5195. /// <summary>绘制实心矩形</summary>
  5196. /// <param name="x" type="Number">起始X坐标</param>
  5197. /// <param name="y" type="Number">起始Y坐标</param>
  5198. /// <param name="width" type="Number">矩形宽度</param>
  5199. /// <param name="height" type="Number">矩形高度</param>
  5200. /// <param name="radius" type="Number">圆角半径</param>
  5201. /// <param name="colorStr" type="String">颜色字符串值</param>
  5202. this.drawRoundRect(x, y, width, height, radius, colorStr, 1);
  5203. }).
  5204. add("Number, Number, Number, Number, Number, String, Number", function (x, y, width, height, radius, colorStr, lineWidth) {
  5205. /// <summary>绘制实心矩形</summary>
  5206. /// <param name="x" type="Number">起始X坐标</param>
  5207. /// <param name="y" type="Number">起始Y坐标</param>
  5208. /// <param name="width" type="Number">矩形宽度</param>
  5209. /// <param name="height" type="Number">矩形高度</param>
  5210. /// <param name="radius" type="Number">圆角半径</param>
  5211. /// <param name="colorStr" type="String">颜色字符串值</param>
  5212. /// <param name="lineWidth" type="Number">线段宽度</param>
  5213. lineWidth = lineWidth || 1.0;
  5214. this.tempList.push({
  5215. left: x + "px",
  5216. top: y + "px",
  5217. width: (width - lineWidth * 2) + "px",
  5218. height: (height - lineWidth * 2) + "px",
  5219. border: "solid " + lineWidth + "px " + (colorStr || "#000000"),
  5220. borderRadius: radius + "px"
  5221. });
  5222. }),
  5223. drawImage: Jyo.Overload().
  5224. add("*, Number, Number", function (element, x, y) {
  5225. /// <summary>绘制图象</summary>
  5226. /// <param name="element" type="Object">要绘制的元素</param>
  5227. /// <param name="x" type="Number">起始X坐标</param>
  5228. /// <param name="y" type="Number">起始Y坐标</param>
  5229. element = element.object || element;
  5230. this.tempList.push({
  5231. left: x + "px",
  5232. top: y + "px",
  5233. width: element.width + "px",
  5234. height: element.height + "px",
  5235. backgroundImage: element.other || "url(" + element.src + ")"
  5236. });
  5237. }).
  5238. add("*, Jyo.Rectangle", function (element, rect) {
  5239. /// <summary>绘制图象</summary>
  5240. /// <param name="element" type="Object">要绘制的元素</param>
  5241. /// <param name="rect" type="Jyo.Rectangle">矩形对象</param>
  5242. element = element.object || element;
  5243. this.tempList.push({
  5244. left: rect.x + "px",
  5245. top: rect.y + "px",
  5246. width: rect.width + "px",
  5247. height: rect.height + "px",
  5248. backgroundImage: element.other || "url(" + element.src + ")",
  5249. backgroundSize: "100%"
  5250. });
  5251. }).
  5252. add("*, Number, Number, Number, Number", function (element, x, y, width, height) {
  5253. /// <summary>绘制图象</summary>
  5254. /// <param name="element" type="Object">要绘制的元素</param>
  5255. /// <param name="x" type="Number">起始X坐标</param>
  5256. /// <param name="y" type="Number">起始Y坐标</param>
  5257. /// <param name="width" type="Number">图像宽度</param>
  5258. /// <param name="height" type="Number">图像高度</param>
  5259. element = element.object || element;
  5260. this.tempList.push({
  5261. left: x + "px",
  5262. top: y + "px",
  5263. width: width + "px",
  5264. height: height + "px",
  5265. backgroundImage: element.other || "url(" + element.src + ")",
  5266. backgroundSize: "100%"
  5267. });
  5268. }).
  5269. add("*, Number, Number, Number, Number, Number, Number, Number, Number", function (element, x, y, width, height, cx, cy, cwidth, cheight) {
  5270. /// <summary>绘制图象</summary>
  5271. /// <param name="element" type="Object">要绘制的元素</param>
  5272. /// <param name="x" type="Number">起始X坐标</param>
  5273. /// <param name="y" type="Number">起始Y坐标</param>
  5274. /// <param name="width" type="Number">图像宽度</param>
  5275. /// <param name="height" type="Number">图像高度</param>
  5276. /// <param name="cx" type="Number">在原图坐标上进行剪裁的起始X坐标</param>
  5277. /// <param name="cy" type="Number">在原图坐标上进行剪裁的起始Y坐标</param>
  5278. /// <param name="cwidth" type="Number">在原图坐标上进行剪裁的图像宽度</param>
  5279. /// <param name="cheight" type="Number">在原图坐标上进行剪裁的图像高度</param>
  5280. element = element.object || element;
  5281. this.tempList.push({
  5282. left: x + "px",
  5283. top: y + "px",
  5284. width: width + "px",
  5285. height: height + "px",
  5286. backgroundRepeat: "no-repeat",
  5287. backgroundImage: element.other || "url(" + element.src + ")",
  5288. backgroundPosition: -cx + "px " + -cy + "px",
  5289. backgroundSize: element.width + "px " + element.height + "px"
  5290. });
  5291. }),
  5292. drawText: Jyo.Overload().
  5293. add("String, Number, Number", function (str, x, y) {
  5294. /// <summary>绘制文字</summary>
  5295. /// <param name="str" type="String">要显示的文字</param>
  5296. /// <param name="x" type="Number">起始X坐标</param>
  5297. /// <param name="y" type="Number">起始Y坐标</param>
  5298. this.drawText(str, x, y, String.empty, String.empty);
  5299. }).
  5300. add("String, Number, Number, Jyo.Color", function (str, x, y, color) {
  5301. /// <summary>绘制文字</summary>
  5302. /// <param name="str" type="String">要显示的文字</param>
  5303. /// <param name="x" type="Number">起始X坐标</param>
  5304. /// <param name="y" type="Number">起始Y坐标</param>
  5305. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5306. this.drawText(str, x, y, color.toRgba(), String.empty);
  5307. }).
  5308. add("String, Number, Number, String", function (str, x, y, colorStr) {
  5309. /// <summary>绘制文字</summary>
  5310. /// <param name="str" type="String">要显示的文字</param>
  5311. /// <param name="x" type="Number">起始X坐标</param>
  5312. /// <param name="y" type="Number">起始Y坐标</param>
  5313. /// <param name="colorStr" type="String">颜色字符串值</param>
  5314. this.drawText(str, x, y, colorStr, String.empty);
  5315. }).
  5316. add("String, Number, Number, Jyo.Color, String", function (str, x, y, color, font) {
  5317. /// <summary>绘制文字</summary>
  5318. /// <param name="str" type="String">要显示的文字</param>
  5319. /// <param name="x" type="Number">起始X坐标</param>
  5320. /// <param name="y" type="Number">起始Y坐标</param>
  5321. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5322. /// <param name="font" type="String">字体字符串值</param>
  5323. this.drawText(str, x, y, color.toRgba(), font);
  5324. }).
  5325. add("String, Number, Number, String, String", function (str, x, y, colorStr, font) {
  5326. /// <summary>绘制文字</summary>
  5327. /// <param name="str" type="String">要显示的文字</param>
  5328. /// <param name="x" type="Number">起始X坐标</param>
  5329. /// <param name="y" type="Number">起始Y坐标</param>
  5330. /// <param name="colorStr" type="String">颜色字符串值</param>
  5331. /// <param name="font" type="String">字体字符串值</param>
  5332. this.tempList.push({
  5333. text: str.replace(/(\r\n|\n|\r)/ig, "<br>"),
  5334. left: x + "px",
  5335. top: y + "px",
  5336. font: font || "14px Arial",
  5337. color: colorStr || "#000000",
  5338. whiteSpace: "nowrap"
  5339. });
  5340. }),
  5341. drawLine: Jyo.Overload().
  5342. add("Number, Number, Number, Number", function (x1, y1, x2, y2) {
  5343. /// <summary>绘制线段</summary>
  5344. /// <param name="x1" type="Number">起始X坐标</param>
  5345. /// <param name="y1" type="Number">起始Y坐标</param>
  5346. /// <param name="x2" type="Number">结束X坐标</param>
  5347. /// <param name="y2" type="Number">结束Y坐标</param>
  5348. this.drawLine(x1, y1, x2, y2, String.empty, 1, String.empty);
  5349. }).
  5350. add("Number, Number, Number, Number, Jyo.Color", function (x1, y1, x2, y2, color) {
  5351. /// <summary>绘制线段</summary>
  5352. /// <param name="x1" type="Number">起始X坐标</param>
  5353. /// <param name="y1" type="Number">起始Y坐标</param>
  5354. /// <param name="x2" type="Number">结束X坐标</param>
  5355. /// <param name="y2" type="Number">结束Y坐标</param>
  5356. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5357. this.drawLine(x1, y1, x2, y2, color.toRgba(), 1, String.empty);
  5358. }).
  5359. add("Number, Number, Number, Number, String", function (x1, y1, x2, y2, colorStr) {
  5360. /// <summary>绘制线段</summary>
  5361. /// <param name="x1" type="Number">起始X坐标</param>
  5362. /// <param name="y1" type="Number">起始Y坐标</param>
  5363. /// <param name="x2" type="Number">结束X坐标</param>
  5364. /// <param name="y2" type="Number">结束Y坐标</param>
  5365. /// <param name="colorStr" type="String">颜色字符串值</param>
  5366. this.drawLine(x1, y1, x2, y2, colorStr, 1, String.empty);
  5367. }).
  5368. add("Number, Number, Number, Number, Jyo.Color, Number", function (x1, y1, x2, y2, color, lineWidth) {
  5369. /// <summary>绘制线段</summary>
  5370. /// <param name="x1" type="Number">起始X坐标</param>
  5371. /// <param name="y1" type="Number">起始Y坐标</param>
  5372. /// <param name="x2" type="Number">结束X坐标</param>
  5373. /// <param name="y2" type="Number">结束Y坐标</param>
  5374. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5375. /// <param name="lineWidth" type="Number">线条宽度</param>
  5376. this.drawLine(x1, y1, x2, y2, color.toRgba(), lineWidth, String.empty);
  5377. }).
  5378. add("Number, Number, Number, Number, String, Number", function (x1, y1, x2, y2, colorStr, lineWidth) {
  5379. /// <summary>绘制线段</summary>
  5380. /// <param name="x1" type="Number">起始X坐标</param>
  5381. /// <param name="y1" type="Number">起始Y坐标</param>
  5382. /// <param name="x2" type="Number">结束X坐标</param>
  5383. /// <param name="y2" type="Number">结束Y坐标</param>
  5384. /// <param name="colorStr" type="String">颜色字符串值</param>
  5385. /// <param name="lineWidth" type="Number">线条宽度</param>
  5386. this.drawLine(x1, y1, x2, y2, colorStr, lineWidth, String.empty);
  5387. }).
  5388. add("Number, Number, Number, Number, Jyo.Color, Number, String", function (x1, y1, x2, y2, color, lineWidth, cap) {
  5389. /// <summary>绘制线段</summary>
  5390. /// <param name="x1" type="Number">起始X坐标</param>
  5391. /// <param name="y1" type="Number">起始Y坐标</param>
  5392. /// <param name="x2" type="Number">结束X坐标</param>
  5393. /// <param name="y2" type="Number">结束Y坐标</param>
  5394. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5395. /// <param name="lineWidth" type="Number">线条宽度</param>
  5396. /// <param name="cap" type="String">闭合样式</param>
  5397. this.drawLine(x1, y1, x2, y2, color.toRgba(), lineWidth, cap);
  5398. }).
  5399. add("Number, Number, Number, Number, String, Number, String", function (x1, y1, x2, y2, colorStr, lineWidth, cap) {
  5400. /// <summary>绘制线段</summary>
  5401. /// <param name="x1" type="Number">起始X坐标</param>
  5402. /// <param name="y1" type="Number">起始Y坐标</param>
  5403. /// <param name="x2" type="Number">结束X坐标</param>
  5404. /// <param name="y2" type="Number">结束Y坐标</param>
  5405. /// <param name="colorStr" type="String">颜色字符串值</param>
  5406. /// <param name="lineWidth" type="Number">线条宽度</param>
  5407. /// <param name="cap" type="String">闭合样式</param>
  5408. var length = Math.sqrt((x1 - x2) * (x1 - x2) + (y1 - y2) * (y1 - y2));
  5409. var angle = Math.atan2(y2 - y1, x2 - x1) * 180 / Math.PI;
  5410. var obj = {
  5411. left: x1 + "px",
  5412. top: y1 + "px",
  5413. width: length + "px",
  5414. height: "0px",
  5415. borderTop: "solid " + (lineWidth || 1) + "px " + (colorStr || "#000000")
  5416. };
  5417. obj["transformOrigin"] = "0px 0px";
  5418. obj[Jyo.prefix.lowercase + "TransformOrigin"] = "0px 0px";
  5419. obj["transform"] = "rotate(" + angle + "deg)";
  5420. obj[Jyo.prefix.lowercase + "Transform"] = obj["transform"];
  5421. this.tempList.push(obj);
  5422. }),
  5423. drawPolygon: Jyo.Overload().
  5424. add("Array", function (list) {
  5425. /// <summary>绘制空心多边形</summary>
  5426. /// <param name="list" type="Array">顶点列表</param>
  5427. this.drawPolygon(list, String.empty, 1, String.empty);
  5428. }).
  5429. add("Array, Jyo.Color", function (list, color) {
  5430. /// <summary>绘制空心多边形</summary>
  5431. /// <param name="list" type="Array">顶点列表</param>
  5432. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5433. this.drawPolygon(list, color.toRgba(), 1, String.empty);
  5434. }).
  5435. add("Array, String", function (list, colorStr) {
  5436. /// <summary>绘制空心多边形</summary>
  5437. /// <param name="list" type="Array">顶点列表</param>
  5438. /// <param name="colorStr" type="String">颜色字符串值</param>
  5439. this.drawPolygon(list, colorStr, 1, String.empty);
  5440. }).
  5441. add("Array, Jyo.Color, Number", function (list, color, lineWidth) {
  5442. /// <summary>绘制空心多边形</summary>
  5443. /// <param name="list" type="Array">顶点列表</param>
  5444. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5445. /// <param name="lineWidth" type="Number">线条宽度</param>
  5446. this.drawPolygon(list, color.toRgba(), lineWidth, String.empty);
  5447. }).
  5448. add("Array, String, Number", function (list, colorStr, lineWidth) {
  5449. /// <summary>绘制空心多边形</summary>
  5450. /// <param name="list" type="Array">顶点列表</param>
  5451. /// <param name="colorStr" type="String">颜色字符串值</param>
  5452. /// <param name="lineWidth" type="Number">线条宽度</param>
  5453. this.drawPolygon(list, colorStr, lineWidth, String.empty);
  5454. }).
  5455. add("Array, Jyo.Color, Number, String", function (list, color, lineWidth, lineJoin) {
  5456. /// <summary>绘制空心多边形</summary>
  5457. /// <param name="list" type="Array">顶点列表</param>
  5458. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5459. /// <param name="lineWidth" type="Number">线条宽度</param>
  5460. /// <param name="lineJoin" type="String">线条闭合样式</param>
  5461. this.drawPolygon(list, color.toRgba(), lineWidth, lineJoin);
  5462. }).
  5463. add("Array, String, Number, String", function (list, colorStr, lineWidth, lineJoin) {
  5464. /// <summary>绘制空心多边形</summary>
  5465. /// <param name="list" type="Array">顶点列表</param>
  5466. /// <param name="colorStr" type="String">颜色字符串值</param>
  5467. /// <param name="lineWidth" type="Number">线条宽度</param>
  5468. /// <param name="lineJoin" type="String">线条闭合样式</param>
  5469. if (list.length % 2 != 0) list.length = length - 1;
  5470. if (!list.length) return;
  5471. colorStr = colorStr || "#000000";
  5472. lineWidth = lineWidth || 1.0;
  5473. lineJoin = lineJoin || "miter";
  5474. var prePointX = null,
  5475. prePointY = null;
  5476. for (var i = 0; i < list.length; i += 2) {
  5477. if (prePointX !== null && prePointY !== null) {
  5478. this.drawLine(prePointX, prePointY, list[i], list[i + 1], colorStr, lineWidth, lineJoin);
  5479. }
  5480. prePointX = list[i],
  5481. prePointY = list[i + 1];
  5482. }
  5483. if (list.length >= 2) {
  5484. this.drawLine(prePointX, prePointY, list[0], list[1], colorStr, lineWidth, lineJoin);
  5485. }
  5486. }),
  5487. fillPolygon: Jyo.Overload().
  5488. add("Array", function (list) {
  5489. /// <summary>绘制实心多边形</summary>
  5490. /// <param name="list" type="Array">顶点列表</param>
  5491. this.fillPolygon(list, String.empty);
  5492. }).
  5493. add("Array, Jyo.Color", function (list, color) {
  5494. /// <summary>绘制实心多边形</summary>
  5495. /// <param name="list" type="Array">顶点列表</param>
  5496. /// <param name="color" type="Jyo.Color">颜色对象</param>
  5497. this.fillPolygon(list, color.toRgba());
  5498. }).
  5499. add("Array, String", function (list, colorStr) {
  5500. /// <summary>绘制实心多边形</summary>
  5501. /// <param name="list" type="Array">顶点列表</param>
  5502. /// <param name="colorStr" type="String">颜色字符串值</param>
  5503. if (list.length % 2 != 0) list.length = length - 1;
  5504. if (!list.length) return;
  5505. var pl = [];
  5506. for (var i = 0; i < list.length; i += 2) {
  5507. pl.push(list[i] + "px " + list[i + 1] + "px");
  5508. }
  5509. var obj = {
  5510. left: 0 + "px",
  5511. top: 0 + "px",
  5512. width: this.width + "px",
  5513. height: this.height + "px",
  5514. backgroundColor: colorStr || "#000000",
  5515. clipPath: "polygon(" + pl.join() + ")"
  5516. };
  5517. obj[Jyo.prefix.lowercase + "ClipPath"] = obj["clipPath"];
  5518. obj["transform"] = obj[Jyo.prefix.lowercase + "Transform"] =
  5519. obj["backfaceVisibility"] = obj[Jyo.prefix.lowercase + "BackfaceVisibility"] = String.empty;
  5520. this.tempList.push(obj);
  5521. })
  5522. });