dat.gui.module.js 83 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090209120922093209420952096209720982099210021012102210321042105210621072108210921102111211221132114211521162117211821192120212121222123212421252126212721282129213021312132213321342135213621372138213921402141214221432144214521462147214821492150215121522153215421552156215721582159216021612162216321642165216621672168216921702171217221732174217521762177217821792180218121822183218421852186218721882189219021912192219321942195219621972198219922002201220222032204220522062207220822092210221122122213221422152216221722182219222022212222222322242225222622272228222922302231223222332234223522362237223822392240224122422243224422452246224722482249225022512252225322542255225622572258225922602261226222632264226522662267226822692270227122722273227422752276227722782279228022812282228322842285228622872288228922902291229222932294229522962297229822992300230123022303230423052306230723082309231023112312231323142315231623172318231923202321232223232324232523262327232823292330233123322333233423352336233723382339234023412342234323442345234623472348234923502351235223532354235523562357235823592360236123622363236423652366236723682369237023712372237323742375237623772378237923802381238223832384238523862387238823892390239123922393239423952396239723982399240024012402240324042405240624072408240924102411241224132414241524162417241824192420242124222423242424252426242724282429243024312432243324342435243624372438243924402441244224432444244524462447244824492450245124522453245424552456245724582459246024612462246324642465246624672468246924702471247224732474247524762477247824792480248124822483248424852486248724882489249024912492249324942495249624972498249925002501250225032504250525062507250825092510251125122513251425152516251725182519252025212522252325242525252625272528252925302531253225332534253525362537253825392540254125422543254425452546254725482549255025512552255325542555255625572558255925602561256225632564256525662567256825692570257125722573257425752576257725782579258025812582258325842585258625872588258925902591259225932594259525962597259825992600260126022603260426052606260726082609261026112612261326142615261626172618261926202621262226232624262526262627262826292630263126322633263426352636263726382639264026412642264326442645264626472648264926502651265226532654265526562657265826592660266126622663266426652666266726682669267026712672267326742675267626772678267926802681268226832684268526862687268826892690269126922693269426952696269726982699270027012702270327042705270627072708270927102711271227132714271527162717271827192720272127222723272427252726272727282729273027312732273327342735273627372738273927402741274227432744274527462747274827492750275127522753275427552756275727582759276027612762276327642765276627672768276927702771277227732774277527762777277827792780278127822783278427852786278727882789279027912792279327942795279627972798279928002801280228032804280528062807280828092810281128122813281428152816281728182819282028212822282328242825282628272828282928302831283228332834283528362837283828392840284128422843284428452846284728482849285028512852285328542855285628572858285928602861286228632864286528662867286828692870287128722873287428752876287728782879288028812882288328842885288628872888288928902891289228932894289528962897289828992900290129022903290429052906290729082909291029112912291329142915291629172918291929202921292229232924292529262927292829292930293129322933293429352936293729382939294029412942294329442945294629472948294929502951295229532954295529562957295829592960296129622963296429652966296729682969297029712972297329742975297629772978297929802981298229832984298529862987298829892990299129922993299429952996299729982999300030013002300330043005300630073008300930103011301230133014301530163017301830193020302130223023302430253026302730283029303030313032303330343035303630373038303930403041304230433044304530463047304830493050305130523053305430553056305730583059306030613062306330643065306630673068306930703071307230733074307530763077307830793080308130823083308430853086308730883089309030913092309330943095309630973098309931003101310231033104310531063107310831093110311131123113311431153116311731183119312031213122312331243125312631273128312931303131313231333134313531363137313831393140314131423143314431453146314731483149315031513152315331543155315631573158315931603161316231633164316531663167316831693170317131723173317431753176317731783179318031813182318331843185318631873188318931903191319231933194319531963197319831993200320132023203320432053206320732083209321032113212321332143215321632173218321932203221322232233224322532263227322832293230323132323233323432353236323732383239324032413242324332443245324632473248324932503251325232533254325532563257325832593260326132623263326432653266326732683269327032713272327332743275327632773278327932803281328232833284328532863287328832893290329132923293329432953296329732983299330033013302330333043305330633073308330933103311331233133314331533163317331833193320332133223323332433253326332733283329333033313332333333343335333633373338333933403341334233433344334533463347334833493350335133523353335433553356335733583359336033613362336333643365336633673368336933703371337233733374337533763377337833793380338133823383338433853386338733883389339033913392339333943395339633973398339934003401340234033404340534063407340834093410341134123413341434153416341734183419342034213422342334243425342634273428342934303431343234333434343534363437343834393440344134423443344434453446344734483449345034513452345334543455345634573458345934603461346234633464346534663467346834693470347134723473347434753476347734783479348034813482348334843485348634873488348934903491349234933494349534963497349834993500350135023503350435053506350735083509351035113512351335143515351635173518351935203521352235233524352535263527352835293530353135323533353435353536353735383539354035413542354335443545354635473548354935503551355235533554355535563557355835593560356135623563356435653566356735683569357035713572357335743575
  1. /**
  2. * dat-gui JavaScript Controller Library
  3. * http://code.google.com/p/dat-gui
  4. *
  5. * Copyright 2011 Data Arts Team, Google Creative Lab
  6. *
  7. * Licensed under the Apache License, Version 2.0 (the "License");
  8. * you may not use this file except in compliance with the License.
  9. * You may obtain a copy of the License at
  10. *
  11. * http://www.apache.org/licenses/LICENSE-2.0
  12. */
  13. function ___$insertStyle( css ) {
  14. if ( ! css ) {
  15. return;
  16. }
  17. if ( typeof window === 'undefined' ) {
  18. return;
  19. }
  20. var style = document.createElement( 'style' );
  21. style.setAttribute( 'type', 'text/css' );
  22. style.innerHTML = css;
  23. document.head.appendChild( style );
  24. return css;
  25. }
  26. function colorToString( color, forceCSSHex ) {
  27. var colorFormat = color.__state.conversionName.toString();
  28. var r = Math.round( color.r );
  29. var g = Math.round( color.g );
  30. var b = Math.round( color.b );
  31. var a = color.a;
  32. var h = Math.round( color.h );
  33. var s = color.s.toFixed( 1 );
  34. var v = color.v.toFixed( 1 );
  35. if ( forceCSSHex || colorFormat === 'THREE_CHAR_HEX' || colorFormat === 'SIX_CHAR_HEX' ) {
  36. var str = color.hex.toString( 16 );
  37. while ( str.length < 6 ) {
  38. str = '0' + str;
  39. }
  40. return '#' + str;
  41. } else if ( colorFormat === 'CSS_RGB' ) {
  42. return 'rgb(' + r + ',' + g + ',' + b + ')';
  43. } else if ( colorFormat === 'CSS_RGBA' ) {
  44. return 'rgba(' + r + ',' + g + ',' + b + ',' + a + ')';
  45. } else if ( colorFormat === 'HEX' ) {
  46. return '0x' + color.hex.toString( 16 );
  47. } else if ( colorFormat === 'RGB_ARRAY' ) {
  48. return '[' + r + ',' + g + ',' + b + ']';
  49. } else if ( colorFormat === 'RGBA_ARRAY' ) {
  50. return '[' + r + ',' + g + ',' + b + ',' + a + ']';
  51. } else if ( colorFormat === 'RGB_OBJ' ) {
  52. return '{r:' + r + ',g:' + g + ',b:' + b + '}';
  53. } else if ( colorFormat === 'RGBA_OBJ' ) {
  54. return '{r:' + r + ',g:' + g + ',b:' + b + ',a:' + a + '}';
  55. } else if ( colorFormat === 'HSV_OBJ' ) {
  56. return '{h:' + h + ',s:' + s + ',v:' + v + '}';
  57. } else if ( colorFormat === 'HSVA_OBJ' ) {
  58. return '{h:' + h + ',s:' + s + ',v:' + v + ',a:' + a + '}';
  59. }
  60. return 'unknown format';
  61. }
  62. var ARR_EACH = Array.prototype.forEach;
  63. var ARR_SLICE = Array.prototype.slice;
  64. var Common = {
  65. BREAK: {},
  66. extend: function extend( target ) {
  67. this.each( ARR_SLICE.call( arguments, 1 ), function ( obj ) {
  68. var keys = this.isObject( obj ) ? Object.keys( obj ) : [];
  69. keys.forEach( function ( key ) {
  70. if ( ! this.isUndefined( obj[ key ] ) ) {
  71. target[ key ] = obj[ key ];
  72. }
  73. }.bind( this ) );
  74. }, this );
  75. return target;
  76. },
  77. defaults: function defaults( target ) {
  78. this.each( ARR_SLICE.call( arguments, 1 ), function ( obj ) {
  79. var keys = this.isObject( obj ) ? Object.keys( obj ) : [];
  80. keys.forEach( function ( key ) {
  81. if ( this.isUndefined( target[ key ] ) ) {
  82. target[ key ] = obj[ key ];
  83. }
  84. }.bind( this ) );
  85. }, this );
  86. return target;
  87. },
  88. compose: function compose() {
  89. var toCall = ARR_SLICE.call( arguments );
  90. return function () {
  91. var args = ARR_SLICE.call( arguments );
  92. for ( var i = toCall.length - 1; i >= 0; i -- ) {
  93. args = [ toCall[ i ].apply( this, args ) ];
  94. }
  95. return args[ 0 ];
  96. };
  97. },
  98. each: function each( obj, itr, scope ) {
  99. if ( ! obj ) {
  100. return;
  101. }
  102. if ( ARR_EACH && obj.forEach && obj.forEach === ARR_EACH ) {
  103. obj.forEach( itr, scope );
  104. } else if ( obj.length === obj.length + 0 ) {
  105. var key = void 0;
  106. var l = void 0;
  107. for ( key = 0, l = obj.length; key < l; key ++ ) {
  108. if ( key in obj && itr.call( scope, obj[ key ], key ) === this.BREAK ) {
  109. return;
  110. }
  111. }
  112. } else {
  113. for ( var _key in obj ) {
  114. if ( itr.call( scope, obj[ _key ], _key ) === this.BREAK ) {
  115. return;
  116. }
  117. }
  118. }
  119. },
  120. defer: function defer( fnc ) {
  121. setTimeout( fnc, 0 );
  122. },
  123. debounce: function debounce( func, threshold, callImmediately ) {
  124. var timeout = void 0;
  125. return function () {
  126. var obj = this;
  127. var args = arguments;
  128. function delayed() {
  129. timeout = null;
  130. if ( ! callImmediately ) func.apply( obj, args );
  131. }
  132. var callNow = callImmediately || ! timeout;
  133. clearTimeout( timeout );
  134. timeout = setTimeout( delayed, threshold );
  135. if ( callNow ) {
  136. func.apply( obj, args );
  137. }
  138. };
  139. },
  140. toArray: function toArray( obj ) {
  141. if ( obj.toArray ) return obj.toArray();
  142. return ARR_SLICE.call( obj );
  143. },
  144. isUndefined: function isUndefined( obj ) {
  145. return obj === undefined;
  146. },
  147. isNull: function isNull( obj ) {
  148. return obj === null;
  149. },
  150. isNaN: function ( _isNaN ) {
  151. function isNaN() {
  152. return _isNaN.apply( this, arguments );
  153. }
  154. isNaN.toString = function () {
  155. return _isNaN.toString();
  156. };
  157. return isNaN;
  158. }( function ( obj ) {
  159. return isNaN( obj );
  160. } ),
  161. isArray: Array.isArray || function ( obj ) {
  162. return obj.constructor === Array;
  163. },
  164. isObject: function isObject( obj ) {
  165. return obj === Object( obj );
  166. },
  167. isNumber: function isNumber( obj ) {
  168. return obj === obj + 0;
  169. },
  170. isString: function isString( obj ) {
  171. return obj === obj + '';
  172. },
  173. isBoolean: function isBoolean( obj ) {
  174. return obj === false || obj === true;
  175. },
  176. isFunction: function isFunction( obj ) {
  177. return obj instanceof Function;
  178. }
  179. };
  180. var INTERPRETATIONS = [
  181. {
  182. litmus: Common.isString,
  183. conversions: {
  184. THREE_CHAR_HEX: {
  185. read: function read( original ) {
  186. var test = original.match( /^#([A-F0-9])([A-F0-9])([A-F0-9])$/i );
  187. if ( test === null ) {
  188. return false;
  189. }
  190. return {
  191. space: 'HEX',
  192. hex: parseInt( '0x' + test[ 1 ].toString() + test[ 1 ].toString() + test[ 2 ].toString() + test[ 2 ].toString() + test[ 3 ].toString() + test[ 3 ].toString(), 0 )
  193. };
  194. },
  195. write: colorToString
  196. },
  197. SIX_CHAR_HEX: {
  198. read: function read( original ) {
  199. var test = original.match( /^#([A-F0-9]{6})$/i );
  200. if ( test === null ) {
  201. return false;
  202. }
  203. return {
  204. space: 'HEX',
  205. hex: parseInt( '0x' + test[ 1 ].toString(), 0 )
  206. };
  207. },
  208. write: colorToString
  209. },
  210. CSS_RGB: {
  211. read: function read( original ) {
  212. var test = original.match( /^rgb\(\s*(.+)\s*,\s*(.+)\s*,\s*(.+)\s*\)/ );
  213. if ( test === null ) {
  214. return false;
  215. }
  216. return {
  217. space: 'RGB',
  218. r: parseFloat( test[ 1 ] ),
  219. g: parseFloat( test[ 2 ] ),
  220. b: parseFloat( test[ 3 ] )
  221. };
  222. },
  223. write: colorToString
  224. },
  225. CSS_RGBA: {
  226. read: function read( original ) {
  227. var test = original.match( /^rgba\(\s*(.+)\s*,\s*(.+)\s*,\s*(.+)\s*,\s*(.+)\s*\)/ );
  228. if ( test === null ) {
  229. return false;
  230. }
  231. return {
  232. space: 'RGB',
  233. r: parseFloat( test[ 1 ] ),
  234. g: parseFloat( test[ 2 ] ),
  235. b: parseFloat( test[ 3 ] ),
  236. a: parseFloat( test[ 4 ] )
  237. };
  238. },
  239. write: colorToString
  240. }
  241. }
  242. },
  243. {
  244. litmus: Common.isNumber,
  245. conversions: {
  246. HEX: {
  247. read: function read( original ) {
  248. return {
  249. space: 'HEX',
  250. hex: original,
  251. conversionName: 'HEX'
  252. };
  253. },
  254. write: function write( color ) {
  255. return color.hex;
  256. }
  257. }
  258. }
  259. },
  260. {
  261. litmus: Common.isArray,
  262. conversions: {
  263. RGB_ARRAY: {
  264. read: function read( original ) {
  265. if ( original.length !== 3 ) {
  266. return false;
  267. }
  268. return {
  269. space: 'RGB',
  270. r: original[ 0 ],
  271. g: original[ 1 ],
  272. b: original[ 2 ]
  273. };
  274. },
  275. write: function write( color ) {
  276. return [ color.r, color.g, color.b ];
  277. }
  278. },
  279. RGBA_ARRAY: {
  280. read: function read( original ) {
  281. if ( original.length !== 4 ) return false;
  282. return {
  283. space: 'RGB',
  284. r: original[ 0 ],
  285. g: original[ 1 ],
  286. b: original[ 2 ],
  287. a: original[ 3 ]
  288. };
  289. },
  290. write: function write( color ) {
  291. return [ color.r, color.g, color.b, color.a ];
  292. }
  293. }
  294. }
  295. },
  296. {
  297. litmus: Common.isObject,
  298. conversions: {
  299. RGBA_OBJ: {
  300. read: function read( original ) {
  301. if ( Common.isNumber( original.r ) && Common.isNumber( original.g ) && Common.isNumber( original.b ) && Common.isNumber( original.a ) ) {
  302. return {
  303. space: 'RGB',
  304. r: original.r,
  305. g: original.g,
  306. b: original.b,
  307. a: original.a
  308. };
  309. }
  310. return false;
  311. },
  312. write: function write( color ) {
  313. return {
  314. r: color.r,
  315. g: color.g,
  316. b: color.b,
  317. a: color.a
  318. };
  319. }
  320. },
  321. RGB_OBJ: {
  322. read: function read( original ) {
  323. if ( Common.isNumber( original.r ) && Common.isNumber( original.g ) && Common.isNumber( original.b ) ) {
  324. return {
  325. space: 'RGB',
  326. r: original.r,
  327. g: original.g,
  328. b: original.b
  329. };
  330. }
  331. return false;
  332. },
  333. write: function write( color ) {
  334. return {
  335. r: color.r,
  336. g: color.g,
  337. b: color.b
  338. };
  339. }
  340. },
  341. HSVA_OBJ: {
  342. read: function read( original ) {
  343. if ( Common.isNumber( original.h ) && Common.isNumber( original.s ) && Common.isNumber( original.v ) && Common.isNumber( original.a ) ) {
  344. return {
  345. space: 'HSV',
  346. h: original.h,
  347. s: original.s,
  348. v: original.v,
  349. a: original.a
  350. };
  351. }
  352. return false;
  353. },
  354. write: function write( color ) {
  355. return {
  356. h: color.h,
  357. s: color.s,
  358. v: color.v,
  359. a: color.a
  360. };
  361. }
  362. },
  363. HSV_OBJ: {
  364. read: function read( original ) {
  365. if ( Common.isNumber( original.h ) && Common.isNumber( original.s ) && Common.isNumber( original.v ) ) {
  366. return {
  367. space: 'HSV',
  368. h: original.h,
  369. s: original.s,
  370. v: original.v
  371. };
  372. }
  373. return false;
  374. },
  375. write: function write( color ) {
  376. return {
  377. h: color.h,
  378. s: color.s,
  379. v: color.v
  380. };
  381. }
  382. }
  383. }
  384. } ];
  385. var result = void 0;
  386. var toReturn = void 0;
  387. var interpret = function interpret() {
  388. toReturn = false;
  389. var original = arguments.length > 1 ? Common.toArray( arguments ) : arguments[ 0 ];
  390. Common.each( INTERPRETATIONS, function ( family ) {
  391. if ( family.litmus( original ) ) {
  392. Common.each( family.conversions, function ( conversion, conversionName ) {
  393. result = conversion.read( original );
  394. if ( toReturn === false && result !== false ) {
  395. toReturn = result;
  396. result.conversionName = conversionName;
  397. result.conversion = conversion;
  398. return Common.BREAK;
  399. }
  400. } );
  401. return Common.BREAK;
  402. }
  403. } );
  404. return toReturn;
  405. };
  406. var tmpComponent = void 0;
  407. var ColorMath = {
  408. hsv_to_rgb: function hsv_to_rgb( h, s, v ) {
  409. var hi = Math.floor( h / 60 ) % 6;
  410. var f = h / 60 - Math.floor( h / 60 );
  411. var p = v * ( 1.0 - s );
  412. var q = v * ( 1.0 - f * s );
  413. var t = v * ( 1.0 - ( 1.0 - f ) * s );
  414. var c = [[ v, t, p ], [ q, v, p ], [ p, v, t ], [ p, q, v ], [ t, p, v ], [ v, p, q ]][ hi ];
  415. return {
  416. r: c[ 0 ] * 255,
  417. g: c[ 1 ] * 255,
  418. b: c[ 2 ] * 255
  419. };
  420. },
  421. rgb_to_hsv: function rgb_to_hsv( r, g, b ) {
  422. var min = Math.min( r, g, b );
  423. var max = Math.max( r, g, b );
  424. var delta = max - min;
  425. var h = void 0;
  426. var s = void 0;
  427. if ( max !== 0 ) {
  428. s = delta / max;
  429. } else {
  430. return {
  431. h: NaN,
  432. s: 0,
  433. v: 0
  434. };
  435. }
  436. if ( r === max ) {
  437. h = ( g - b ) / delta;
  438. } else if ( g === max ) {
  439. h = 2 + ( b - r ) / delta;
  440. } else {
  441. h = 4 + ( r - g ) / delta;
  442. }
  443. h /= 6;
  444. if ( h < 0 ) {
  445. h += 1;
  446. }
  447. return {
  448. h: h * 360,
  449. s: s,
  450. v: max / 255
  451. };
  452. },
  453. rgb_to_hex: function rgb_to_hex( r, g, b ) {
  454. var hex = this.hex_with_component( 0, 2, r );
  455. hex = this.hex_with_component( hex, 1, g );
  456. hex = this.hex_with_component( hex, 0, b );
  457. return hex;
  458. },
  459. component_from_hex: function component_from_hex( hex, componentIndex ) {
  460. return hex >> componentIndex * 8 & 0xFF;
  461. },
  462. hex_with_component: function hex_with_component( hex, componentIndex, value ) {
  463. return value << ( tmpComponent = componentIndex * 8 ) | hex & ~ ( 0xFF << tmpComponent );
  464. }
  465. };
  466. var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function ( obj ) {
  467. return typeof obj;
  468. } : function ( obj ) {
  469. return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
  470. };
  471. var classCallCheck = function ( instance, Constructor ) {
  472. if ( ! ( instance instanceof Constructor ) ) {
  473. throw new TypeError( "Cannot call a class as a function" );
  474. }
  475. };
  476. var createClass = function () {
  477. function defineProperties( target, props ) {
  478. for ( var i = 0; i < props.length; i ++ ) {
  479. var descriptor = props[ i ];
  480. descriptor.enumerable = descriptor.enumerable || false;
  481. descriptor.configurable = true;
  482. if ( "value" in descriptor ) descriptor.writable = true;
  483. Object.defineProperty( target, descriptor.key, descriptor );
  484. }
  485. }
  486. return function ( Constructor, protoProps, staticProps ) {
  487. if ( protoProps ) defineProperties( Constructor.prototype, protoProps );
  488. if ( staticProps ) defineProperties( Constructor, staticProps );
  489. return Constructor;
  490. };
  491. }();
  492. var get = function get( object, property, receiver ) {
  493. if ( object === null ) object = Function.prototype;
  494. var desc = Object.getOwnPropertyDescriptor( object, property );
  495. if ( desc === undefined ) {
  496. var parent = Object.getPrototypeOf( object );
  497. if ( parent === null ) {
  498. return undefined;
  499. } else {
  500. return get( parent, property, receiver );
  501. }
  502. } else if ( "value" in desc ) {
  503. return desc.value;
  504. } else {
  505. var getter = desc.get;
  506. if ( getter === undefined ) {
  507. return undefined;
  508. }
  509. return getter.call( receiver );
  510. }
  511. };
  512. var inherits = function ( subClass, superClass ) {
  513. if ( typeof superClass !== "function" && superClass !== null ) {
  514. throw new TypeError( "Super expression must either be null or a function, not " + typeof superClass );
  515. }
  516. subClass.prototype = Object.create( superClass && superClass.prototype, {
  517. constructor: {
  518. value: subClass,
  519. enumerable: false,
  520. writable: true,
  521. configurable: true
  522. }
  523. } );
  524. if ( superClass ) Object.setPrototypeOf ? Object.setPrototypeOf( subClass, superClass ) : subClass.__proto__ = superClass;
  525. };
  526. var possibleConstructorReturn = function ( self, call ) {
  527. if ( ! self ) {
  528. throw new ReferenceError( "this hasn't been initialised - super() hasn't been called" );
  529. }
  530. return call && ( typeof call === "object" || typeof call === "function" ) ? call : self;
  531. };
  532. var Color = function () {
  533. function Color() {
  534. classCallCheck( this, Color );
  535. this.__state = interpret.apply( this, arguments );
  536. if ( this.__state === false ) {
  537. throw new Error( 'Failed to interpret color arguments' );
  538. }
  539. this.__state.a = this.__state.a || 1;
  540. }
  541. createClass( Color, [ {
  542. key: 'toString',
  543. value: function toString() {
  544. return colorToString( this );
  545. }
  546. }, {
  547. key: 'toHexString',
  548. value: function toHexString() {
  549. return colorToString( this, true );
  550. }
  551. }, {
  552. key: 'toOriginal',
  553. value: function toOriginal() {
  554. return this.__state.conversion.write( this );
  555. }
  556. } ] );
  557. return Color;
  558. }();
  559. function defineRGBComponent( target, component, componentHexIndex ) {
  560. Object.defineProperty( target, component, {
  561. get: function get$$1() {
  562. if ( this.__state.space === 'RGB' ) {
  563. return this.__state[ component ];
  564. }
  565. Color.recalculateRGB( this, component, componentHexIndex );
  566. return this.__state[ component ];
  567. },
  568. set: function set$$1( v ) {
  569. if ( this.__state.space !== 'RGB' ) {
  570. Color.recalculateRGB( this, component, componentHexIndex );
  571. this.__state.space = 'RGB';
  572. }
  573. this.__state[ component ] = v;
  574. }
  575. } );
  576. }
  577. function defineHSVComponent( target, component ) {
  578. Object.defineProperty( target, component, {
  579. get: function get$$1() {
  580. if ( this.__state.space === 'HSV' ) {
  581. return this.__state[ component ];
  582. }
  583. Color.recalculateHSV( this );
  584. return this.__state[ component ];
  585. },
  586. set: function set$$1( v ) {
  587. if ( this.__state.space !== 'HSV' ) {
  588. Color.recalculateHSV( this );
  589. this.__state.space = 'HSV';
  590. }
  591. this.__state[ component ] = v;
  592. }
  593. } );
  594. }
  595. Color.recalculateRGB = function ( color, component, componentHexIndex ) {
  596. if ( color.__state.space === 'HEX' ) {
  597. color.__state[ component ] = ColorMath.component_from_hex( color.__state.hex, componentHexIndex );
  598. } else if ( color.__state.space === 'HSV' ) {
  599. Common.extend( color.__state, ColorMath.hsv_to_rgb( color.__state.h, color.__state.s, color.__state.v ) );
  600. } else {
  601. throw new Error( 'Corrupted color state' );
  602. }
  603. };
  604. Color.recalculateHSV = function ( color ) {
  605. var result = ColorMath.rgb_to_hsv( color.r, color.g, color.b );
  606. Common.extend( color.__state, {
  607. s: result.s,
  608. v: result.v
  609. } );
  610. if ( ! Common.isNaN( result.h ) ) {
  611. color.__state.h = result.h;
  612. } else if ( Common.isUndefined( color.__state.h ) ) {
  613. color.__state.h = 0;
  614. }
  615. };
  616. Color.COMPONENTS = [ 'r', 'g', 'b', 'h', 's', 'v', 'hex', 'a' ];
  617. defineRGBComponent( Color.prototype, 'r', 2 );
  618. defineRGBComponent( Color.prototype, 'g', 1 );
  619. defineRGBComponent( Color.prototype, 'b', 0 );
  620. defineHSVComponent( Color.prototype, 'h' );
  621. defineHSVComponent( Color.prototype, 's' );
  622. defineHSVComponent( Color.prototype, 'v' );
  623. Object.defineProperty( Color.prototype, 'a', {
  624. get: function get$$1() {
  625. return this.__state.a;
  626. },
  627. set: function set$$1( v ) {
  628. this.__state.a = v;
  629. }
  630. } );
  631. Object.defineProperty( Color.prototype, 'hex', {
  632. get: function get$$1() {
  633. if ( this.__state.space !== 'HEX' ) {
  634. this.__state.hex = ColorMath.rgb_to_hex( this.r, this.g, this.b );
  635. this.__state.space = 'HEX';
  636. }
  637. return this.__state.hex;
  638. },
  639. set: function set$$1( v ) {
  640. this.__state.space = 'HEX';
  641. this.__state.hex = v;
  642. }
  643. } );
  644. var Controller = function () {
  645. function Controller( object, property ) {
  646. classCallCheck( this, Controller );
  647. this.initialValue = object[ property ];
  648. this.domElement = document.createElement( 'div' );
  649. this.object = object;
  650. this.property = property;
  651. this.__onChange = undefined;
  652. this.__onFinishChange = undefined;
  653. }
  654. createClass( Controller, [ {
  655. key: 'onChange',
  656. value: function onChange( fnc ) {
  657. this.__onChange = fnc;
  658. return this;
  659. }
  660. }, {
  661. key: 'onFinishChange',
  662. value: function onFinishChange( fnc ) {
  663. this.__onFinishChange = fnc;
  664. return this;
  665. }
  666. }, {
  667. key: 'setValue',
  668. value: function setValue( newValue ) {
  669. this.object[ this.property ] = newValue;
  670. if ( this.__onChange ) {
  671. this.__onChange.call( this, newValue );
  672. }
  673. this.updateDisplay();
  674. return this;
  675. }
  676. }, {
  677. key: 'getValue',
  678. value: function getValue() {
  679. return this.object[ this.property ];
  680. }
  681. }, {
  682. key: 'updateDisplay',
  683. value: function updateDisplay() {
  684. return this;
  685. }
  686. }, {
  687. key: 'isModified',
  688. value: function isModified() {
  689. return this.initialValue !== this.getValue();
  690. }
  691. } ] );
  692. return Controller;
  693. }();
  694. var EVENT_MAP = {
  695. HTMLEvents: [ 'change' ],
  696. MouseEvents: [ 'click', 'mousemove', 'mousedown', 'mouseup', 'mouseover' ],
  697. KeyboardEvents: [ 'keydown' ]
  698. };
  699. var EVENT_MAP_INV = {};
  700. Common.each( EVENT_MAP, function ( v, k ) {
  701. Common.each( v, function ( e ) {
  702. EVENT_MAP_INV[ e ] = k;
  703. } );
  704. } );
  705. var CSS_VALUE_PIXELS = /(\d+(\.\d+)?)px/;
  706. function cssValueToPixels( val ) {
  707. if ( val === '0' || Common.isUndefined( val ) ) {
  708. return 0;
  709. }
  710. var match = val.match( CSS_VALUE_PIXELS );
  711. if ( ! Common.isNull( match ) ) {
  712. return parseFloat( match[ 1 ] );
  713. }
  714. return 0;
  715. }
  716. var dom = {
  717. makeSelectable: function makeSelectable( elem, selectable ) {
  718. if ( elem === undefined || elem.style === undefined ) return;
  719. elem.onselectstart = selectable ? function () {
  720. return false;
  721. } : function () {};
  722. elem.style.MozUserSelect = selectable ? 'auto' : 'none';
  723. elem.style.KhtmlUserSelect = selectable ? 'auto' : 'none';
  724. elem.unselectable = selectable ? 'on' : 'off';
  725. },
  726. makeFullscreen: function makeFullscreen( elem, hor, vert ) {
  727. var vertical = vert;
  728. var horizontal = hor;
  729. if ( Common.isUndefined( horizontal ) ) {
  730. horizontal = true;
  731. }
  732. if ( Common.isUndefined( vertical ) ) {
  733. vertical = true;
  734. }
  735. elem.style.position = 'absolute';
  736. if ( horizontal ) {
  737. elem.style.left = 0;
  738. elem.style.right = 0;
  739. }
  740. if ( vertical ) {
  741. elem.style.top = 0;
  742. elem.style.bottom = 0;
  743. }
  744. },
  745. fakeEvent: function fakeEvent( elem, eventType, pars, aux ) {
  746. var params = pars || {};
  747. var className = EVENT_MAP_INV[ eventType ];
  748. if ( ! className ) {
  749. throw new Error( 'Event type ' + eventType + ' not supported.' );
  750. }
  751. var evt = document.createEvent( className );
  752. switch ( className ) {
  753. case 'MouseEvents':
  754. {
  755. var clientX = params.x || params.clientX || 0;
  756. var clientY = params.y || params.clientY || 0;
  757. evt.initMouseEvent( eventType, params.bubbles || false, params.cancelable || true, window, params.clickCount || 1, 0,
  758. 0,
  759. clientX,
  760. clientY,
  761. false, false, false, false, 0, null );
  762. break;
  763. }
  764. case 'KeyboardEvents':
  765. {
  766. var init = evt.initKeyboardEvent || evt.initKeyEvent;
  767. Common.defaults( params, {
  768. cancelable: true,
  769. ctrlKey: false,
  770. altKey: false,
  771. shiftKey: false,
  772. metaKey: false,
  773. keyCode: undefined,
  774. charCode: undefined
  775. } );
  776. init( eventType, params.bubbles || false, params.cancelable, window, params.ctrlKey, params.altKey, params.shiftKey, params.metaKey, params.keyCode, params.charCode );
  777. break;
  778. }
  779. default:
  780. {
  781. evt.initEvent( eventType, params.bubbles || false, params.cancelable || true );
  782. break;
  783. }
  784. }
  785. Common.defaults( evt, aux );
  786. elem.dispatchEvent( evt );
  787. },
  788. bind: function bind( elem, event, func, newBool ) {
  789. var bool = newBool || false;
  790. if ( elem.addEventListener ) {
  791. elem.addEventListener( event, func, bool );
  792. } else if ( elem.attachEvent ) {
  793. elem.attachEvent( 'on' + event, func );
  794. }
  795. return dom;
  796. },
  797. unbind: function unbind( elem, event, func, newBool ) {
  798. var bool = newBool || false;
  799. if ( elem.removeEventListener ) {
  800. elem.removeEventListener( event, func, bool );
  801. } else if ( elem.detachEvent ) {
  802. elem.detachEvent( 'on' + event, func );
  803. }
  804. return dom;
  805. },
  806. addClass: function addClass( elem, className ) {
  807. if ( elem.className === undefined ) {
  808. elem.className = className;
  809. } else if ( elem.className !== className ) {
  810. var classes = elem.className.split( / +/ );
  811. if ( classes.indexOf( className ) === - 1 ) {
  812. classes.push( className );
  813. elem.className = classes.join( ' ' ).replace( /^\s+/, '' ).replace( /\s+$/, '' );
  814. }
  815. }
  816. return dom;
  817. },
  818. removeClass: function removeClass( elem, className ) {
  819. if ( className ) {
  820. if ( elem.className === className ) {
  821. elem.removeAttribute( 'class' );
  822. } else {
  823. var classes = elem.className.split( / +/ );
  824. var index = classes.indexOf( className );
  825. if ( index !== - 1 ) {
  826. classes.splice( index, 1 );
  827. elem.className = classes.join( ' ' );
  828. }
  829. }
  830. } else {
  831. elem.className = undefined;
  832. }
  833. return dom;
  834. },
  835. hasClass: function hasClass( elem, className ) {
  836. return new RegExp( '(?:^|\\s+)' + className + '(?:\\s+|$)' ).test( elem.className ) || false;
  837. },
  838. getWidth: function getWidth( elem ) {
  839. var style = getComputedStyle( elem );
  840. return cssValueToPixels( style[ 'border-left-width' ] ) + cssValueToPixels( style[ 'border-right-width' ] ) + cssValueToPixels( style[ 'padding-left' ] ) + cssValueToPixels( style[ 'padding-right' ] ) + cssValueToPixels( style.width );
  841. },
  842. getHeight: function getHeight( elem ) {
  843. var style = getComputedStyle( elem );
  844. return cssValueToPixels( style[ 'border-top-width' ] ) + cssValueToPixels( style[ 'border-bottom-width' ] ) + cssValueToPixels( style[ 'padding-top' ] ) + cssValueToPixels( style[ 'padding-bottom' ] ) + cssValueToPixels( style.height );
  845. },
  846. getOffset: function getOffset( el ) {
  847. var elem = el;
  848. var offset = { left: 0, top: 0 };
  849. if ( elem.offsetParent ) {
  850. do {
  851. offset.left += elem.offsetLeft;
  852. offset.top += elem.offsetTop;
  853. elem = elem.offsetParent;
  854. } while ( elem );
  855. }
  856. return offset;
  857. },
  858. isActive: function isActive( elem ) {
  859. return elem === document.activeElement && ( elem.type || elem.href );
  860. }
  861. };
  862. var BooleanController = function ( _Controller ) {
  863. inherits( BooleanController, _Controller );
  864. function BooleanController( object, property ) {
  865. classCallCheck( this, BooleanController );
  866. var _this2 = possibleConstructorReturn( this, ( BooleanController.__proto__ || Object.getPrototypeOf( BooleanController ) ).call( this, object, property ) );
  867. var _this = _this2;
  868. _this2.__prev = _this2.getValue();
  869. _this2.__checkbox = document.createElement( 'input' );
  870. _this2.__checkbox.setAttribute( 'type', 'checkbox' );
  871. function onChange() {
  872. _this.setValue( ! _this.__prev );
  873. }
  874. dom.bind( _this2.__checkbox, 'change', onChange, false );
  875. _this2.domElement.appendChild( _this2.__checkbox );
  876. _this2.updateDisplay();
  877. return _this2;
  878. }
  879. createClass( BooleanController, [ {
  880. key: 'setValue',
  881. value: function setValue( v ) {
  882. var toReturn = get( BooleanController.prototype.__proto__ || Object.getPrototypeOf( BooleanController.prototype ), 'setValue', this ).call( this, v );
  883. if ( this.__onFinishChange ) {
  884. this.__onFinishChange.call( this, this.getValue() );
  885. }
  886. this.__prev = this.getValue();
  887. return toReturn;
  888. }
  889. }, {
  890. key: 'updateDisplay',
  891. value: function updateDisplay() {
  892. if ( this.getValue() === true ) {
  893. this.__checkbox.setAttribute( 'checked', 'checked' );
  894. this.__checkbox.checked = true;
  895. this.__prev = true;
  896. } else {
  897. this.__checkbox.checked = false;
  898. this.__prev = false;
  899. }
  900. return get( BooleanController.prototype.__proto__ || Object.getPrototypeOf( BooleanController.prototype ), 'updateDisplay', this ).call( this );
  901. }
  902. } ] );
  903. return BooleanController;
  904. }( Controller );
  905. var OptionController = function ( _Controller ) {
  906. inherits( OptionController, _Controller );
  907. function OptionController( object, property, opts ) {
  908. classCallCheck( this, OptionController );
  909. var _this2 = possibleConstructorReturn( this, ( OptionController.__proto__ || Object.getPrototypeOf( OptionController ) ).call( this, object, property ) );
  910. var options = opts;
  911. var _this = _this2;
  912. _this2.__select = document.createElement( 'select' );
  913. if ( Common.isArray( options ) ) {
  914. var map = {};
  915. Common.each( options, function ( element ) {
  916. map[ element ] = element;
  917. } );
  918. options = map;
  919. }
  920. Common.each( options, function ( value, key ) {
  921. var opt = document.createElement( 'option' );
  922. opt.innerHTML = key;
  923. opt.setAttribute( 'value', value );
  924. _this.__select.appendChild( opt );
  925. } );
  926. _this2.updateDisplay();
  927. dom.bind( _this2.__select, 'change', function () {
  928. var desiredValue = this.options[ this.selectedIndex ].value;
  929. _this.setValue( desiredValue );
  930. } );
  931. _this2.domElement.appendChild( _this2.__select );
  932. return _this2;
  933. }
  934. createClass( OptionController, [ {
  935. key: 'setValue',
  936. value: function setValue( v ) {
  937. var toReturn = get( OptionController.prototype.__proto__ || Object.getPrototypeOf( OptionController.prototype ), 'setValue', this ).call( this, v );
  938. if ( this.__onFinishChange ) {
  939. this.__onFinishChange.call( this, this.getValue() );
  940. }
  941. return toReturn;
  942. }
  943. }, {
  944. key: 'updateDisplay',
  945. value: function updateDisplay() {
  946. if ( dom.isActive( this.__select ) ) return this;
  947. this.__select.value = this.getValue();
  948. return get( OptionController.prototype.__proto__ || Object.getPrototypeOf( OptionController.prototype ), 'updateDisplay', this ).call( this );
  949. }
  950. } ] );
  951. return OptionController;
  952. }( Controller );
  953. var StringController = function ( _Controller ) {
  954. inherits( StringController, _Controller );
  955. function StringController( object, property ) {
  956. classCallCheck( this, StringController );
  957. var _this2 = possibleConstructorReturn( this, ( StringController.__proto__ || Object.getPrototypeOf( StringController ) ).call( this, object, property ) );
  958. var _this = _this2;
  959. function onChange() {
  960. _this.setValue( _this.__input.value );
  961. }
  962. function onBlur() {
  963. if ( _this.__onFinishChange ) {
  964. _this.__onFinishChange.call( _this, _this.getValue() );
  965. }
  966. }
  967. _this2.__input = document.createElement( 'input' );
  968. _this2.__input.setAttribute( 'type', 'text' );
  969. dom.bind( _this2.__input, 'keyup', onChange );
  970. dom.bind( _this2.__input, 'change', onChange );
  971. dom.bind( _this2.__input, 'blur', onBlur );
  972. dom.bind( _this2.__input, 'keydown', function ( e ) {
  973. if ( e.keyCode === 13 ) {
  974. this.blur();
  975. }
  976. } );
  977. _this2.updateDisplay();
  978. _this2.domElement.appendChild( _this2.__input );
  979. return _this2;
  980. }
  981. createClass( StringController, [ {
  982. key: 'updateDisplay',
  983. value: function updateDisplay() {
  984. if ( ! dom.isActive( this.__input ) ) {
  985. this.__input.value = this.getValue();
  986. }
  987. return get( StringController.prototype.__proto__ || Object.getPrototypeOf( StringController.prototype ), 'updateDisplay', this ).call( this );
  988. }
  989. } ] );
  990. return StringController;
  991. }( Controller );
  992. function numDecimals( x ) {
  993. var _x = x.toString();
  994. if ( _x.indexOf( '.' ) > - 1 ) {
  995. return _x.length - _x.indexOf( '.' ) - 1;
  996. }
  997. return 0;
  998. }
  999. var NumberController = function ( _Controller ) {
  1000. inherits( NumberController, _Controller );
  1001. function NumberController( object, property, params ) {
  1002. classCallCheck( this, NumberController );
  1003. var _this = possibleConstructorReturn( this, ( NumberController.__proto__ || Object.getPrototypeOf( NumberController ) ).call( this, object, property ) );
  1004. var _params = params || {};
  1005. _this.__min = _params.min;
  1006. _this.__max = _params.max;
  1007. _this.__step = _params.step;
  1008. if ( Common.isUndefined( _this.__step ) ) {
  1009. if ( _this.initialValue === 0 ) {
  1010. _this.__impliedStep = 1;
  1011. } else {
  1012. _this.__impliedStep = Math.pow( 10, Math.floor( Math.log( Math.abs( _this.initialValue ) ) / Math.LN10 ) ) / 10;
  1013. }
  1014. } else {
  1015. _this.__impliedStep = _this.__step;
  1016. }
  1017. _this.__precision = numDecimals( _this.__impliedStep );
  1018. return _this;
  1019. }
  1020. createClass( NumberController, [ {
  1021. key: 'setValue',
  1022. value: function setValue( v ) {
  1023. var _v = v;
  1024. if ( this.__min !== undefined && _v < this.__min ) {
  1025. _v = this.__min;
  1026. } else if ( this.__max !== undefined && _v > this.__max ) {
  1027. _v = this.__max;
  1028. }
  1029. if ( this.__step !== undefined && _v % this.__step !== 0 ) {
  1030. _v = Math.round( _v / this.__step ) * this.__step;
  1031. }
  1032. return get( NumberController.prototype.__proto__ || Object.getPrototypeOf( NumberController.prototype ), 'setValue', this ).call( this, _v );
  1033. }
  1034. }, {
  1035. key: 'min',
  1036. value: function min( minValue ) {
  1037. this.__min = minValue;
  1038. return this;
  1039. }
  1040. }, {
  1041. key: 'max',
  1042. value: function max( maxValue ) {
  1043. this.__max = maxValue;
  1044. return this;
  1045. }
  1046. }, {
  1047. key: 'step',
  1048. value: function step( stepValue ) {
  1049. this.__step = stepValue;
  1050. this.__impliedStep = stepValue;
  1051. this.__precision = numDecimals( stepValue );
  1052. return this;
  1053. }
  1054. } ] );
  1055. return NumberController;
  1056. }( Controller );
  1057. function roundToDecimal( value, decimals ) {
  1058. var tenTo = Math.pow( 10, decimals );
  1059. return Math.round( value * tenTo ) / tenTo;
  1060. }
  1061. var NumberControllerBox = function ( _NumberController ) {
  1062. inherits( NumberControllerBox, _NumberController );
  1063. function NumberControllerBox( object, property, params ) {
  1064. classCallCheck( this, NumberControllerBox );
  1065. var _this2 = possibleConstructorReturn( this, ( NumberControllerBox.__proto__ || Object.getPrototypeOf( NumberControllerBox ) ).call( this, object, property, params ) );
  1066. _this2.__truncationSuspended = false;
  1067. var _this = _this2;
  1068. var prevY = void 0;
  1069. function onChange() {
  1070. var attempted = parseFloat( _this.__input.value );
  1071. if ( ! Common.isNaN( attempted ) ) {
  1072. _this.setValue( attempted );
  1073. }
  1074. }
  1075. function onFinish() {
  1076. if ( _this.__onFinishChange ) {
  1077. _this.__onFinishChange.call( _this, _this.getValue() );
  1078. }
  1079. }
  1080. function onBlur() {
  1081. onFinish();
  1082. }
  1083. function onMouseDrag( e ) {
  1084. var diff = prevY - e.clientY;
  1085. _this.setValue( _this.getValue() + diff * _this.__impliedStep );
  1086. prevY = e.clientY;
  1087. }
  1088. function onMouseUp() {
  1089. dom.unbind( window, 'mousemove', onMouseDrag );
  1090. dom.unbind( window, 'mouseup', onMouseUp );
  1091. onFinish();
  1092. }
  1093. function onMouseDown( e ) {
  1094. dom.bind( window, 'mousemove', onMouseDrag );
  1095. dom.bind( window, 'mouseup', onMouseUp );
  1096. prevY = e.clientY;
  1097. }
  1098. _this2.__input = document.createElement( 'input' );
  1099. _this2.__input.setAttribute( 'type', 'text' );
  1100. dom.bind( _this2.__input, 'change', onChange );
  1101. dom.bind( _this2.__input, 'blur', onBlur );
  1102. dom.bind( _this2.__input, 'mousedown', onMouseDown );
  1103. dom.bind( _this2.__input, 'keydown', function ( e ) {
  1104. if ( e.keyCode === 13 ) {
  1105. _this.__truncationSuspended = true;
  1106. this.blur();
  1107. _this.__truncationSuspended = false;
  1108. onFinish();
  1109. }
  1110. } );
  1111. _this2.updateDisplay();
  1112. _this2.domElement.appendChild( _this2.__input );
  1113. return _this2;
  1114. }
  1115. createClass( NumberControllerBox, [ {
  1116. key: 'updateDisplay',
  1117. value: function updateDisplay() {
  1118. this.__input.value = this.__truncationSuspended ? this.getValue() : roundToDecimal( this.getValue(), this.__precision );
  1119. return get( NumberControllerBox.prototype.__proto__ || Object.getPrototypeOf( NumberControllerBox.prototype ), 'updateDisplay', this ).call( this );
  1120. }
  1121. } ] );
  1122. return NumberControllerBox;
  1123. }( NumberController );
  1124. function map( v, i1, i2, o1, o2 ) {
  1125. return o1 + ( o2 - o1 ) * ( ( v - i1 ) / ( i2 - i1 ) );
  1126. }
  1127. var NumberControllerSlider = function ( _NumberController ) {
  1128. inherits( NumberControllerSlider, _NumberController );
  1129. function NumberControllerSlider( object, property, min, max, step ) {
  1130. classCallCheck( this, NumberControllerSlider );
  1131. var _this2 = possibleConstructorReturn( this, ( NumberControllerSlider.__proto__ || Object.getPrototypeOf( NumberControllerSlider ) ).call( this, object, property, { min: min, max: max, step: step } ) );
  1132. var _this = _this2;
  1133. _this2.__background = document.createElement( 'div' );
  1134. _this2.__foreground = document.createElement( 'div' );
  1135. dom.bind( _this2.__background, 'mousedown', onMouseDown );
  1136. dom.bind( _this2.__background, 'touchstart', onTouchStart );
  1137. dom.addClass( _this2.__background, 'slider' );
  1138. dom.addClass( _this2.__foreground, 'slider-fg' );
  1139. function onMouseDown( e ) {
  1140. document.activeElement.blur();
  1141. dom.bind( window, 'mousemove', onMouseDrag );
  1142. dom.bind( window, 'mouseup', onMouseUp );
  1143. onMouseDrag( e );
  1144. }
  1145. function onMouseDrag( e ) {
  1146. e.preventDefault();
  1147. var bgRect = _this.__background.getBoundingClientRect();
  1148. _this.setValue( map( e.clientX, bgRect.left, bgRect.right, _this.__min, _this.__max ) );
  1149. return false;
  1150. }
  1151. function onMouseUp() {
  1152. dom.unbind( window, 'mousemove', onMouseDrag );
  1153. dom.unbind( window, 'mouseup', onMouseUp );
  1154. if ( _this.__onFinishChange ) {
  1155. _this.__onFinishChange.call( _this, _this.getValue() );
  1156. }
  1157. }
  1158. function onTouchStart( e ) {
  1159. if ( e.touches.length !== 1 ) {
  1160. return;
  1161. }
  1162. dom.bind( window, 'touchmove', onTouchMove );
  1163. dom.bind( window, 'touchend', onTouchEnd );
  1164. onTouchMove( e );
  1165. }
  1166. function onTouchMove( e ) {
  1167. var clientX = e.touches[ 0 ].clientX;
  1168. var bgRect = _this.__background.getBoundingClientRect();
  1169. _this.setValue( map( clientX, bgRect.left, bgRect.right, _this.__min, _this.__max ) );
  1170. }
  1171. function onTouchEnd() {
  1172. dom.unbind( window, 'touchmove', onTouchMove );
  1173. dom.unbind( window, 'touchend', onTouchEnd );
  1174. if ( _this.__onFinishChange ) {
  1175. _this.__onFinishChange.call( _this, _this.getValue() );
  1176. }
  1177. }
  1178. _this2.updateDisplay();
  1179. _this2.__background.appendChild( _this2.__foreground );
  1180. _this2.domElement.appendChild( _this2.__background );
  1181. return _this2;
  1182. }
  1183. createClass( NumberControllerSlider, [ {
  1184. key: 'updateDisplay',
  1185. value: function updateDisplay() {
  1186. var pct = ( this.getValue() - this.__min ) / ( this.__max - this.__min );
  1187. this.__foreground.style.width = pct * 100 + '%';
  1188. return get( NumberControllerSlider.prototype.__proto__ || Object.getPrototypeOf( NumberControllerSlider.prototype ), 'updateDisplay', this ).call( this );
  1189. }
  1190. } ] );
  1191. return NumberControllerSlider;
  1192. }( NumberController );
  1193. var FunctionController = function ( _Controller ) {
  1194. inherits( FunctionController, _Controller );
  1195. function FunctionController( object, property, text ) {
  1196. classCallCheck( this, FunctionController );
  1197. var _this2 = possibleConstructorReturn( this, ( FunctionController.__proto__ || Object.getPrototypeOf( FunctionController ) ).call( this, object, property ) );
  1198. var _this = _this2;
  1199. _this2.__button = document.createElement( 'div' );
  1200. _this2.__button.innerHTML = text === undefined ? 'Fire' : text;
  1201. dom.bind( _this2.__button, 'click', function ( e ) {
  1202. e.preventDefault();
  1203. _this.fire();
  1204. return false;
  1205. } );
  1206. dom.addClass( _this2.__button, 'button' );
  1207. _this2.domElement.appendChild( _this2.__button );
  1208. return _this2;
  1209. }
  1210. createClass( FunctionController, [ {
  1211. key: 'fire',
  1212. value: function fire() {
  1213. if ( this.__onChange ) {
  1214. this.__onChange.call( this );
  1215. }
  1216. this.getValue().call( this.object );
  1217. if ( this.__onFinishChange ) {
  1218. this.__onFinishChange.call( this, this.getValue() );
  1219. }
  1220. }
  1221. } ] );
  1222. return FunctionController;
  1223. }( Controller );
  1224. var ColorController = function ( _Controller ) {
  1225. inherits( ColorController, _Controller );
  1226. function ColorController( object, property ) {
  1227. classCallCheck( this, ColorController );
  1228. var _this2 = possibleConstructorReturn( this, ( ColorController.__proto__ || Object.getPrototypeOf( ColorController ) ).call( this, object, property ) );
  1229. _this2.__color = new Color( _this2.getValue() );
  1230. _this2.__temp = new Color( 0 );
  1231. var _this = _this2;
  1232. _this2.domElement = document.createElement( 'div' );
  1233. dom.makeSelectable( _this2.domElement, false );
  1234. _this2.__selector = document.createElement( 'div' );
  1235. _this2.__selector.className = 'selector';
  1236. _this2.__saturation_field = document.createElement( 'div' );
  1237. _this2.__saturation_field.className = 'saturation-field';
  1238. _this2.__field_knob = document.createElement( 'div' );
  1239. _this2.__field_knob.className = 'field-knob';
  1240. _this2.__field_knob_border = '2px solid ';
  1241. _this2.__hue_knob = document.createElement( 'div' );
  1242. _this2.__hue_knob.className = 'hue-knob';
  1243. _this2.__hue_field = document.createElement( 'div' );
  1244. _this2.__hue_field.className = 'hue-field';
  1245. _this2.__input = document.createElement( 'input' );
  1246. _this2.__input.type = 'text';
  1247. _this2.__input_textShadow = '0 1px 1px ';
  1248. dom.bind( _this2.__input, 'keydown', function ( e ) {
  1249. if ( e.keyCode === 13 ) {
  1250. onBlur.call( this );
  1251. }
  1252. } );
  1253. dom.bind( _this2.__input, 'blur', onBlur );
  1254. dom.bind( _this2.__selector, 'mousedown', function () {
  1255. dom.addClass( this, 'drag' ).bind( window, 'mouseup', function () {
  1256. dom.removeClass( _this.__selector, 'drag' );
  1257. } );
  1258. } );
  1259. dom.bind( _this2.__selector, 'touchstart', function () {
  1260. dom.addClass( this, 'drag' ).bind( window, 'touchend', function () {
  1261. dom.removeClass( _this.__selector, 'drag' );
  1262. } );
  1263. } );
  1264. var valueField = document.createElement( 'div' );
  1265. Common.extend( _this2.__selector.style, {
  1266. width: '122px',
  1267. height: '102px',
  1268. padding: '3px',
  1269. backgroundColor: '#222',
  1270. boxShadow: '0px 1px 3px rgba(0,0,0,0.3)'
  1271. } );
  1272. Common.extend( _this2.__field_knob.style, {
  1273. position: 'absolute',
  1274. width: '12px',
  1275. height: '12px',
  1276. border: _this2.__field_knob_border + ( _this2.__color.v < 0.5 ? '#fff' : '#000' ),
  1277. boxShadow: '0px 1px 3px rgba(0,0,0,0.5)',
  1278. borderRadius: '12px',
  1279. zIndex: 1
  1280. } );
  1281. Common.extend( _this2.__hue_knob.style, {
  1282. position: 'absolute',
  1283. width: '15px',
  1284. height: '2px',
  1285. borderRight: '4px solid #fff',
  1286. zIndex: 1
  1287. } );
  1288. Common.extend( _this2.__saturation_field.style, {
  1289. width: '100px',
  1290. height: '100px',
  1291. border: '1px solid #555',
  1292. marginRight: '3px',
  1293. display: 'inline-block',
  1294. cursor: 'pointer'
  1295. } );
  1296. Common.extend( valueField.style, {
  1297. width: '100%',
  1298. height: '100%',
  1299. background: 'none'
  1300. } );
  1301. linearGradient( valueField, 'top', 'rgba(0,0,0,0)', '#000' );
  1302. Common.extend( _this2.__hue_field.style, {
  1303. width: '15px',
  1304. height: '100px',
  1305. border: '1px solid #555',
  1306. cursor: 'ns-resize',
  1307. position: 'absolute',
  1308. top: '3px',
  1309. right: '3px'
  1310. } );
  1311. hueGradient( _this2.__hue_field );
  1312. Common.extend( _this2.__input.style, {
  1313. outline: 'none',
  1314. textAlign: 'center',
  1315. color: '#fff',
  1316. border: 0,
  1317. fontWeight: 'bold',
  1318. textShadow: _this2.__input_textShadow + 'rgba(0,0,0,0.7)'
  1319. } );
  1320. dom.bind( _this2.__saturation_field, 'mousedown', fieldDown );
  1321. dom.bind( _this2.__saturation_field, 'touchstart', fieldDown );
  1322. dom.bind( _this2.__field_knob, 'mousedown', fieldDown );
  1323. dom.bind( _this2.__field_knob, 'touchstart', fieldDown );
  1324. dom.bind( _this2.__hue_field, 'mousedown', fieldDownH );
  1325. dom.bind( _this2.__hue_field, 'touchstart', fieldDownH );
  1326. function fieldDown( e ) {
  1327. setSV( e );
  1328. dom.bind( window, 'mousemove', setSV );
  1329. dom.bind( window, 'touchmove', setSV );
  1330. dom.bind( window, 'mouseup', fieldUpSV );
  1331. dom.bind( window, 'touchend', fieldUpSV );
  1332. }
  1333. function fieldDownH( e ) {
  1334. setH( e );
  1335. dom.bind( window, 'mousemove', setH );
  1336. dom.bind( window, 'touchmove', setH );
  1337. dom.bind( window, 'mouseup', fieldUpH );
  1338. dom.bind( window, 'touchend', fieldUpH );
  1339. }
  1340. function fieldUpSV() {
  1341. dom.unbind( window, 'mousemove', setSV );
  1342. dom.unbind( window, 'touchmove', setSV );
  1343. dom.unbind( window, 'mouseup', fieldUpSV );
  1344. dom.unbind( window, 'touchend', fieldUpSV );
  1345. onFinish();
  1346. }
  1347. function fieldUpH() {
  1348. dom.unbind( window, 'mousemove', setH );
  1349. dom.unbind( window, 'touchmove', setH );
  1350. dom.unbind( window, 'mouseup', fieldUpH );
  1351. dom.unbind( window, 'touchend', fieldUpH );
  1352. onFinish();
  1353. }
  1354. function onBlur() {
  1355. var i = interpret( this.value );
  1356. if ( i !== false ) {
  1357. _this.__color.__state = i;
  1358. _this.setValue( _this.__color.toOriginal() );
  1359. } else {
  1360. this.value = _this.__color.toString();
  1361. }
  1362. }
  1363. function onFinish() {
  1364. if ( _this.__onFinishChange ) {
  1365. _this.__onFinishChange.call( _this, _this.__color.toOriginal() );
  1366. }
  1367. }
  1368. _this2.__saturation_field.appendChild( valueField );
  1369. _this2.__selector.appendChild( _this2.__field_knob );
  1370. _this2.__selector.appendChild( _this2.__saturation_field );
  1371. _this2.__selector.appendChild( _this2.__hue_field );
  1372. _this2.__hue_field.appendChild( _this2.__hue_knob );
  1373. _this2.domElement.appendChild( _this2.__input );
  1374. _this2.domElement.appendChild( _this2.__selector );
  1375. _this2.updateDisplay();
  1376. function setSV( e ) {
  1377. if ( e.type.indexOf( 'touch' ) === - 1 ) {
  1378. e.preventDefault();
  1379. }
  1380. var fieldRect = _this.__saturation_field.getBoundingClientRect();
  1381. var _ref = e.touches && e.touches[ 0 ] || e,
  1382. clientX = _ref.clientX,
  1383. clientY = _ref.clientY;
  1384. var s = ( clientX - fieldRect.left ) / ( fieldRect.right - fieldRect.left );
  1385. var v = 1 - ( clientY - fieldRect.top ) / ( fieldRect.bottom - fieldRect.top );
  1386. if ( v > 1 ) {
  1387. v = 1;
  1388. } else if ( v < 0 ) {
  1389. v = 0;
  1390. }
  1391. if ( s > 1 ) {
  1392. s = 1;
  1393. } else if ( s < 0 ) {
  1394. s = 0;
  1395. }
  1396. _this.__color.v = v;
  1397. _this.__color.s = s;
  1398. _this.setValue( _this.__color.toOriginal() );
  1399. return false;
  1400. }
  1401. function setH( e ) {
  1402. if ( e.type.indexOf( 'touch' ) === - 1 ) {
  1403. e.preventDefault();
  1404. }
  1405. var fieldRect = _this.__hue_field.getBoundingClientRect();
  1406. var _ref2 = e.touches && e.touches[ 0 ] || e,
  1407. clientY = _ref2.clientY;
  1408. var h = 1 - ( clientY - fieldRect.top ) / ( fieldRect.bottom - fieldRect.top );
  1409. if ( h > 1 ) {
  1410. h = 1;
  1411. } else if ( h < 0 ) {
  1412. h = 0;
  1413. }
  1414. _this.__color.h = h * 360;
  1415. _this.setValue( _this.__color.toOriginal() );
  1416. return false;
  1417. }
  1418. return _this2;
  1419. }
  1420. createClass( ColorController, [ {
  1421. key: 'updateDisplay',
  1422. value: function updateDisplay() {
  1423. var i = interpret( this.getValue() );
  1424. if ( i !== false ) {
  1425. var mismatch = false;
  1426. Common.each( Color.COMPONENTS, function ( component ) {
  1427. if ( ! Common.isUndefined( i[ component ] ) && ! Common.isUndefined( this.__color.__state[ component ] ) && i[ component ] !== this.__color.__state[ component ] ) {
  1428. mismatch = true;
  1429. return {};
  1430. }
  1431. }, this );
  1432. if ( mismatch ) {
  1433. Common.extend( this.__color.__state, i );
  1434. }
  1435. }
  1436. Common.extend( this.__temp.__state, this.__color.__state );
  1437. this.__temp.a = 1;
  1438. var flip = this.__color.v < 0.5 || this.__color.s > 0.5 ? 255 : 0;
  1439. var _flip = 255 - flip;
  1440. Common.extend( this.__field_knob.style, {
  1441. marginLeft: 100 * this.__color.s - 7 + 'px',
  1442. marginTop: 100 * ( 1 - this.__color.v ) - 7 + 'px',
  1443. backgroundColor: this.__temp.toHexString(),
  1444. border: this.__field_knob_border + 'rgb(' + flip + ',' + flip + ',' + flip + ')'
  1445. } );
  1446. this.__hue_knob.style.marginTop = ( 1 - this.__color.h / 360 ) * 100 + 'px';
  1447. this.__temp.s = 1;
  1448. this.__temp.v = 1;
  1449. linearGradient( this.__saturation_field, 'left', '#fff', this.__temp.toHexString() );
  1450. this.__input.value = this.__color.toString();
  1451. Common.extend( this.__input.style, {
  1452. backgroundColor: this.__color.toHexString(),
  1453. color: 'rgb(' + flip + ',' + flip + ',' + flip + ')',
  1454. textShadow: this.__input_textShadow + 'rgba(' + _flip + ',' + _flip + ',' + _flip + ',.7)'
  1455. } );
  1456. }
  1457. } ] );
  1458. return ColorController;
  1459. }( Controller );
  1460. var vendors = [ '-moz-', '-o-', '-webkit-', '-ms-', '' ];
  1461. function linearGradient( elem, x, a, b ) {
  1462. elem.style.background = '';
  1463. Common.each( vendors, function ( vendor ) {
  1464. elem.style.cssText += 'background: ' + vendor + 'linear-gradient(' + x + ', ' + a + ' 0%, ' + b + ' 100%); ';
  1465. } );
  1466. }
  1467. function hueGradient( elem ) {
  1468. elem.style.background = '';
  1469. elem.style.cssText += 'background: -moz-linear-gradient(top, #ff0000 0%, #ff00ff 17%, #0000ff 34%, #00ffff 50%, #00ff00 67%, #ffff00 84%, #ff0000 100%);';
  1470. elem.style.cssText += 'background: -webkit-linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);';
  1471. elem.style.cssText += 'background: -o-linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);';
  1472. elem.style.cssText += 'background: -ms-linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);';
  1473. elem.style.cssText += 'background: linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);';
  1474. }
  1475. var css = {
  1476. load: function load( url, indoc ) {
  1477. var doc = indoc || document;
  1478. var link = doc.createElement( 'link' );
  1479. link.type = 'text/css';
  1480. link.rel = 'stylesheet';
  1481. link.href = url;
  1482. doc.getElementsByTagName( 'head' )[ 0 ].appendChild( link );
  1483. },
  1484. inject: function inject( cssContent, indoc ) {
  1485. var doc = indoc || document;
  1486. var injected = document.createElement( 'style' );
  1487. injected.type = 'text/css';
  1488. injected.innerHTML = cssContent;
  1489. var head = doc.getElementsByTagName( 'head' )[ 0 ];
  1490. try {
  1491. head.appendChild( injected );
  1492. } catch ( e ) {
  1493. }
  1494. }
  1495. };
  1496. var saveDialogContents = "<div id=\"dg-save\" class=\"dg dialogue\">\n\n Here's the new load parameter for your <code>GUI</code>'s constructor:\n\n <textarea id=\"dg-new-constructor\"></textarea>\n\n <div id=\"dg-save-locally\">\n\n <input id=\"dg-local-storage\" type=\"checkbox\"/> Automatically save\n values to <code>localStorage</code> on exit.\n\n <div id=\"dg-local-explain\">The values saved to <code>localStorage</code> will\n override those passed to <code>dat.GUI</code>'s constructor. This makes it\n easier to work incrementally, but <code>localStorage</code> is fragile,\n and your friends may not see the same values you do.\n\n </div>\n\n </div>\n\n</div>";
  1497. var ControllerFactory = function ControllerFactory( object, property ) {
  1498. var initialValue = object[ property ];
  1499. if ( Common.isArray( arguments[ 2 ] ) || Common.isObject( arguments[ 2 ] ) ) {
  1500. return new OptionController( object, property, arguments[ 2 ] );
  1501. }
  1502. if ( Common.isNumber( initialValue ) ) {
  1503. if ( Common.isNumber( arguments[ 2 ] ) && Common.isNumber( arguments[ 3 ] ) ) {
  1504. if ( Common.isNumber( arguments[ 4 ] ) ) {
  1505. return new NumberControllerSlider( object, property, arguments[ 2 ], arguments[ 3 ], arguments[ 4 ] );
  1506. }
  1507. return new NumberControllerSlider( object, property, arguments[ 2 ], arguments[ 3 ] );
  1508. }
  1509. if ( Common.isNumber( arguments[ 4 ] ) ) {
  1510. return new NumberControllerBox( object, property, { min: arguments[ 2 ], max: arguments[ 3 ], step: arguments[ 4 ] } );
  1511. }
  1512. return new NumberControllerBox( object, property, { min: arguments[ 2 ], max: arguments[ 3 ] } );
  1513. }
  1514. if ( Common.isString( initialValue ) ) {
  1515. return new StringController( object, property );
  1516. }
  1517. if ( Common.isFunction( initialValue ) ) {
  1518. return new FunctionController( object, property, '' );
  1519. }
  1520. if ( Common.isBoolean( initialValue ) ) {
  1521. return new BooleanController( object, property );
  1522. }
  1523. return null;
  1524. };
  1525. function requestAnimationFrame( callback ) {
  1526. setTimeout( callback, 1000 / 60 );
  1527. }
  1528. var requestAnimationFrame$1 = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || requestAnimationFrame;
  1529. var CenteredDiv = function () {
  1530. function CenteredDiv() {
  1531. classCallCheck( this, CenteredDiv );
  1532. this.backgroundElement = document.createElement( 'div' );
  1533. Common.extend( this.backgroundElement.style, {
  1534. backgroundColor: 'rgba(0,0,0,0.8)',
  1535. top: 0,
  1536. left: 0,
  1537. display: 'none',
  1538. zIndex: '1000',
  1539. opacity: 0,
  1540. WebkitTransition: 'opacity 0.2s linear',
  1541. transition: 'opacity 0.2s linear'
  1542. } );
  1543. dom.makeFullscreen( this.backgroundElement );
  1544. this.backgroundElement.style.position = 'fixed';
  1545. this.domElement = document.createElement( 'div' );
  1546. Common.extend( this.domElement.style, {
  1547. position: 'fixed',
  1548. display: 'none',
  1549. zIndex: '1001',
  1550. opacity: 0,
  1551. WebkitTransition: '-webkit-transform 0.2s ease-out, opacity 0.2s linear',
  1552. transition: 'transform 0.2s ease-out, opacity 0.2s linear'
  1553. } );
  1554. document.body.appendChild( this.backgroundElement );
  1555. document.body.appendChild( this.domElement );
  1556. var _this = this;
  1557. dom.bind( this.backgroundElement, 'click', function () {
  1558. _this.hide();
  1559. } );
  1560. }
  1561. createClass( CenteredDiv, [ {
  1562. key: 'show',
  1563. value: function show() {
  1564. var _this = this;
  1565. this.backgroundElement.style.display = 'block';
  1566. this.domElement.style.display = 'block';
  1567. this.domElement.style.opacity = 0;
  1568. this.domElement.style.webkitTransform = 'scale(1.1)';
  1569. this.layout();
  1570. Common.defer( function () {
  1571. _this.backgroundElement.style.opacity = 1;
  1572. _this.domElement.style.opacity = 1;
  1573. _this.domElement.style.webkitTransform = 'scale(1)';
  1574. } );
  1575. }
  1576. }, {
  1577. key: 'hide',
  1578. value: function hide() {
  1579. var _this = this;
  1580. var hide = function hide() {
  1581. _this.domElement.style.display = 'none';
  1582. _this.backgroundElement.style.display = 'none';
  1583. dom.unbind( _this.domElement, 'webkitTransitionEnd', hide );
  1584. dom.unbind( _this.domElement, 'transitionend', hide );
  1585. dom.unbind( _this.domElement, 'oTransitionEnd', hide );
  1586. };
  1587. dom.bind( this.domElement, 'webkitTransitionEnd', hide );
  1588. dom.bind( this.domElement, 'transitionend', hide );
  1589. dom.bind( this.domElement, 'oTransitionEnd', hide );
  1590. this.backgroundElement.style.opacity = 0;
  1591. this.domElement.style.opacity = 0;
  1592. this.domElement.style.webkitTransform = 'scale(1.1)';
  1593. }
  1594. }, {
  1595. key: 'layout',
  1596. value: function layout() {
  1597. this.domElement.style.left = window.innerWidth / 2 - dom.getWidth( this.domElement ) / 2 + 'px';
  1598. this.domElement.style.top = window.innerHeight / 2 - dom.getHeight( this.domElement ) / 2 + 'px';
  1599. }
  1600. } ] );
  1601. return CenteredDiv;
  1602. }();
  1603. var styleSheet = ___$insertStyle( ".dg ul{list-style:none;margin:0;padding:0;width:100%;clear:both}.dg.ac{position:fixed;top:0;left:0;right:0;height:0;z-index:0}.dg:not(.ac) .main{overflow:hidden}.dg.main{-webkit-transition:opacity .1s linear;-o-transition:opacity .1s linear;-moz-transition:opacity .1s linear;transition:opacity .1s linear}.dg.main.taller-than-window{overflow-y:auto}.dg.main.taller-than-window .close-button{opacity:1;margin-top:-1px;border-top:1px solid #2c2c2c}.dg.main ul.closed .close-button{opacity:1 !important}.dg.main:hover .close-button,.dg.main .close-button.drag{opacity:1}.dg.main .close-button{-webkit-transition:opacity .1s linear;-o-transition:opacity .1s linear;-moz-transition:opacity .1s linear;transition:opacity .1s linear;border:0;line-height:19px;height:20px;cursor:pointer;text-align:center;background-color:#000}.dg.main .close-button.close-top{position:relative}.dg.main .close-button.close-bottom{position:absolute}.dg.main .close-button:hover{background-color:#111}.dg.a{float:right;margin-right:15px;overflow-y:visible}.dg.a.has-save>ul.close-top{margin-top:0}.dg.a.has-save>ul.close-bottom{margin-top:27px}.dg.a.has-save>ul.closed{margin-top:0}.dg.a .save-row{top:0;z-index:1002}.dg.a .save-row.close-top{position:relative}.dg.a .save-row.close-bottom{position:fixed}.dg li{-webkit-transition:height .1s ease-out;-o-transition:height .1s ease-out;-moz-transition:height .1s ease-out;transition:height .1s ease-out;-webkit-transition:overflow .1s linear;-o-transition:overflow .1s linear;-moz-transition:overflow .1s linear;transition:overflow .1s linear}.dg li:not(.folder){cursor:auto;height:27px;line-height:27px;padding:0 4px 0 5px}.dg li.folder{padding:0;border-left:4px solid rgba(0,0,0,0)}.dg li.title{cursor:pointer;margin-left:-4px}.dg .closed li:not(.title),.dg .closed ul li,.dg .closed ul li>*{height:0;overflow:hidden;border:0}.dg .cr{clear:both;padding-left:3px;height:27px;overflow:hidden}.dg .property-name{cursor:default;float:left;clear:left;width:40%;overflow:hidden;text-overflow:ellipsis}.dg .c{float:left;width:60%;position:relative}.dg .c input[type=text]{border:0;margin-top:4px;padding:3px;width:100%;float:right}.dg .has-slider input[type=text]{width:30%;margin-left:0}.dg .slider{float:left;width:66%;margin-left:-5px;margin-right:0;height:19px;margin-top:4px}.dg .slider-fg{height:100%}.dg .c input[type=checkbox]{margin-top:7px}.dg .c select{margin-top:5px}.dg .cr.function,.dg .cr.function .property-name,.dg .cr.function *,.dg .cr.boolean,.dg .cr.boolean *{cursor:pointer}.dg .cr.color{overflow:visible}.dg .selector{display:none;position:absolute;margin-left:-9px;margin-top:23px;z-index:10}.dg .c:hover .selector,.dg .selector.drag{display:block}.dg li.save-row{padding:0}.dg li.save-row .button{display:inline-block;padding:0px 6px}.dg.dialogue{background-color:#222;width:460px;padding:15px;font-size:13px;line-height:15px}#dg-new-constructor{padding:10px;color:#222;font-family:Monaco, monospace;font-size:10px;border:0;resize:none;box-shadow:inset 1px 1px 1px #888;word-wrap:break-word;margin:12px 0;display:block;width:440px;overflow-y:scroll;height:100px;position:relative}#dg-local-explain{display:none;font-size:11px;line-height:17px;border-radius:3px;background-color:#333;padding:8px;margin-top:10px}#dg-local-explain code{font-size:10px}#dat-gui-save-locally{display:none}.dg{color:#eee;font:11px 'Lucida Grande', sans-serif;text-shadow:0 -1px 0 #111}.dg.main::-webkit-scrollbar{width:5px;background:#1a1a1a}.dg.main::-webkit-scrollbar-corner{height:0;display:none}.dg.main::-webkit-scrollbar-thumb{border-radius:5px;background:#676767}.dg li:not(.folder){background:#1a1a1a;border-bottom:1px solid #2c2c2c}.dg li.save-row{line-height:25px;background:#dad5cb;border:0}.dg li.save-row select{margin-left:5px;width:108px}.dg li.save-row .button{margin-left:5px;margin-top:1px;border-radius:2px;font-size:9px;line-height:7px;padding:4px 4px 5px 4px;background:#c5bdad;color:#fff;text-shadow:0 1px 0 #b0a58f;box-shadow:0 -1px 0 #b0a58f;cursor:pointer}.dg li.save-row .button.gears{background:#c5bdad url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAANCAYAAAB/9ZQ7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAQJJREFUeNpiYKAU/P//PwGIC/ApCABiBSAW+I8AClAcgKxQ4T9hoMAEUrxx2QSGN6+egDX+/vWT4e7N82AMYoPAx/evwWoYoSYbACX2s7KxCxzcsezDh3evFoDEBYTEEqycggWAzA9AuUSQQgeYPa9fPv6/YWm/Acx5IPb7ty/fw+QZblw67vDs8R0YHyQhgObx+yAJkBqmG5dPPDh1aPOGR/eugW0G4vlIoTIfyFcA+QekhhHJhPdQxbiAIguMBTQZrPD7108M6roWYDFQiIAAv6Aow/1bFwXgis+f2LUAynwoIaNcz8XNx3Dl7MEJUDGQpx9gtQ8YCueB+D26OECAAQDadt7e46D42QAAAABJRU5ErkJggg==) 2px 1px no-repeat;height:7px;width:8px}.dg li.save-row .button:hover{background-color:#bab19e;box-shadow:0 -1px 0 #b0a58f}.dg li.folder{border-bottom:0}.dg li.title{padding-left:16px;background:#000 url(data:image/gif;base64,R0lGODlhBQAFAJEAAP////Pz8////////yH5BAEAAAIALAAAAAAFAAUAAAIIlI+hKgFxoCgAOw==) 6px 10px no-repeat;cursor:pointer;border-bottom:1px solid rgba(255,255,255,0.2)}.dg .closed li.title{background-image:url(data:image/gif;base64,R0lGODlhBQAFAJEAAP////Pz8////////yH5BAEAAAIALAAAAAAFAAUAAAIIlGIWqMCbWAEAOw==)}.dg .cr.boolean{border-left:3px solid #806787}.dg .cr.color{border-left:3px solid}.dg .cr.function{border-left:3px solid #e61d5f}.dg .cr.number{border-left:3px solid #2FA1D6}.dg .cr.number input[type=text]{color:#2FA1D6}.dg .cr.string{border-left:3px solid #1ed36f}.dg .cr.string input[type=text]{color:#1ed36f}.dg .cr.function:hover,.dg .cr.boolean:hover{background:#111}.dg .c input[type=text]{background:#303030;outline:none}.dg .c input[type=text]:hover{background:#3c3c3c}.dg .c input[type=text]:focus{background:#494949;color:#fff}.dg .c .slider{background:#303030;cursor:ew-resize}.dg .c .slider-fg{background:#2FA1D6;max-width:100%}.dg .c .slider:hover{background:#3c3c3c}.dg .c .slider:hover .slider-fg{background:#44abda}\n" );
  1604. css.inject( styleSheet );
  1605. var CSS_NAMESPACE = 'dg';
  1606. var HIDE_KEY_CODE = 72;
  1607. var CLOSE_BUTTON_HEIGHT = 20;
  1608. var DEFAULT_DEFAULT_PRESET_NAME = 'Default';
  1609. var SUPPORTS_LOCAL_STORAGE = function () {
  1610. try {
  1611. return !! window.localStorage;
  1612. } catch ( e ) {
  1613. return false;
  1614. }
  1615. }();
  1616. var SAVE_DIALOGUE = void 0;
  1617. var autoPlaceVirgin = true;
  1618. var autoPlaceContainer = void 0;
  1619. var hide = false;
  1620. var hideableGuis = [];
  1621. var GUI = function GUI( pars ) {
  1622. var _this = this;
  1623. var params = pars || {};
  1624. this.domElement = document.createElement( 'div' );
  1625. this.__ul = document.createElement( 'ul' );
  1626. this.domElement.appendChild( this.__ul );
  1627. dom.addClass( this.domElement, CSS_NAMESPACE );
  1628. this.__folders = {};
  1629. this.__controllers = [];
  1630. this.__rememberedObjects = [];
  1631. this.__rememberedObjectIndecesToControllers = [];
  1632. this.__listening = [];
  1633. params = Common.defaults( params, {
  1634. closeOnTop: false,
  1635. autoPlace: true,
  1636. width: GUI.DEFAULT_WIDTH
  1637. } );
  1638. params = Common.defaults( params, {
  1639. resizable: params.autoPlace,
  1640. hideable: params.autoPlace
  1641. } );
  1642. if ( ! Common.isUndefined( params.load ) ) {
  1643. if ( params.preset ) {
  1644. params.load.preset = params.preset;
  1645. }
  1646. } else {
  1647. params.load = { preset: DEFAULT_DEFAULT_PRESET_NAME };
  1648. }
  1649. if ( Common.isUndefined( params.parent ) && params.hideable ) {
  1650. hideableGuis.push( this );
  1651. }
  1652. params.resizable = Common.isUndefined( params.parent ) && params.resizable;
  1653. if ( params.autoPlace && Common.isUndefined( params.scrollable ) ) {
  1654. params.scrollable = true;
  1655. }
  1656. var useLocalStorage = SUPPORTS_LOCAL_STORAGE && localStorage.getItem( getLocalStorageHash( this, 'isLocal' ) ) === 'true';
  1657. var saveToLocalStorage = void 0;
  1658. var titleRow = void 0;
  1659. Object.defineProperties( this,
  1660. {
  1661. parent: {
  1662. get: function get$$1() {
  1663. return params.parent;
  1664. }
  1665. },
  1666. scrollable: {
  1667. get: function get$$1() {
  1668. return params.scrollable;
  1669. }
  1670. },
  1671. autoPlace: {
  1672. get: function get$$1() {
  1673. return params.autoPlace;
  1674. }
  1675. },
  1676. closeOnTop: {
  1677. get: function get$$1() {
  1678. return params.closeOnTop;
  1679. }
  1680. },
  1681. preset: {
  1682. get: function get$$1() {
  1683. if ( _this.parent ) {
  1684. return _this.getRoot().preset;
  1685. }
  1686. return params.load.preset;
  1687. },
  1688. set: function set$$1( v ) {
  1689. if ( _this.parent ) {
  1690. _this.getRoot().preset = v;
  1691. } else {
  1692. params.load.preset = v;
  1693. }
  1694. setPresetSelectIndex( this );
  1695. _this.revert();
  1696. }
  1697. },
  1698. width: {
  1699. get: function get$$1() {
  1700. return params.width;
  1701. },
  1702. set: function set$$1( v ) {
  1703. params.width = v;
  1704. setWidth( _this, v );
  1705. }
  1706. },
  1707. name: {
  1708. get: function get$$1() {
  1709. return params.name;
  1710. },
  1711. set: function set$$1( v ) {
  1712. params.name = v;
  1713. if ( titleRow ) {
  1714. titleRow.innerHTML = params.name;
  1715. }
  1716. }
  1717. },
  1718. closed: {
  1719. get: function get$$1() {
  1720. return params.closed;
  1721. },
  1722. set: function set$$1( v ) {
  1723. params.closed = v;
  1724. if ( params.closed ) {
  1725. dom.addClass( _this.__ul, GUI.CLASS_CLOSED );
  1726. } else {
  1727. dom.removeClass( _this.__ul, GUI.CLASS_CLOSED );
  1728. }
  1729. this.onResize();
  1730. if ( _this.__closeButton ) {
  1731. _this.__closeButton.innerHTML = v ? GUI.TEXT_OPEN : GUI.TEXT_CLOSED;
  1732. }
  1733. }
  1734. },
  1735. load: {
  1736. get: function get$$1() {
  1737. return params.load;
  1738. }
  1739. },
  1740. useLocalStorage: {
  1741. get: function get$$1() {
  1742. return useLocalStorage;
  1743. },
  1744. set: function set$$1( bool ) {
  1745. if ( SUPPORTS_LOCAL_STORAGE ) {
  1746. useLocalStorage = bool;
  1747. if ( bool ) {
  1748. dom.bind( window, 'unload', saveToLocalStorage );
  1749. } else {
  1750. dom.unbind( window, 'unload', saveToLocalStorage );
  1751. }
  1752. localStorage.setItem( getLocalStorageHash( _this, 'isLocal' ), bool );
  1753. }
  1754. }
  1755. }
  1756. } );
  1757. if ( Common.isUndefined( params.parent ) ) {
  1758. this.closed = params.closed || false;
  1759. dom.addClass( this.domElement, GUI.CLASS_MAIN );
  1760. dom.makeSelectable( this.domElement, false );
  1761. if ( SUPPORTS_LOCAL_STORAGE ) {
  1762. if ( useLocalStorage ) {
  1763. _this.useLocalStorage = true;
  1764. var savedGui = localStorage.getItem( getLocalStorageHash( this, 'gui' ) );
  1765. if ( savedGui ) {
  1766. params.load = JSON.parse( savedGui );
  1767. }
  1768. }
  1769. }
  1770. this.__closeButton = document.createElement( 'div' );
  1771. this.__closeButton.innerHTML = GUI.TEXT_CLOSED;
  1772. dom.addClass( this.__closeButton, GUI.CLASS_CLOSE_BUTTON );
  1773. if ( params.closeOnTop ) {
  1774. dom.addClass( this.__closeButton, GUI.CLASS_CLOSE_TOP );
  1775. this.domElement.insertBefore( this.__closeButton, this.domElement.childNodes[ 0 ] );
  1776. } else {
  1777. dom.addClass( this.__closeButton, GUI.CLASS_CLOSE_BOTTOM );
  1778. this.domElement.appendChild( this.__closeButton );
  1779. }
  1780. dom.bind( this.__closeButton, 'click', function () {
  1781. _this.closed = ! _this.closed;
  1782. } );
  1783. } else {
  1784. if ( params.closed === undefined ) {
  1785. params.closed = true;
  1786. }
  1787. var titleRowName = document.createTextNode( params.name );
  1788. dom.addClass( titleRowName, 'controller-name' );
  1789. titleRow = addRow( _this, titleRowName );
  1790. var onClickTitle = function onClickTitle( e ) {
  1791. e.preventDefault();
  1792. _this.closed = ! _this.closed;
  1793. return false;
  1794. };
  1795. dom.addClass( this.__ul, GUI.CLASS_CLOSED );
  1796. dom.addClass( titleRow, 'title' );
  1797. dom.bind( titleRow, 'click', onClickTitle );
  1798. if ( ! params.closed ) {
  1799. this.closed = false;
  1800. }
  1801. }
  1802. if ( params.autoPlace ) {
  1803. if ( Common.isUndefined( params.parent ) ) {
  1804. if ( autoPlaceVirgin ) {
  1805. autoPlaceContainer = document.createElement( 'div' );
  1806. dom.addClass( autoPlaceContainer, CSS_NAMESPACE );
  1807. dom.addClass( autoPlaceContainer, GUI.CLASS_AUTO_PLACE_CONTAINER );
  1808. document.body.appendChild( autoPlaceContainer );
  1809. autoPlaceVirgin = false;
  1810. }
  1811. autoPlaceContainer.appendChild( this.domElement );
  1812. dom.addClass( this.domElement, GUI.CLASS_AUTO_PLACE );
  1813. }
  1814. if ( ! this.parent ) {
  1815. setWidth( _this, params.width );
  1816. }
  1817. }
  1818. this.__resizeHandler = function () {
  1819. _this.onResizeDebounced();
  1820. };
  1821. dom.bind( window, 'resize', this.__resizeHandler );
  1822. dom.bind( this.__ul, 'webkitTransitionEnd', this.__resizeHandler );
  1823. dom.bind( this.__ul, 'transitionend', this.__resizeHandler );
  1824. dom.bind( this.__ul, 'oTransitionEnd', this.__resizeHandler );
  1825. this.onResize();
  1826. if ( params.resizable ) {
  1827. addResizeHandle( this );
  1828. }
  1829. saveToLocalStorage = function saveToLocalStorage() {
  1830. if ( SUPPORTS_LOCAL_STORAGE && localStorage.getItem( getLocalStorageHash( _this, 'isLocal' ) ) === 'true' ) {
  1831. localStorage.setItem( getLocalStorageHash( _this, 'gui' ), JSON.stringify( _this.getSaveObject() ) );
  1832. }
  1833. };
  1834. this.saveToLocalStorageIfPossible = saveToLocalStorage;
  1835. function resetWidth() {
  1836. var root = _this.getRoot();
  1837. root.width += 1;
  1838. Common.defer( function () {
  1839. root.width -= 1;
  1840. } );
  1841. }
  1842. if ( ! params.parent ) {
  1843. resetWidth();
  1844. }
  1845. };
  1846. GUI.toggleHide = function () {
  1847. hide = ! hide;
  1848. Common.each( hideableGuis, function ( gui ) {
  1849. gui.domElement.style.display = hide ? 'none' : '';
  1850. } );
  1851. };
  1852. GUI.CLASS_AUTO_PLACE = 'a';
  1853. GUI.CLASS_AUTO_PLACE_CONTAINER = 'ac';
  1854. GUI.CLASS_MAIN = 'main';
  1855. GUI.CLASS_CONTROLLER_ROW = 'cr';
  1856. GUI.CLASS_TOO_TALL = 'taller-than-window';
  1857. GUI.CLASS_CLOSED = 'closed';
  1858. GUI.CLASS_CLOSE_BUTTON = 'close-button';
  1859. GUI.CLASS_CLOSE_TOP = 'close-top';
  1860. GUI.CLASS_CLOSE_BOTTOM = 'close-bottom';
  1861. GUI.CLASS_DRAG = 'drag';
  1862. GUI.DEFAULT_WIDTH = 245;
  1863. GUI.TEXT_CLOSED = 'Close Controls';
  1864. GUI.TEXT_OPEN = 'Open Controls';
  1865. GUI._keydownHandler = function ( e ) {
  1866. if ( document.activeElement.type !== 'text' && ( e.which === HIDE_KEY_CODE || e.keyCode === HIDE_KEY_CODE ) ) {
  1867. GUI.toggleHide();
  1868. }
  1869. };
  1870. dom.bind( window, 'keydown', GUI._keydownHandler, false );
  1871. Common.extend( GUI.prototype,
  1872. {
  1873. add: function add( object, property ) {
  1874. return _add( this, object, property, {
  1875. factoryArgs: Array.prototype.slice.call( arguments, 2 )
  1876. } );
  1877. },
  1878. addColor: function addColor( object, property ) {
  1879. return _add( this, object, property, {
  1880. color: true
  1881. } );
  1882. },
  1883. remove: function remove( controller ) {
  1884. this.__ul.removeChild( controller.__li );
  1885. this.__controllers.splice( this.__controllers.indexOf( controller ), 1 );
  1886. var _this = this;
  1887. Common.defer( function () {
  1888. _this.onResize();
  1889. } );
  1890. },
  1891. destroy: function destroy() {
  1892. if ( this.parent ) {
  1893. throw new Error( 'Only the root GUI should be removed with .destroy(). ' + 'For subfolders, use gui.removeFolder(folder) instead.' );
  1894. }
  1895. if ( this.autoPlace ) {
  1896. autoPlaceContainer.removeChild( this.domElement );
  1897. }
  1898. var _this = this;
  1899. Common.each( this.__folders, function ( subfolder ) {
  1900. _this.removeFolder( subfolder );
  1901. } );
  1902. dom.unbind( window, 'keydown', GUI._keydownHandler, false );
  1903. removeListeners( this );
  1904. },
  1905. addFolder: function addFolder( name ) {
  1906. if ( this.__folders[ name ] !== undefined ) {
  1907. throw new Error( 'You already have a folder in this GUI by the' + ' name "' + name + '"' );
  1908. }
  1909. var newGuiParams = { name: name, parent: this };
  1910. newGuiParams.autoPlace = this.autoPlace;
  1911. if ( this.load &&
  1912. this.load.folders &&
  1913. this.load.folders[ name ] ) {
  1914. newGuiParams.closed = this.load.folders[ name ].closed;
  1915. newGuiParams.load = this.load.folders[ name ];
  1916. }
  1917. var gui = new GUI( newGuiParams );
  1918. this.__folders[ name ] = gui;
  1919. var li = addRow( this, gui.domElement );
  1920. dom.addClass( li, 'folder' );
  1921. return gui;
  1922. },
  1923. removeFolder: function removeFolder( folder ) {
  1924. this.__ul.removeChild( folder.domElement.parentElement );
  1925. delete this.__folders[ folder.name ];
  1926. if ( this.load &&
  1927. this.load.folders &&
  1928. this.load.folders[ folder.name ] ) {
  1929. delete this.load.folders[ folder.name ];
  1930. }
  1931. removeListeners( folder );
  1932. var _this = this;
  1933. Common.each( folder.__folders, function ( subfolder ) {
  1934. folder.removeFolder( subfolder );
  1935. } );
  1936. Common.defer( function () {
  1937. _this.onResize();
  1938. } );
  1939. },
  1940. open: function open() {
  1941. this.closed = false;
  1942. },
  1943. close: function close() {
  1944. this.closed = true;
  1945. },
  1946. hide: function hide() {
  1947. this.domElement.style.display = 'none';
  1948. },
  1949. show: function show() {
  1950. this.domElement.style.display = '';
  1951. },
  1952. onResize: function onResize() {
  1953. var root = this.getRoot();
  1954. if ( root.scrollable ) {
  1955. var top = dom.getOffset( root.__ul ).top;
  1956. var h = 0;
  1957. Common.each( root.__ul.childNodes, function ( node ) {
  1958. if ( ! ( root.autoPlace && node === root.__save_row ) ) {
  1959. h += dom.getHeight( node );
  1960. }
  1961. } );
  1962. if ( window.innerHeight - top - CLOSE_BUTTON_HEIGHT < h ) {
  1963. dom.addClass( root.domElement, GUI.CLASS_TOO_TALL );
  1964. root.__ul.style.height = window.innerHeight - top - CLOSE_BUTTON_HEIGHT + 'px';
  1965. } else {
  1966. dom.removeClass( root.domElement, GUI.CLASS_TOO_TALL );
  1967. root.__ul.style.height = 'auto';
  1968. }
  1969. }
  1970. if ( root.__resize_handle ) {
  1971. Common.defer( function () {
  1972. root.__resize_handle.style.height = root.__ul.offsetHeight + 'px';
  1973. } );
  1974. }
  1975. if ( root.__closeButton ) {
  1976. root.__closeButton.style.width = root.width + 'px';
  1977. }
  1978. },
  1979. onResizeDebounced: Common.debounce( function () {
  1980. this.onResize();
  1981. }, 50 ),
  1982. remember: function remember() {
  1983. if ( Common.isUndefined( SAVE_DIALOGUE ) ) {
  1984. SAVE_DIALOGUE = new CenteredDiv();
  1985. SAVE_DIALOGUE.domElement.innerHTML = saveDialogContents;
  1986. }
  1987. if ( this.parent ) {
  1988. throw new Error( 'You can only call remember on a top level GUI.' );
  1989. }
  1990. var _this = this;
  1991. Common.each( Array.prototype.slice.call( arguments ), function ( object ) {
  1992. if ( _this.__rememberedObjects.length === 0 ) {
  1993. addSaveMenu( _this );
  1994. }
  1995. if ( _this.__rememberedObjects.indexOf( object ) === - 1 ) {
  1996. _this.__rememberedObjects.push( object );
  1997. }
  1998. } );
  1999. if ( this.autoPlace ) {
  2000. setWidth( this, this.width );
  2001. }
  2002. },
  2003. getRoot: function getRoot() {
  2004. var gui = this;
  2005. while ( gui.parent ) {
  2006. gui = gui.parent;
  2007. }
  2008. return gui;
  2009. },
  2010. getSaveObject: function getSaveObject() {
  2011. var toReturn = this.load;
  2012. toReturn.closed = this.closed;
  2013. if ( this.__rememberedObjects.length > 0 ) {
  2014. toReturn.preset = this.preset;
  2015. if ( ! toReturn.remembered ) {
  2016. toReturn.remembered = {};
  2017. }
  2018. toReturn.remembered[ this.preset ] = getCurrentPreset( this );
  2019. }
  2020. toReturn.folders = {};
  2021. Common.each( this.__folders, function ( element, key ) {
  2022. toReturn.folders[ key ] = element.getSaveObject();
  2023. } );
  2024. return toReturn;
  2025. },
  2026. save: function save() {
  2027. if ( ! this.load.remembered ) {
  2028. this.load.remembered = {};
  2029. }
  2030. this.load.remembered[ this.preset ] = getCurrentPreset( this );
  2031. markPresetModified( this, false );
  2032. this.saveToLocalStorageIfPossible();
  2033. },
  2034. saveAs: function saveAs( presetName ) {
  2035. if ( ! this.load.remembered ) {
  2036. this.load.remembered = {};
  2037. this.load.remembered[ DEFAULT_DEFAULT_PRESET_NAME ] = getCurrentPreset( this, true );
  2038. }
  2039. this.load.remembered[ presetName ] = getCurrentPreset( this );
  2040. this.preset = presetName;
  2041. addPresetOption( this, presetName, true );
  2042. this.saveToLocalStorageIfPossible();
  2043. },
  2044. revert: function revert( gui ) {
  2045. Common.each( this.__controllers, function ( controller ) {
  2046. if ( ! this.getRoot().load.remembered ) {
  2047. controller.setValue( controller.initialValue );
  2048. } else {
  2049. recallSavedValue( gui || this.getRoot(), controller );
  2050. }
  2051. if ( controller.__onFinishChange ) {
  2052. controller.__onFinishChange.call( controller, controller.getValue() );
  2053. }
  2054. }, this );
  2055. Common.each( this.__folders, function ( folder ) {
  2056. folder.revert( folder );
  2057. } );
  2058. if ( ! gui ) {
  2059. markPresetModified( this.getRoot(), false );
  2060. }
  2061. },
  2062. listen: function listen( controller ) {
  2063. var init = this.__listening.length === 0;
  2064. this.__listening.push( controller );
  2065. if ( init ) {
  2066. updateDisplays( this.__listening );
  2067. }
  2068. },
  2069. updateDisplay: function updateDisplay() {
  2070. Common.each( this.__controllers, function ( controller ) {
  2071. controller.updateDisplay();
  2072. } );
  2073. Common.each( this.__folders, function ( folder ) {
  2074. folder.updateDisplay();
  2075. } );
  2076. }
  2077. } );
  2078. function addRow( gui, newDom, liBefore ) {
  2079. var li = document.createElement( 'li' );
  2080. if ( newDom ) {
  2081. li.appendChild( newDom );
  2082. }
  2083. if ( liBefore ) {
  2084. gui.__ul.insertBefore( li, liBefore );
  2085. } else {
  2086. gui.__ul.appendChild( li );
  2087. }
  2088. gui.onResize();
  2089. return li;
  2090. }
  2091. function removeListeners( gui ) {
  2092. dom.unbind( window, 'resize', gui.__resizeHandler );
  2093. if ( gui.saveToLocalStorageIfPossible ) {
  2094. dom.unbind( window, 'unload', gui.saveToLocalStorageIfPossible );
  2095. }
  2096. }
  2097. function markPresetModified( gui, modified ) {
  2098. var opt = gui.__preset_select[ gui.__preset_select.selectedIndex ];
  2099. if ( modified ) {
  2100. opt.innerHTML = opt.value + '*';
  2101. } else {
  2102. opt.innerHTML = opt.value;
  2103. }
  2104. }
  2105. function augmentController( gui, li, controller ) {
  2106. controller.__li = li;
  2107. controller.__gui = gui;
  2108. Common.extend( controller, {
  2109. options: function options( _options ) {
  2110. if ( arguments.length > 1 ) {
  2111. var nextSibling = controller.__li.nextElementSibling;
  2112. controller.remove();
  2113. return _add( gui, controller.object, controller.property, {
  2114. before: nextSibling,
  2115. factoryArgs: [ Common.toArray( arguments ) ]
  2116. } );
  2117. }
  2118. if ( Common.isArray( _options ) || Common.isObject( _options ) ) {
  2119. var _nextSibling = controller.__li.nextElementSibling;
  2120. controller.remove();
  2121. return _add( gui, controller.object, controller.property, {
  2122. before: _nextSibling,
  2123. factoryArgs: [ _options ]
  2124. } );
  2125. }
  2126. },
  2127. name: function name( _name ) {
  2128. controller.__li.firstElementChild.firstElementChild.innerHTML = _name;
  2129. return controller;
  2130. },
  2131. listen: function listen() {
  2132. controller.__gui.listen( controller );
  2133. return controller;
  2134. },
  2135. remove: function remove() {
  2136. controller.__gui.remove( controller );
  2137. return controller;
  2138. }
  2139. } );
  2140. if ( controller instanceof NumberControllerSlider ) {
  2141. var box = new NumberControllerBox( controller.object, controller.property, { min: controller.__min, max: controller.__max, step: controller.__step } );
  2142. Common.each( [ 'updateDisplay', 'onChange', 'onFinishChange', 'step', 'min', 'max' ], function ( method ) {
  2143. var pc = controller[ method ];
  2144. var pb = box[ method ];
  2145. controller[ method ] = box[ method ] = function () {
  2146. var args = Array.prototype.slice.call( arguments );
  2147. pb.apply( box, args );
  2148. return pc.apply( controller, args );
  2149. };
  2150. } );
  2151. dom.addClass( li, 'has-slider' );
  2152. controller.domElement.insertBefore( box.domElement, controller.domElement.firstElementChild );
  2153. } else if ( controller instanceof NumberControllerBox ) {
  2154. var r = function r( returned ) {
  2155. if ( Common.isNumber( controller.__min ) && Common.isNumber( controller.__max ) ) {
  2156. var oldName = controller.__li.firstElementChild.firstElementChild.innerHTML;
  2157. var wasListening = controller.__gui.__listening.indexOf( controller ) > - 1;
  2158. controller.remove();
  2159. var newController = _add( gui, controller.object, controller.property, {
  2160. before: controller.__li.nextElementSibling,
  2161. factoryArgs: [ controller.__min, controller.__max, controller.__step ]
  2162. } );
  2163. newController.name( oldName );
  2164. if ( wasListening ) newController.listen();
  2165. return newController;
  2166. }
  2167. return returned;
  2168. };
  2169. controller.min = Common.compose( r, controller.min );
  2170. controller.max = Common.compose( r, controller.max );
  2171. } else if ( controller instanceof BooleanController ) {
  2172. dom.bind( li, 'click', function () {
  2173. dom.fakeEvent( controller.__checkbox, 'click' );
  2174. } );
  2175. dom.bind( controller.__checkbox, 'click', function ( e ) {
  2176. e.stopPropagation();
  2177. } );
  2178. } else if ( controller instanceof FunctionController ) {
  2179. dom.bind( li, 'click', function () {
  2180. dom.fakeEvent( controller.__button, 'click' );
  2181. } );
  2182. dom.bind( li, 'mouseover', function () {
  2183. dom.addClass( controller.__button, 'hover' );
  2184. } );
  2185. dom.bind( li, 'mouseout', function () {
  2186. dom.removeClass( controller.__button, 'hover' );
  2187. } );
  2188. } else if ( controller instanceof ColorController ) {
  2189. dom.addClass( li, 'color' );
  2190. controller.updateDisplay = Common.compose( function ( val ) {
  2191. li.style.borderLeftColor = controller.__color.toString();
  2192. return val;
  2193. }, controller.updateDisplay );
  2194. controller.updateDisplay();
  2195. }
  2196. controller.setValue = Common.compose( function ( val ) {
  2197. if ( gui.getRoot().__preset_select && controller.isModified() ) {
  2198. markPresetModified( gui.getRoot(), true );
  2199. }
  2200. return val;
  2201. }, controller.setValue );
  2202. }
  2203. function recallSavedValue( gui, controller ) {
  2204. var root = gui.getRoot();
  2205. var matchedIndex = root.__rememberedObjects.indexOf( controller.object );
  2206. if ( matchedIndex !== - 1 ) {
  2207. var controllerMap = root.__rememberedObjectIndecesToControllers[ matchedIndex ];
  2208. if ( controllerMap === undefined ) {
  2209. controllerMap = {};
  2210. root.__rememberedObjectIndecesToControllers[ matchedIndex ] = controllerMap;
  2211. }
  2212. controllerMap[ controller.property ] = controller;
  2213. if ( root.load && root.load.remembered ) {
  2214. var presetMap = root.load.remembered;
  2215. var preset = void 0;
  2216. if ( presetMap[ gui.preset ] ) {
  2217. preset = presetMap[ gui.preset ];
  2218. } else if ( presetMap[ DEFAULT_DEFAULT_PRESET_NAME ] ) {
  2219. preset = presetMap[ DEFAULT_DEFAULT_PRESET_NAME ];
  2220. } else {
  2221. return;
  2222. }
  2223. if ( preset[ matchedIndex ] && preset[ matchedIndex ][ controller.property ] !== undefined ) {
  2224. var value = preset[ matchedIndex ][ controller.property ];
  2225. controller.initialValue = value;
  2226. controller.setValue( value );
  2227. }
  2228. }
  2229. }
  2230. }
  2231. function _add( gui, object, property, params ) {
  2232. if ( object[ property ] === undefined ) {
  2233. throw new Error( 'Object "' + object + '" has no property "' + property + '"' );
  2234. }
  2235. var controller = void 0;
  2236. if ( params.color ) {
  2237. controller = new ColorController( object, property );
  2238. } else {
  2239. var factoryArgs = [ object, property ].concat( params.factoryArgs );
  2240. controller = ControllerFactory.apply( gui, factoryArgs );
  2241. }
  2242. if ( params.before instanceof Controller ) {
  2243. params.before = params.before.__li;
  2244. }
  2245. recallSavedValue( gui, controller );
  2246. dom.addClass( controller.domElement, 'c' );
  2247. var name = document.createElement( 'span' );
  2248. dom.addClass( name, 'property-name' );
  2249. name.innerHTML = controller.property;
  2250. var container = document.createElement( 'div' );
  2251. container.appendChild( name );
  2252. container.appendChild( controller.domElement );
  2253. var li = addRow( gui, container, params.before );
  2254. dom.addClass( li, GUI.CLASS_CONTROLLER_ROW );
  2255. if ( controller instanceof ColorController ) {
  2256. dom.addClass( li, 'color' );
  2257. } else {
  2258. dom.addClass( li, _typeof( controller.getValue() ) );
  2259. }
  2260. augmentController( gui, li, controller );
  2261. gui.__controllers.push( controller );
  2262. return controller;
  2263. }
  2264. function getLocalStorageHash( gui, key ) {
  2265. return document.location.href + '.' + key;
  2266. }
  2267. function addPresetOption( gui, name, setSelected ) {
  2268. var opt = document.createElement( 'option' );
  2269. opt.innerHTML = name;
  2270. opt.value = name;
  2271. gui.__preset_select.appendChild( opt );
  2272. if ( setSelected ) {
  2273. gui.__preset_select.selectedIndex = gui.__preset_select.length - 1;
  2274. }
  2275. }
  2276. function showHideExplain( gui, explain ) {
  2277. explain.style.display = gui.useLocalStorage ? 'block' : 'none';
  2278. }
  2279. function addSaveMenu( gui ) {
  2280. var div = gui.__save_row = document.createElement( 'li' );
  2281. dom.addClass( gui.domElement, 'has-save' );
  2282. gui.__ul.insertBefore( div, gui.__ul.firstChild );
  2283. dom.addClass( div, 'save-row' );
  2284. var gears = document.createElement( 'span' );
  2285. gears.innerHTML = '&nbsp;';
  2286. dom.addClass( gears, 'button gears' );
  2287. var button = document.createElement( 'span' );
  2288. button.innerHTML = 'Save';
  2289. dom.addClass( button, 'button' );
  2290. dom.addClass( button, 'save' );
  2291. var button2 = document.createElement( 'span' );
  2292. button2.innerHTML = 'New';
  2293. dom.addClass( button2, 'button' );
  2294. dom.addClass( button2, 'save-as' );
  2295. var button3 = document.createElement( 'span' );
  2296. button3.innerHTML = 'Revert';
  2297. dom.addClass( button3, 'button' );
  2298. dom.addClass( button3, 'revert' );
  2299. var select = gui.__preset_select = document.createElement( 'select' );
  2300. if ( gui.load && gui.load.remembered ) {
  2301. Common.each( gui.load.remembered, function ( value, key ) {
  2302. addPresetOption( gui, key, key === gui.preset );
  2303. } );
  2304. } else {
  2305. addPresetOption( gui, DEFAULT_DEFAULT_PRESET_NAME, false );
  2306. }
  2307. dom.bind( select, 'change', function () {
  2308. for ( var index = 0; index < gui.__preset_select.length; index ++ ) {
  2309. gui.__preset_select[ index ].innerHTML = gui.__preset_select[ index ].value;
  2310. }
  2311. gui.preset = this.value;
  2312. } );
  2313. div.appendChild( select );
  2314. div.appendChild( gears );
  2315. div.appendChild( button );
  2316. div.appendChild( button2 );
  2317. div.appendChild( button3 );
  2318. if ( SUPPORTS_LOCAL_STORAGE ) {
  2319. var explain = document.getElementById( 'dg-local-explain' );
  2320. var localStorageCheckBox = document.getElementById( 'dg-local-storage' );
  2321. var saveLocally = document.getElementById( 'dg-save-locally' );
  2322. saveLocally.style.display = 'block';
  2323. if ( localStorage.getItem( getLocalStorageHash( gui, 'isLocal' ) ) === 'true' ) {
  2324. localStorageCheckBox.setAttribute( 'checked', 'checked' );
  2325. }
  2326. showHideExplain( gui, explain );
  2327. dom.bind( localStorageCheckBox, 'change', function () {
  2328. gui.useLocalStorage = ! gui.useLocalStorage;
  2329. showHideExplain( gui, explain );
  2330. } );
  2331. }
  2332. var newConstructorTextArea = document.getElementById( 'dg-new-constructor' );
  2333. dom.bind( newConstructorTextArea, 'keydown', function ( e ) {
  2334. if ( e.metaKey && ( e.which === 67 || e.keyCode === 67 ) ) {
  2335. SAVE_DIALOGUE.hide();
  2336. }
  2337. } );
  2338. dom.bind( gears, 'click', function () {
  2339. newConstructorTextArea.innerHTML = JSON.stringify( gui.getSaveObject(), undefined, 2 );
  2340. SAVE_DIALOGUE.show();
  2341. newConstructorTextArea.focus();
  2342. newConstructorTextArea.select();
  2343. } );
  2344. dom.bind( button, 'click', function () {
  2345. gui.save();
  2346. } );
  2347. dom.bind( button2, 'click', function () {
  2348. var presetName = prompt( 'Enter a new preset name.' );
  2349. if ( presetName ) {
  2350. gui.saveAs( presetName );
  2351. }
  2352. } );
  2353. dom.bind( button3, 'click', function () {
  2354. gui.revert();
  2355. } );
  2356. }
  2357. function addResizeHandle( gui ) {
  2358. var pmouseX = void 0;
  2359. gui.__resize_handle = document.createElement( 'div' );
  2360. Common.extend( gui.__resize_handle.style, {
  2361. width: '6px',
  2362. marginLeft: '-3px',
  2363. height: '200px',
  2364. cursor: 'ew-resize',
  2365. position: 'absolute'
  2366. } );
  2367. function drag( e ) {
  2368. e.preventDefault();
  2369. gui.width += pmouseX - e.clientX;
  2370. gui.onResize();
  2371. pmouseX = e.clientX;
  2372. return false;
  2373. }
  2374. function dragStop() {
  2375. dom.removeClass( gui.__closeButton, GUI.CLASS_DRAG );
  2376. dom.unbind( window, 'mousemove', drag );
  2377. dom.unbind( window, 'mouseup', dragStop );
  2378. }
  2379. function dragStart( e ) {
  2380. e.preventDefault();
  2381. pmouseX = e.clientX;
  2382. dom.addClass( gui.__closeButton, GUI.CLASS_DRAG );
  2383. dom.bind( window, 'mousemove', drag );
  2384. dom.bind( window, 'mouseup', dragStop );
  2385. return false;
  2386. }
  2387. dom.bind( gui.__resize_handle, 'mousedown', dragStart );
  2388. dom.bind( gui.__closeButton, 'mousedown', dragStart );
  2389. gui.domElement.insertBefore( gui.__resize_handle, gui.domElement.firstElementChild );
  2390. }
  2391. function setWidth( gui, w ) {
  2392. gui.domElement.style.width = w + 'px';
  2393. if ( gui.__save_row && gui.autoPlace ) {
  2394. gui.__save_row.style.width = w + 'px';
  2395. }
  2396. if ( gui.__closeButton ) {
  2397. gui.__closeButton.style.width = w + 'px';
  2398. }
  2399. }
  2400. function getCurrentPreset( gui, useInitialValues ) {
  2401. var toReturn = {};
  2402. Common.each( gui.__rememberedObjects, function ( val, index ) {
  2403. var savedValues = {};
  2404. var controllerMap = gui.__rememberedObjectIndecesToControllers[ index ];
  2405. Common.each( controllerMap, function ( controller, property ) {
  2406. savedValues[ property ] = useInitialValues ? controller.initialValue : controller.getValue();
  2407. } );
  2408. toReturn[ index ] = savedValues;
  2409. } );
  2410. return toReturn;
  2411. }
  2412. function setPresetSelectIndex( gui ) {
  2413. for ( var index = 0; index < gui.__preset_select.length; index ++ ) {
  2414. if ( gui.__preset_select[ index ].value === gui.preset ) {
  2415. gui.__preset_select.selectedIndex = index;
  2416. }
  2417. }
  2418. }
  2419. function updateDisplays( controllerArray ) {
  2420. if ( controllerArray.length !== 0 ) {
  2421. requestAnimationFrame$1.call( window, function () {
  2422. updateDisplays( controllerArray );
  2423. } );
  2424. }
  2425. Common.each( controllerArray, function ( c ) {
  2426. c.updateDisplay();
  2427. } );
  2428. }
  2429. var color = {
  2430. Color: Color,
  2431. math: ColorMath,
  2432. interpret: interpret
  2433. };
  2434. var controllers = {
  2435. Controller: Controller,
  2436. BooleanController: BooleanController,
  2437. OptionController: OptionController,
  2438. StringController: StringController,
  2439. NumberController: NumberController,
  2440. NumberControllerBox: NumberControllerBox,
  2441. NumberControllerSlider: NumberControllerSlider,
  2442. FunctionController: FunctionController,
  2443. ColorController: ColorController
  2444. };
  2445. var dom$1 = { dom: dom };
  2446. var gui = { GUI: GUI };
  2447. var GUI$1 = GUI;
  2448. var index = {
  2449. color: color,
  2450. controllers: controllers,
  2451. dom: dom$1,
  2452. gui: gui,
  2453. GUI: GUI$1
  2454. };
  2455. export { color, controllers, dom$1 as dom, gui, GUI$1 as GUI };
  2456. export default index;