dat.gui.module.js 83 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328332933303331333233333334333533363337333833393340334133423343334433453346334733483349335033513352335333543355335633573358335933603361336233633364336533663367336833693370337133723373337433753376337733783379338033813382338333843385338633873388338933903391339233933394339533963397339833993400340134023403340434053406340734083409341034113412341334143415341634173418341934203421342234233424342534263427342834293430343134323433343434353436343734383439344034413442344334443445344634473448344934503451345234533454345534563457345834593460346134623463346434653466346734683469347034713472347334743475347634773478347934803481348234833484348534863487348834893490349134923493349434953496349734983499350035013502350335043505350635073508350935103511351235133514351535163517351835193520352135223523352435253526352735283529353035313532353335343535353635373538353935403541354235433544354535463547354835493550355135523553355435553556355735583559356035613562356335643565356635673568356935703571357235733574
  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 Object.prototype.toString.call( obj ) === '[object 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. }
  636. return this.__state.hex;
  637. },
  638. set: function set$$1( v ) {
  639. this.__state.space = 'HEX';
  640. this.__state.hex = v;
  641. }
  642. } );
  643. var Controller = function () {
  644. function Controller( object, property ) {
  645. classCallCheck( this, Controller );
  646. this.initialValue = object[ property ];
  647. this.domElement = document.createElement( 'div' );
  648. this.object = object;
  649. this.property = property;
  650. this.__onChange = undefined;
  651. this.__onFinishChange = undefined;
  652. }
  653. createClass( Controller, [ {
  654. key: 'onChange',
  655. value: function onChange( fnc ) {
  656. this.__onChange = fnc;
  657. return this;
  658. }
  659. }, {
  660. key: 'onFinishChange',
  661. value: function onFinishChange( fnc ) {
  662. this.__onFinishChange = fnc;
  663. return this;
  664. }
  665. }, {
  666. key: 'setValue',
  667. value: function setValue( newValue ) {
  668. this.object[ this.property ] = newValue;
  669. if ( this.__onChange ) {
  670. this.__onChange.call( this, newValue );
  671. }
  672. this.updateDisplay();
  673. return this;
  674. }
  675. }, {
  676. key: 'getValue',
  677. value: function getValue() {
  678. return this.object[ this.property ];
  679. }
  680. }, {
  681. key: 'updateDisplay',
  682. value: function updateDisplay() {
  683. return this;
  684. }
  685. }, {
  686. key: 'isModified',
  687. value: function isModified() {
  688. return this.initialValue !== this.getValue();
  689. }
  690. } ] );
  691. return Controller;
  692. }();
  693. var EVENT_MAP = {
  694. HTMLEvents: [ 'change' ],
  695. MouseEvents: [ 'click', 'mousemove', 'mousedown', 'mouseup', 'mouseover' ],
  696. KeyboardEvents: [ 'keydown' ]
  697. };
  698. var EVENT_MAP_INV = {};
  699. Common.each( EVENT_MAP, function ( v, k ) {
  700. Common.each( v, function ( e ) {
  701. EVENT_MAP_INV[ e ] = k;
  702. } );
  703. } );
  704. var CSS_VALUE_PIXELS = /(\d+(\.\d+)?)px/;
  705. function cssValueToPixels( val ) {
  706. if ( val === '0' || Common.isUndefined( val ) ) {
  707. return 0;
  708. }
  709. var match = val.match( CSS_VALUE_PIXELS );
  710. if ( ! Common.isNull( match ) ) {
  711. return parseFloat( match[ 1 ] );
  712. }
  713. return 0;
  714. }
  715. var dom = {
  716. makeSelectable: function makeSelectable( elem, selectable ) {
  717. if ( elem === undefined || elem.style === undefined ) return;
  718. elem.onselectstart = selectable ? function () {
  719. return false;
  720. } : function () {};
  721. elem.style.MozUserSelect = selectable ? 'auto' : 'none';
  722. elem.style.KhtmlUserSelect = selectable ? 'auto' : 'none';
  723. elem.unselectable = selectable ? 'on' : 'off';
  724. },
  725. makeFullscreen: function makeFullscreen( elem, hor, vert ) {
  726. var vertical = vert;
  727. var horizontal = hor;
  728. if ( Common.isUndefined( horizontal ) ) {
  729. horizontal = true;
  730. }
  731. if ( Common.isUndefined( vertical ) ) {
  732. vertical = true;
  733. }
  734. elem.style.position = 'absolute';
  735. if ( horizontal ) {
  736. elem.style.left = 0;
  737. elem.style.right = 0;
  738. }
  739. if ( vertical ) {
  740. elem.style.top = 0;
  741. elem.style.bottom = 0;
  742. }
  743. },
  744. fakeEvent: function fakeEvent( elem, eventType, pars, aux ) {
  745. var params = pars || {};
  746. var className = EVENT_MAP_INV[ eventType ];
  747. if ( ! className ) {
  748. throw new Error( 'Event type ' + eventType + ' not supported.' );
  749. }
  750. var evt = document.createEvent( className );
  751. switch ( className ) {
  752. case 'MouseEvents':
  753. {
  754. var clientX = params.x || params.clientX || 0;
  755. var clientY = params.y || params.clientY || 0;
  756. evt.initMouseEvent( eventType, params.bubbles || false, params.cancelable || true, window, params.clickCount || 1, 0,
  757. 0,
  758. clientX,
  759. clientY,
  760. false, false, false, false, 0, null );
  761. break;
  762. }
  763. case 'KeyboardEvents':
  764. {
  765. var init = evt.initKeyboardEvent || evt.initKeyEvent;
  766. Common.defaults( params, {
  767. cancelable: true,
  768. ctrlKey: false,
  769. altKey: false,
  770. shiftKey: false,
  771. metaKey: false,
  772. keyCode: undefined,
  773. charCode: undefined
  774. } );
  775. init( eventType, params.bubbles || false, params.cancelable, window, params.ctrlKey, params.altKey, params.shiftKey, params.metaKey, params.keyCode, params.charCode );
  776. break;
  777. }
  778. default:
  779. {
  780. evt.initEvent( eventType, params.bubbles || false, params.cancelable || true );
  781. break;
  782. }
  783. }
  784. Common.defaults( evt, aux );
  785. elem.dispatchEvent( evt );
  786. },
  787. bind: function bind( elem, event, func, newBool ) {
  788. var bool = newBool || false;
  789. if ( elem.addEventListener ) {
  790. elem.addEventListener( event, func, bool );
  791. } else if ( elem.attachEvent ) {
  792. elem.attachEvent( 'on' + event, func );
  793. }
  794. return dom;
  795. },
  796. unbind: function unbind( elem, event, func, newBool ) {
  797. var bool = newBool || false;
  798. if ( elem.removeEventListener ) {
  799. elem.removeEventListener( event, func, bool );
  800. } else if ( elem.detachEvent ) {
  801. elem.detachEvent( 'on' + event, func );
  802. }
  803. return dom;
  804. },
  805. addClass: function addClass( elem, className ) {
  806. if ( elem.className === undefined ) {
  807. elem.className = className;
  808. } else if ( elem.className !== className ) {
  809. var classes = elem.className.split( / +/ );
  810. if ( classes.indexOf( className ) === - 1 ) {
  811. classes.push( className );
  812. elem.className = classes.join( ' ' ).replace( /^\s+/, '' ).replace( /\s+$/, '' );
  813. }
  814. }
  815. return dom;
  816. },
  817. removeClass: function removeClass( elem, className ) {
  818. if ( className ) {
  819. if ( elem.className === className ) {
  820. elem.removeAttribute( 'class' );
  821. } else {
  822. var classes = elem.className.split( / +/ );
  823. var index = classes.indexOf( className );
  824. if ( index !== - 1 ) {
  825. classes.splice( index, 1 );
  826. elem.className = classes.join( ' ' );
  827. }
  828. }
  829. } else {
  830. elem.className = undefined;
  831. }
  832. return dom;
  833. },
  834. hasClass: function hasClass( elem, className ) {
  835. return new RegExp( '(?:^|\\s+)' + className + '(?:\\s+|$)' ).test( elem.className ) || false;
  836. },
  837. getWidth: function getWidth( elem ) {
  838. var style = getComputedStyle( elem );
  839. return cssValueToPixels( style[ 'border-left-width' ] ) + cssValueToPixels( style[ 'border-right-width' ] ) + cssValueToPixels( style[ 'padding-left' ] ) + cssValueToPixels( style[ 'padding-right' ] ) + cssValueToPixels( style.width );
  840. },
  841. getHeight: function getHeight( elem ) {
  842. var style = getComputedStyle( elem );
  843. return cssValueToPixels( style[ 'border-top-width' ] ) + cssValueToPixels( style[ 'border-bottom-width' ] ) + cssValueToPixels( style[ 'padding-top' ] ) + cssValueToPixels( style[ 'padding-bottom' ] ) + cssValueToPixels( style.height );
  844. },
  845. getOffset: function getOffset( el ) {
  846. var elem = el;
  847. var offset = { left: 0, top: 0 };
  848. if ( elem.offsetParent ) {
  849. do {
  850. offset.left += elem.offsetLeft;
  851. offset.top += elem.offsetTop;
  852. elem = elem.offsetParent;
  853. } while ( elem );
  854. }
  855. return offset;
  856. },
  857. isActive: function isActive( elem ) {
  858. return elem === document.activeElement && ( elem.type || elem.href );
  859. }
  860. };
  861. var BooleanController = function ( _Controller ) {
  862. inherits( BooleanController, _Controller );
  863. function BooleanController( object, property ) {
  864. classCallCheck( this, BooleanController );
  865. var _this2 = possibleConstructorReturn( this, ( BooleanController.__proto__ || Object.getPrototypeOf( BooleanController ) ).call( this, object, property ) );
  866. var _this = _this2;
  867. _this2.__prev = _this2.getValue();
  868. _this2.__checkbox = document.createElement( 'input' );
  869. _this2.__checkbox.setAttribute( 'type', 'checkbox' );
  870. function onChange() {
  871. _this.setValue( ! _this.__prev );
  872. }
  873. dom.bind( _this2.__checkbox, 'change', onChange, false );
  874. _this2.domElement.appendChild( _this2.__checkbox );
  875. _this2.updateDisplay();
  876. return _this2;
  877. }
  878. createClass( BooleanController, [ {
  879. key: 'setValue',
  880. value: function setValue( v ) {
  881. var toReturn = get( BooleanController.prototype.__proto__ || Object.getPrototypeOf( BooleanController.prototype ), 'setValue', this ).call( this, v );
  882. if ( this.__onFinishChange ) {
  883. this.__onFinishChange.call( this, this.getValue() );
  884. }
  885. this.__prev = this.getValue();
  886. return toReturn;
  887. }
  888. }, {
  889. key: 'updateDisplay',
  890. value: function updateDisplay() {
  891. if ( this.getValue() === true ) {
  892. this.__checkbox.setAttribute( 'checked', 'checked' );
  893. this.__checkbox.checked = true;
  894. this.__prev = true;
  895. } else {
  896. this.__checkbox.checked = false;
  897. this.__prev = false;
  898. }
  899. return get( BooleanController.prototype.__proto__ || Object.getPrototypeOf( BooleanController.prototype ), 'updateDisplay', this ).call( this );
  900. }
  901. } ] );
  902. return BooleanController;
  903. }( Controller );
  904. var OptionController = function ( _Controller ) {
  905. inherits( OptionController, _Controller );
  906. function OptionController( object, property, opts ) {
  907. classCallCheck( this, OptionController );
  908. var _this2 = possibleConstructorReturn( this, ( OptionController.__proto__ || Object.getPrototypeOf( OptionController ) ).call( this, object, property ) );
  909. var options = opts;
  910. var _this = _this2;
  911. _this2.__select = document.createElement( 'select' );
  912. if ( Common.isArray( options ) ) {
  913. var map = {};
  914. Common.each( options, function ( element ) {
  915. map[ element ] = element;
  916. } );
  917. options = map;
  918. }
  919. Common.each( options, function ( value, key ) {
  920. var opt = document.createElement( 'option' );
  921. opt.innerHTML = key;
  922. opt.setAttribute( 'value', value );
  923. _this.__select.appendChild( opt );
  924. } );
  925. _this2.updateDisplay();
  926. dom.bind( _this2.__select, 'change', function () {
  927. var desiredValue = this.options[ this.selectedIndex ].value;
  928. _this.setValue( desiredValue );
  929. } );
  930. _this2.domElement.appendChild( _this2.__select );
  931. return _this2;
  932. }
  933. createClass( OptionController, [ {
  934. key: 'setValue',
  935. value: function setValue( v ) {
  936. var toReturn = get( OptionController.prototype.__proto__ || Object.getPrototypeOf( OptionController.prototype ), 'setValue', this ).call( this, v );
  937. if ( this.__onFinishChange ) {
  938. this.__onFinishChange.call( this, this.getValue() );
  939. }
  940. return toReturn;
  941. }
  942. }, {
  943. key: 'updateDisplay',
  944. value: function updateDisplay() {
  945. if ( dom.isActive( this.__select ) ) return this;
  946. this.__select.value = this.getValue();
  947. return get( OptionController.prototype.__proto__ || Object.getPrototypeOf( OptionController.prototype ), 'updateDisplay', this ).call( this );
  948. }
  949. } ] );
  950. return OptionController;
  951. }( Controller );
  952. var StringController = function ( _Controller ) {
  953. inherits( StringController, _Controller );
  954. function StringController( object, property ) {
  955. classCallCheck( this, StringController );
  956. var _this2 = possibleConstructorReturn( this, ( StringController.__proto__ || Object.getPrototypeOf( StringController ) ).call( this, object, property ) );
  957. var _this = _this2;
  958. function onChange() {
  959. _this.setValue( _this.__input.value );
  960. }
  961. function onBlur() {
  962. if ( _this.__onFinishChange ) {
  963. _this.__onFinishChange.call( _this, _this.getValue() );
  964. }
  965. }
  966. _this2.__input = document.createElement( 'input' );
  967. _this2.__input.setAttribute( 'type', 'text' );
  968. dom.bind( _this2.__input, 'keyup', onChange );
  969. dom.bind( _this2.__input, 'change', onChange );
  970. dom.bind( _this2.__input, 'blur', onBlur );
  971. dom.bind( _this2.__input, 'keydown', function ( e ) {
  972. if ( e.keyCode === 13 ) {
  973. this.blur();
  974. }
  975. } );
  976. _this2.updateDisplay();
  977. _this2.domElement.appendChild( _this2.__input );
  978. return _this2;
  979. }
  980. createClass( StringController, [ {
  981. key: 'updateDisplay',
  982. value: function updateDisplay() {
  983. if ( ! dom.isActive( this.__input ) ) {
  984. this.__input.value = this.getValue();
  985. }
  986. return get( StringController.prototype.__proto__ || Object.getPrototypeOf( StringController.prototype ), 'updateDisplay', this ).call( this );
  987. }
  988. } ] );
  989. return StringController;
  990. }( Controller );
  991. function numDecimals( x ) {
  992. var _x = x.toString();
  993. if ( _x.indexOf( '.' ) > - 1 ) {
  994. return _x.length - _x.indexOf( '.' ) - 1;
  995. }
  996. return 0;
  997. }
  998. var NumberController = function ( _Controller ) {
  999. inherits( NumberController, _Controller );
  1000. function NumberController( object, property, params ) {
  1001. classCallCheck( this, NumberController );
  1002. var _this = possibleConstructorReturn( this, ( NumberController.__proto__ || Object.getPrototypeOf( NumberController ) ).call( this, object, property ) );
  1003. var _params = params || {};
  1004. _this.__min = _params.min;
  1005. _this.__max = _params.max;
  1006. _this.__step = _params.step;
  1007. if ( Common.isUndefined( _this.__step ) ) {
  1008. if ( _this.initialValue === 0 ) {
  1009. _this.__impliedStep = 1;
  1010. } else {
  1011. _this.__impliedStep = Math.pow( 10, Math.floor( Math.log( Math.abs( _this.initialValue ) ) / Math.LN10 ) ) / 10;
  1012. }
  1013. } else {
  1014. _this.__impliedStep = _this.__step;
  1015. }
  1016. _this.__precision = numDecimals( _this.__impliedStep );
  1017. return _this;
  1018. }
  1019. createClass( NumberController, [ {
  1020. key: 'setValue',
  1021. value: function setValue( v ) {
  1022. var _v = v;
  1023. if ( this.__min !== undefined && _v < this.__min ) {
  1024. _v = this.__min;
  1025. } else if ( this.__max !== undefined && _v > this.__max ) {
  1026. _v = this.__max;
  1027. }
  1028. if ( this.__step !== undefined && _v % this.__step !== 0 ) {
  1029. _v = Math.round( _v / this.__step ) * this.__step;
  1030. }
  1031. return get( NumberController.prototype.__proto__ || Object.getPrototypeOf( NumberController.prototype ), 'setValue', this ).call( this, _v );
  1032. }
  1033. }, {
  1034. key: 'min',
  1035. value: function min( minValue ) {
  1036. this.__min = minValue;
  1037. return this;
  1038. }
  1039. }, {
  1040. key: 'max',
  1041. value: function max( maxValue ) {
  1042. this.__max = maxValue;
  1043. return this;
  1044. }
  1045. }, {
  1046. key: 'step',
  1047. value: function step( stepValue ) {
  1048. this.__step = stepValue;
  1049. this.__impliedStep = stepValue;
  1050. this.__precision = numDecimals( stepValue );
  1051. return this;
  1052. }
  1053. } ] );
  1054. return NumberController;
  1055. }( Controller );
  1056. function roundToDecimal( value, decimals ) {
  1057. var tenTo = Math.pow( 10, decimals );
  1058. return Math.round( value * tenTo ) / tenTo;
  1059. }
  1060. var NumberControllerBox = function ( _NumberController ) {
  1061. inherits( NumberControllerBox, _NumberController );
  1062. function NumberControllerBox( object, property, params ) {
  1063. classCallCheck( this, NumberControllerBox );
  1064. var _this2 = possibleConstructorReturn( this, ( NumberControllerBox.__proto__ || Object.getPrototypeOf( NumberControllerBox ) ).call( this, object, property, params ) );
  1065. _this2.__truncationSuspended = false;
  1066. var _this = _this2;
  1067. var prevY = void 0;
  1068. function onChange() {
  1069. var attempted = parseFloat( _this.__input.value );
  1070. if ( ! Common.isNaN( attempted ) ) {
  1071. _this.setValue( attempted );
  1072. }
  1073. }
  1074. function onFinish() {
  1075. if ( _this.__onFinishChange ) {
  1076. _this.__onFinishChange.call( _this, _this.getValue() );
  1077. }
  1078. }
  1079. function onBlur() {
  1080. onFinish();
  1081. }
  1082. function onMouseDrag( e ) {
  1083. var diff = prevY - e.clientY;
  1084. _this.setValue( _this.getValue() + diff * _this.__impliedStep );
  1085. prevY = e.clientY;
  1086. }
  1087. function onMouseUp() {
  1088. dom.unbind( window, 'mousemove', onMouseDrag );
  1089. dom.unbind( window, 'mouseup', onMouseUp );
  1090. onFinish();
  1091. }
  1092. function onMouseDown( e ) {
  1093. dom.bind( window, 'mousemove', onMouseDrag );
  1094. dom.bind( window, 'mouseup', onMouseUp );
  1095. prevY = e.clientY;
  1096. }
  1097. _this2.__input = document.createElement( 'input' );
  1098. _this2.__input.setAttribute( 'type', 'text' );
  1099. dom.bind( _this2.__input, 'change', onChange );
  1100. dom.bind( _this2.__input, 'blur', onBlur );
  1101. dom.bind( _this2.__input, 'mousedown', onMouseDown );
  1102. dom.bind( _this2.__input, 'keydown', function ( e ) {
  1103. if ( e.keyCode === 13 ) {
  1104. _this.__truncationSuspended = true;
  1105. this.blur();
  1106. _this.__truncationSuspended = false;
  1107. onFinish();
  1108. }
  1109. } );
  1110. _this2.updateDisplay();
  1111. _this2.domElement.appendChild( _this2.__input );
  1112. return _this2;
  1113. }
  1114. createClass( NumberControllerBox, [ {
  1115. key: 'updateDisplay',
  1116. value: function updateDisplay() {
  1117. this.__input.value = this.__truncationSuspended ? this.getValue() : roundToDecimal( this.getValue(), this.__precision );
  1118. return get( NumberControllerBox.prototype.__proto__ || Object.getPrototypeOf( NumberControllerBox.prototype ), 'updateDisplay', this ).call( this );
  1119. }
  1120. } ] );
  1121. return NumberControllerBox;
  1122. }( NumberController );
  1123. function map( v, i1, i2, o1, o2 ) {
  1124. return o1 + ( o2 - o1 ) * ( ( v - i1 ) / ( i2 - i1 ) );
  1125. }
  1126. var NumberControllerSlider = function ( _NumberController ) {
  1127. inherits( NumberControllerSlider, _NumberController );
  1128. function NumberControllerSlider( object, property, min, max, step ) {
  1129. classCallCheck( this, NumberControllerSlider );
  1130. var _this2 = possibleConstructorReturn( this, ( NumberControllerSlider.__proto__ || Object.getPrototypeOf( NumberControllerSlider ) ).call( this, object, property, { min: min, max: max, step: step } ) );
  1131. var _this = _this2;
  1132. _this2.__background = document.createElement( 'div' );
  1133. _this2.__foreground = document.createElement( 'div' );
  1134. dom.bind( _this2.__background, 'mousedown', onMouseDown );
  1135. dom.bind( _this2.__background, 'touchstart', onTouchStart );
  1136. dom.addClass( _this2.__background, 'slider' );
  1137. dom.addClass( _this2.__foreground, 'slider-fg' );
  1138. function onMouseDown( e ) {
  1139. document.activeElement.blur();
  1140. dom.bind( window, 'mousemove', onMouseDrag );
  1141. dom.bind( window, 'mouseup', onMouseUp );
  1142. onMouseDrag( e );
  1143. }
  1144. function onMouseDrag( e ) {
  1145. e.preventDefault();
  1146. var bgRect = _this.__background.getBoundingClientRect();
  1147. _this.setValue( map( e.clientX, bgRect.left, bgRect.right, _this.__min, _this.__max ) );
  1148. return false;
  1149. }
  1150. function onMouseUp() {
  1151. dom.unbind( window, 'mousemove', onMouseDrag );
  1152. dom.unbind( window, 'mouseup', onMouseUp );
  1153. if ( _this.__onFinishChange ) {
  1154. _this.__onFinishChange.call( _this, _this.getValue() );
  1155. }
  1156. }
  1157. function onTouchStart( e ) {
  1158. if ( e.touches.length !== 1 ) {
  1159. return;
  1160. }
  1161. dom.bind( window, 'touchmove', onTouchMove );
  1162. dom.bind( window, 'touchend', onTouchEnd );
  1163. onTouchMove( e );
  1164. }
  1165. function onTouchMove( e ) {
  1166. var clientX = e.touches[ 0 ].clientX;
  1167. var bgRect = _this.__background.getBoundingClientRect();
  1168. _this.setValue( map( clientX, bgRect.left, bgRect.right, _this.__min, _this.__max ) );
  1169. }
  1170. function onTouchEnd() {
  1171. dom.unbind( window, 'touchmove', onTouchMove );
  1172. dom.unbind( window, 'touchend', onTouchEnd );
  1173. if ( _this.__onFinishChange ) {
  1174. _this.__onFinishChange.call( _this, _this.getValue() );
  1175. }
  1176. }
  1177. _this2.updateDisplay();
  1178. _this2.__background.appendChild( _this2.__foreground );
  1179. _this2.domElement.appendChild( _this2.__background );
  1180. return _this2;
  1181. }
  1182. createClass( NumberControllerSlider, [ {
  1183. key: 'updateDisplay',
  1184. value: function updateDisplay() {
  1185. var pct = ( this.getValue() - this.__min ) / ( this.__max - this.__min );
  1186. this.__foreground.style.width = pct * 100 + '%';
  1187. return get( NumberControllerSlider.prototype.__proto__ || Object.getPrototypeOf( NumberControllerSlider.prototype ), 'updateDisplay', this ).call( this );
  1188. }
  1189. } ] );
  1190. return NumberControllerSlider;
  1191. }( NumberController );
  1192. var FunctionController = function ( _Controller ) {
  1193. inherits( FunctionController, _Controller );
  1194. function FunctionController( object, property, text ) {
  1195. classCallCheck( this, FunctionController );
  1196. var _this2 = possibleConstructorReturn( this, ( FunctionController.__proto__ || Object.getPrototypeOf( FunctionController ) ).call( this, object, property ) );
  1197. var _this = _this2;
  1198. _this2.__button = document.createElement( 'div' );
  1199. _this2.__button.innerHTML = text === undefined ? 'Fire' : text;
  1200. dom.bind( _this2.__button, 'click', function ( e ) {
  1201. e.preventDefault();
  1202. _this.fire();
  1203. return false;
  1204. } );
  1205. dom.addClass( _this2.__button, 'button' );
  1206. _this2.domElement.appendChild( _this2.__button );
  1207. return _this2;
  1208. }
  1209. createClass( FunctionController, [ {
  1210. key: 'fire',
  1211. value: function fire() {
  1212. if ( this.__onChange ) {
  1213. this.__onChange.call( this );
  1214. }
  1215. this.getValue().call( this.object );
  1216. if ( this.__onFinishChange ) {
  1217. this.__onFinishChange.call( this, this.getValue() );
  1218. }
  1219. }
  1220. } ] );
  1221. return FunctionController;
  1222. }( Controller );
  1223. var ColorController = function ( _Controller ) {
  1224. inherits( ColorController, _Controller );
  1225. function ColorController( object, property ) {
  1226. classCallCheck( this, ColorController );
  1227. var _this2 = possibleConstructorReturn( this, ( ColorController.__proto__ || Object.getPrototypeOf( ColorController ) ).call( this, object, property ) );
  1228. _this2.__color = new Color( _this2.getValue() );
  1229. _this2.__temp = new Color( 0 );
  1230. var _this = _this2;
  1231. _this2.domElement = document.createElement( 'div' );
  1232. dom.makeSelectable( _this2.domElement, false );
  1233. _this2.__selector = document.createElement( 'div' );
  1234. _this2.__selector.className = 'selector';
  1235. _this2.__saturation_field = document.createElement( 'div' );
  1236. _this2.__saturation_field.className = 'saturation-field';
  1237. _this2.__field_knob = document.createElement( 'div' );
  1238. _this2.__field_knob.className = 'field-knob';
  1239. _this2.__field_knob_border = '2px solid ';
  1240. _this2.__hue_knob = document.createElement( 'div' );
  1241. _this2.__hue_knob.className = 'hue-knob';
  1242. _this2.__hue_field = document.createElement( 'div' );
  1243. _this2.__hue_field.className = 'hue-field';
  1244. _this2.__input = document.createElement( 'input' );
  1245. _this2.__input.type = 'text';
  1246. _this2.__input_textShadow = '0 1px 1px ';
  1247. dom.bind( _this2.__input, 'keydown', function ( e ) {
  1248. if ( e.keyCode === 13 ) {
  1249. onBlur.call( this );
  1250. }
  1251. } );
  1252. dom.bind( _this2.__input, 'blur', onBlur );
  1253. dom.bind( _this2.__selector, 'mousedown', function () {
  1254. dom.addClass( this, 'drag' ).bind( window, 'mouseup', function () {
  1255. dom.removeClass( _this.__selector, 'drag' );
  1256. } );
  1257. } );
  1258. dom.bind( _this2.__selector, 'touchstart', function () {
  1259. dom.addClass( this, 'drag' ).bind( window, 'touchend', function () {
  1260. dom.removeClass( _this.__selector, 'drag' );
  1261. } );
  1262. } );
  1263. var valueField = document.createElement( 'div' );
  1264. Common.extend( _this2.__selector.style, {
  1265. width: '122px',
  1266. height: '102px',
  1267. padding: '3px',
  1268. backgroundColor: '#222',
  1269. boxShadow: '0px 1px 3px rgba(0,0,0,0.3)'
  1270. } );
  1271. Common.extend( _this2.__field_knob.style, {
  1272. position: 'absolute',
  1273. width: '12px',
  1274. height: '12px',
  1275. border: _this2.__field_knob_border + ( _this2.__color.v < 0.5 ? '#fff' : '#000' ),
  1276. boxShadow: '0px 1px 3px rgba(0,0,0,0.5)',
  1277. borderRadius: '12px',
  1278. zIndex: 1
  1279. } );
  1280. Common.extend( _this2.__hue_knob.style, {
  1281. position: 'absolute',
  1282. width: '15px',
  1283. height: '2px',
  1284. borderRight: '4px solid #fff',
  1285. zIndex: 1
  1286. } );
  1287. Common.extend( _this2.__saturation_field.style, {
  1288. width: '100px',
  1289. height: '100px',
  1290. border: '1px solid #555',
  1291. marginRight: '3px',
  1292. display: 'inline-block',
  1293. cursor: 'pointer'
  1294. } );
  1295. Common.extend( valueField.style, {
  1296. width: '100%',
  1297. height: '100%',
  1298. background: 'none'
  1299. } );
  1300. linearGradient( valueField, 'top', 'rgba(0,0,0,0)', '#000' );
  1301. Common.extend( _this2.__hue_field.style, {
  1302. width: '15px',
  1303. height: '100px',
  1304. border: '1px solid #555',
  1305. cursor: 'ns-resize',
  1306. position: 'absolute',
  1307. top: '3px',
  1308. right: '3px'
  1309. } );
  1310. hueGradient( _this2.__hue_field );
  1311. Common.extend( _this2.__input.style, {
  1312. outline: 'none',
  1313. textAlign: 'center',
  1314. color: '#fff',
  1315. border: 0,
  1316. fontWeight: 'bold',
  1317. textShadow: _this2.__input_textShadow + 'rgba(0,0,0,0.7)'
  1318. } );
  1319. dom.bind( _this2.__saturation_field, 'mousedown', fieldDown );
  1320. dom.bind( _this2.__saturation_field, 'touchstart', fieldDown );
  1321. dom.bind( _this2.__field_knob, 'mousedown', fieldDown );
  1322. dom.bind( _this2.__field_knob, 'touchstart', fieldDown );
  1323. dom.bind( _this2.__hue_field, 'mousedown', fieldDownH );
  1324. dom.bind( _this2.__hue_field, 'touchstart', fieldDownH );
  1325. function fieldDown( e ) {
  1326. setSV( e );
  1327. dom.bind( window, 'mousemove', setSV );
  1328. dom.bind( window, 'touchmove', setSV );
  1329. dom.bind( window, 'mouseup', fieldUpSV );
  1330. dom.bind( window, 'touchend', fieldUpSV );
  1331. }
  1332. function fieldDownH( e ) {
  1333. setH( e );
  1334. dom.bind( window, 'mousemove', setH );
  1335. dom.bind( window, 'touchmove', setH );
  1336. dom.bind( window, 'mouseup', fieldUpH );
  1337. dom.bind( window, 'touchend', fieldUpH );
  1338. }
  1339. function fieldUpSV() {
  1340. dom.unbind( window, 'mousemove', setSV );
  1341. dom.unbind( window, 'touchmove', setSV );
  1342. dom.unbind( window, 'mouseup', fieldUpSV );
  1343. dom.unbind( window, 'touchend', fieldUpSV );
  1344. onFinish();
  1345. }
  1346. function fieldUpH() {
  1347. dom.unbind( window, 'mousemove', setH );
  1348. dom.unbind( window, 'touchmove', setH );
  1349. dom.unbind( window, 'mouseup', fieldUpH );
  1350. dom.unbind( window, 'touchend', fieldUpH );
  1351. onFinish();
  1352. }
  1353. function onBlur() {
  1354. var i = interpret( this.value );
  1355. if ( i !== false ) {
  1356. _this.__color.__state = i;
  1357. _this.setValue( _this.__color.toOriginal() );
  1358. } else {
  1359. this.value = _this.__color.toString();
  1360. }
  1361. }
  1362. function onFinish() {
  1363. if ( _this.__onFinishChange ) {
  1364. _this.__onFinishChange.call( _this, _this.__color.toOriginal() );
  1365. }
  1366. }
  1367. _this2.__saturation_field.appendChild( valueField );
  1368. _this2.__selector.appendChild( _this2.__field_knob );
  1369. _this2.__selector.appendChild( _this2.__saturation_field );
  1370. _this2.__selector.appendChild( _this2.__hue_field );
  1371. _this2.__hue_field.appendChild( _this2.__hue_knob );
  1372. _this2.domElement.appendChild( _this2.__input );
  1373. _this2.domElement.appendChild( _this2.__selector );
  1374. _this2.updateDisplay();
  1375. function setSV( e ) {
  1376. if ( e.type.indexOf( 'touch' ) === - 1 ) {
  1377. e.preventDefault();
  1378. }
  1379. var fieldRect = _this.__saturation_field.getBoundingClientRect();
  1380. var _ref = e.touches && e.touches[ 0 ] || e,
  1381. clientX = _ref.clientX,
  1382. clientY = _ref.clientY;
  1383. var s = ( clientX - fieldRect.left ) / ( fieldRect.right - fieldRect.left );
  1384. var v = 1 - ( clientY - fieldRect.top ) / ( fieldRect.bottom - fieldRect.top );
  1385. if ( v > 1 ) {
  1386. v = 1;
  1387. } else if ( v < 0 ) {
  1388. v = 0;
  1389. }
  1390. if ( s > 1 ) {
  1391. s = 1;
  1392. } else if ( s < 0 ) {
  1393. s = 0;
  1394. }
  1395. _this.__color.v = v;
  1396. _this.__color.s = s;
  1397. _this.setValue( _this.__color.toOriginal() );
  1398. return false;
  1399. }
  1400. function setH( e ) {
  1401. if ( e.type.indexOf( 'touch' ) === - 1 ) {
  1402. e.preventDefault();
  1403. }
  1404. var fieldRect = _this.__hue_field.getBoundingClientRect();
  1405. var _ref2 = e.touches && e.touches[ 0 ] || e,
  1406. clientY = _ref2.clientY;
  1407. var h = 1 - ( clientY - fieldRect.top ) / ( fieldRect.bottom - fieldRect.top );
  1408. if ( h > 1 ) {
  1409. h = 1;
  1410. } else if ( h < 0 ) {
  1411. h = 0;
  1412. }
  1413. _this.__color.h = h * 360;
  1414. _this.setValue( _this.__color.toOriginal() );
  1415. return false;
  1416. }
  1417. return _this2;
  1418. }
  1419. createClass( ColorController, [ {
  1420. key: 'updateDisplay',
  1421. value: function updateDisplay() {
  1422. var i = interpret( this.getValue() );
  1423. if ( i !== false ) {
  1424. var mismatch = false;
  1425. Common.each( Color.COMPONENTS, function ( component ) {
  1426. if ( ! Common.isUndefined( i[ component ] ) && ! Common.isUndefined( this.__color.__state[ component ] ) && i[ component ] !== this.__color.__state[ component ] ) {
  1427. mismatch = true;
  1428. return {};
  1429. }
  1430. }, this );
  1431. if ( mismatch ) {
  1432. Common.extend( this.__color.__state, i );
  1433. }
  1434. }
  1435. Common.extend( this.__temp.__state, this.__color.__state );
  1436. this.__temp.a = 1;
  1437. var flip = this.__color.v < 0.5 || this.__color.s > 0.5 ? 255 : 0;
  1438. var _flip = 255 - flip;
  1439. Common.extend( this.__field_knob.style, {
  1440. marginLeft: 100 * this.__color.s - 7 + 'px',
  1441. marginTop: 100 * ( 1 - this.__color.v ) - 7 + 'px',
  1442. backgroundColor: this.__temp.toHexString(),
  1443. border: this.__field_knob_border + 'rgb(' + flip + ',' + flip + ',' + flip + ')'
  1444. } );
  1445. this.__hue_knob.style.marginTop = ( 1 - this.__color.h / 360 ) * 100 + 'px';
  1446. this.__temp.s = 1;
  1447. this.__temp.v = 1;
  1448. linearGradient( this.__saturation_field, 'left', '#fff', this.__temp.toHexString() );
  1449. this.__input.value = this.__color.toString();
  1450. Common.extend( this.__input.style, {
  1451. backgroundColor: this.__color.toHexString(),
  1452. color: 'rgb(' + flip + ',' + flip + ',' + flip + ')',
  1453. textShadow: this.__input_textShadow + 'rgba(' + _flip + ',' + _flip + ',' + _flip + ',.7)'
  1454. } );
  1455. }
  1456. } ] );
  1457. return ColorController;
  1458. }( Controller );
  1459. var vendors = [ '-moz-', '-o-', '-webkit-', '-ms-', '' ];
  1460. function linearGradient( elem, x, a, b ) {
  1461. elem.style.background = '';
  1462. Common.each( vendors, function ( vendor ) {
  1463. elem.style.cssText += 'background: ' + vendor + 'linear-gradient(' + x + ', ' + a + ' 0%, ' + b + ' 100%); ';
  1464. } );
  1465. }
  1466. function hueGradient( elem ) {
  1467. elem.style.background = '';
  1468. elem.style.cssText += 'background: -moz-linear-gradient(top, #ff0000 0%, #ff00ff 17%, #0000ff 34%, #00ffff 50%, #00ff00 67%, #ffff00 84%, #ff0000 100%);';
  1469. elem.style.cssText += 'background: -webkit-linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);';
  1470. elem.style.cssText += 'background: -o-linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);';
  1471. elem.style.cssText += 'background: -ms-linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);';
  1472. elem.style.cssText += 'background: linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);';
  1473. }
  1474. var css = {
  1475. load: function load( url, indoc ) {
  1476. var doc = indoc || document;
  1477. var link = doc.createElement( 'link' );
  1478. link.type = 'text/css';
  1479. link.rel = 'stylesheet';
  1480. link.href = url;
  1481. doc.getElementsByTagName( 'head' )[ 0 ].appendChild( link );
  1482. },
  1483. inject: function inject( cssContent, indoc ) {
  1484. var doc = indoc || document;
  1485. var injected = document.createElement( 'style' );
  1486. injected.type = 'text/css';
  1487. injected.innerHTML = cssContent;
  1488. var head = doc.getElementsByTagName( 'head' )[ 0 ];
  1489. try {
  1490. head.appendChild( injected );
  1491. } catch ( e ) {
  1492. }
  1493. }
  1494. };
  1495. 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>";
  1496. var ControllerFactory = function ControllerFactory( object, property ) {
  1497. var initialValue = object[ property ];
  1498. if ( Common.isArray( arguments[ 2 ] ) || Common.isObject( arguments[ 2 ] ) ) {
  1499. return new OptionController( object, property, arguments[ 2 ] );
  1500. }
  1501. if ( Common.isNumber( initialValue ) ) {
  1502. if ( Common.isNumber( arguments[ 2 ] ) && Common.isNumber( arguments[ 3 ] ) ) {
  1503. if ( Common.isNumber( arguments[ 4 ] ) ) {
  1504. return new NumberControllerSlider( object, property, arguments[ 2 ], arguments[ 3 ], arguments[ 4 ] );
  1505. }
  1506. return new NumberControllerSlider( object, property, arguments[ 2 ], arguments[ 3 ] );
  1507. }
  1508. if ( Common.isNumber( arguments[ 4 ] ) ) {
  1509. return new NumberControllerBox( object, property, { min: arguments[ 2 ], max: arguments[ 3 ], step: arguments[ 4 ] } );
  1510. }
  1511. return new NumberControllerBox( object, property, { min: arguments[ 2 ], max: arguments[ 3 ] } );
  1512. }
  1513. if ( Common.isString( initialValue ) ) {
  1514. return new StringController( object, property );
  1515. }
  1516. if ( Common.isFunction( initialValue ) ) {
  1517. return new FunctionController( object, property, '' );
  1518. }
  1519. if ( Common.isBoolean( initialValue ) ) {
  1520. return new BooleanController( object, property );
  1521. }
  1522. return null;
  1523. };
  1524. function requestAnimationFrame( callback ) {
  1525. setTimeout( callback, 1000 / 60 );
  1526. }
  1527. var requestAnimationFrame$1 = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || requestAnimationFrame;
  1528. var CenteredDiv = function () {
  1529. function CenteredDiv() {
  1530. classCallCheck( this, CenteredDiv );
  1531. this.backgroundElement = document.createElement( 'div' );
  1532. Common.extend( this.backgroundElement.style, {
  1533. backgroundColor: 'rgba(0,0,0,0.8)',
  1534. top: 0,
  1535. left: 0,
  1536. display: 'none',
  1537. zIndex: '1000',
  1538. opacity: 0,
  1539. WebkitTransition: 'opacity 0.2s linear',
  1540. transition: 'opacity 0.2s linear'
  1541. } );
  1542. dom.makeFullscreen( this.backgroundElement );
  1543. this.backgroundElement.style.position = 'fixed';
  1544. this.domElement = document.createElement( 'div' );
  1545. Common.extend( this.domElement.style, {
  1546. position: 'fixed',
  1547. display: 'none',
  1548. zIndex: '1001',
  1549. opacity: 0,
  1550. WebkitTransition: '-webkit-transform 0.2s ease-out, opacity 0.2s linear',
  1551. transition: 'transform 0.2s ease-out, opacity 0.2s linear'
  1552. } );
  1553. document.body.appendChild( this.backgroundElement );
  1554. document.body.appendChild( this.domElement );
  1555. var _this = this;
  1556. dom.bind( this.backgroundElement, 'click', function () {
  1557. _this.hide();
  1558. } );
  1559. }
  1560. createClass( CenteredDiv, [ {
  1561. key: 'show',
  1562. value: function show() {
  1563. var _this = this;
  1564. this.backgroundElement.style.display = 'block';
  1565. this.domElement.style.display = 'block';
  1566. this.domElement.style.opacity = 0;
  1567. this.domElement.style.webkitTransform = 'scale(1.1)';
  1568. this.layout();
  1569. Common.defer( function () {
  1570. _this.backgroundElement.style.opacity = 1;
  1571. _this.domElement.style.opacity = 1;
  1572. _this.domElement.style.webkitTransform = 'scale(1)';
  1573. } );
  1574. }
  1575. }, {
  1576. key: 'hide',
  1577. value: function hide() {
  1578. var _this = this;
  1579. var hide = function hide() {
  1580. _this.domElement.style.display = 'none';
  1581. _this.backgroundElement.style.display = 'none';
  1582. dom.unbind( _this.domElement, 'webkitTransitionEnd', hide );
  1583. dom.unbind( _this.domElement, 'transitionend', hide );
  1584. dom.unbind( _this.domElement, 'oTransitionEnd', hide );
  1585. };
  1586. dom.bind( this.domElement, 'webkitTransitionEnd', hide );
  1587. dom.bind( this.domElement, 'transitionend', hide );
  1588. dom.bind( this.domElement, 'oTransitionEnd', hide );
  1589. this.backgroundElement.style.opacity = 0;
  1590. this.domElement.style.opacity = 0;
  1591. this.domElement.style.webkitTransform = 'scale(1.1)';
  1592. }
  1593. }, {
  1594. key: 'layout',
  1595. value: function layout() {
  1596. this.domElement.style.left = window.innerWidth / 2 - dom.getWidth( this.domElement ) / 2 + 'px';
  1597. this.domElement.style.top = window.innerHeight / 2 - dom.getHeight( this.domElement ) / 2 + 'px';
  1598. }
  1599. } ] );
  1600. return CenteredDiv;
  1601. }();
  1602. 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" );
  1603. css.inject( styleSheet );
  1604. var CSS_NAMESPACE = 'dg';
  1605. var HIDE_KEY_CODE = 72;
  1606. var CLOSE_BUTTON_HEIGHT = 20;
  1607. var DEFAULT_DEFAULT_PRESET_NAME = 'Default';
  1608. var SUPPORTS_LOCAL_STORAGE = function () {
  1609. try {
  1610. return !! window.localStorage;
  1611. } catch ( e ) {
  1612. return false;
  1613. }
  1614. }();
  1615. var SAVE_DIALOGUE = void 0;
  1616. var autoPlaceVirgin = true;
  1617. var autoPlaceContainer = void 0;
  1618. var hide = false;
  1619. var hideableGuis = [];
  1620. var GUI = function GUI( pars ) {
  1621. var _this = this;
  1622. var params = pars || {};
  1623. this.domElement = document.createElement( 'div' );
  1624. this.__ul = document.createElement( 'ul' );
  1625. this.domElement.appendChild( this.__ul );
  1626. dom.addClass( this.domElement, CSS_NAMESPACE );
  1627. this.__folders = {};
  1628. this.__controllers = [];
  1629. this.__rememberedObjects = [];
  1630. this.__rememberedObjectIndecesToControllers = [];
  1631. this.__listening = [];
  1632. params = Common.defaults( params, {
  1633. closeOnTop: false,
  1634. autoPlace: true,
  1635. width: GUI.DEFAULT_WIDTH
  1636. } );
  1637. params = Common.defaults( params, {
  1638. resizable: params.autoPlace,
  1639. hideable: params.autoPlace
  1640. } );
  1641. if ( ! Common.isUndefined( params.load ) ) {
  1642. if ( params.preset ) {
  1643. params.load.preset = params.preset;
  1644. }
  1645. } else {
  1646. params.load = { preset: DEFAULT_DEFAULT_PRESET_NAME };
  1647. }
  1648. if ( Common.isUndefined( params.parent ) && params.hideable ) {
  1649. hideableGuis.push( this );
  1650. }
  1651. params.resizable = Common.isUndefined( params.parent ) && params.resizable;
  1652. if ( params.autoPlace && Common.isUndefined( params.scrollable ) ) {
  1653. params.scrollable = true;
  1654. }
  1655. var useLocalStorage = SUPPORTS_LOCAL_STORAGE && localStorage.getItem( getLocalStorageHash( this, 'isLocal' ) ) === 'true';
  1656. var saveToLocalStorage = void 0;
  1657. var titleRow = void 0;
  1658. Object.defineProperties( this,
  1659. {
  1660. parent: {
  1661. get: function get$$1() {
  1662. return params.parent;
  1663. }
  1664. },
  1665. scrollable: {
  1666. get: function get$$1() {
  1667. return params.scrollable;
  1668. }
  1669. },
  1670. autoPlace: {
  1671. get: function get$$1() {
  1672. return params.autoPlace;
  1673. }
  1674. },
  1675. closeOnTop: {
  1676. get: function get$$1() {
  1677. return params.closeOnTop;
  1678. }
  1679. },
  1680. preset: {
  1681. get: function get$$1() {
  1682. if ( _this.parent ) {
  1683. return _this.getRoot().preset;
  1684. }
  1685. return params.load.preset;
  1686. },
  1687. set: function set$$1( v ) {
  1688. if ( _this.parent ) {
  1689. _this.getRoot().preset = v;
  1690. } else {
  1691. params.load.preset = v;
  1692. }
  1693. setPresetSelectIndex( this );
  1694. _this.revert();
  1695. }
  1696. },
  1697. width: {
  1698. get: function get$$1() {
  1699. return params.width;
  1700. },
  1701. set: function set$$1( v ) {
  1702. params.width = v;
  1703. setWidth( _this, v );
  1704. }
  1705. },
  1706. name: {
  1707. get: function get$$1() {
  1708. return params.name;
  1709. },
  1710. set: function set$$1( v ) {
  1711. params.name = v;
  1712. if ( titleRow ) {
  1713. titleRow.innerHTML = params.name;
  1714. }
  1715. }
  1716. },
  1717. closed: {
  1718. get: function get$$1() {
  1719. return params.closed;
  1720. },
  1721. set: function set$$1( v ) {
  1722. params.closed = v;
  1723. if ( params.closed ) {
  1724. dom.addClass( _this.__ul, GUI.CLASS_CLOSED );
  1725. } else {
  1726. dom.removeClass( _this.__ul, GUI.CLASS_CLOSED );
  1727. }
  1728. this.onResize();
  1729. if ( _this.__closeButton ) {
  1730. _this.__closeButton.innerHTML = v ? GUI.TEXT_OPEN : GUI.TEXT_CLOSED;
  1731. }
  1732. }
  1733. },
  1734. load: {
  1735. get: function get$$1() {
  1736. return params.load;
  1737. }
  1738. },
  1739. useLocalStorage: {
  1740. get: function get$$1() {
  1741. return useLocalStorage;
  1742. },
  1743. set: function set$$1( bool ) {
  1744. if ( SUPPORTS_LOCAL_STORAGE ) {
  1745. useLocalStorage = bool;
  1746. if ( bool ) {
  1747. dom.bind( window, 'unload', saveToLocalStorage );
  1748. } else {
  1749. dom.unbind( window, 'unload', saveToLocalStorage );
  1750. }
  1751. localStorage.setItem( getLocalStorageHash( _this, 'isLocal' ), bool );
  1752. }
  1753. }
  1754. }
  1755. } );
  1756. if ( Common.isUndefined( params.parent ) ) {
  1757. this.closed = params.closed || false;
  1758. dom.addClass( this.domElement, GUI.CLASS_MAIN );
  1759. dom.makeSelectable( this.domElement, false );
  1760. if ( SUPPORTS_LOCAL_STORAGE ) {
  1761. if ( useLocalStorage ) {
  1762. _this.useLocalStorage = true;
  1763. var savedGui = localStorage.getItem( getLocalStorageHash( this, 'gui' ) );
  1764. if ( savedGui ) {
  1765. params.load = JSON.parse( savedGui );
  1766. }
  1767. }
  1768. }
  1769. this.__closeButton = document.createElement( 'div' );
  1770. this.__closeButton.innerHTML = GUI.TEXT_CLOSED;
  1771. dom.addClass( this.__closeButton, GUI.CLASS_CLOSE_BUTTON );
  1772. if ( params.closeOnTop ) {
  1773. dom.addClass( this.__closeButton, GUI.CLASS_CLOSE_TOP );
  1774. this.domElement.insertBefore( this.__closeButton, this.domElement.childNodes[ 0 ] );
  1775. } else {
  1776. dom.addClass( this.__closeButton, GUI.CLASS_CLOSE_BOTTOM );
  1777. this.domElement.appendChild( this.__closeButton );
  1778. }
  1779. dom.bind( this.__closeButton, 'click', function () {
  1780. _this.closed = ! _this.closed;
  1781. } );
  1782. } else {
  1783. if ( params.closed === undefined ) {
  1784. params.closed = true;
  1785. }
  1786. var titleRowName = document.createTextNode( params.name );
  1787. dom.addClass( titleRowName, 'controller-name' );
  1788. titleRow = addRow( _this, titleRowName );
  1789. var onClickTitle = function onClickTitle( e ) {
  1790. e.preventDefault();
  1791. _this.closed = ! _this.closed;
  1792. return false;
  1793. };
  1794. dom.addClass( this.__ul, GUI.CLASS_CLOSED );
  1795. dom.addClass( titleRow, 'title' );
  1796. dom.bind( titleRow, 'click', onClickTitle );
  1797. if ( ! params.closed ) {
  1798. this.closed = false;
  1799. }
  1800. }
  1801. if ( params.autoPlace ) {
  1802. if ( Common.isUndefined( params.parent ) ) {
  1803. if ( autoPlaceVirgin ) {
  1804. autoPlaceContainer = document.createElement( 'div' );
  1805. dom.addClass( autoPlaceContainer, CSS_NAMESPACE );
  1806. dom.addClass( autoPlaceContainer, GUI.CLASS_AUTO_PLACE_CONTAINER );
  1807. document.body.appendChild( autoPlaceContainer );
  1808. autoPlaceVirgin = false;
  1809. }
  1810. autoPlaceContainer.appendChild( this.domElement );
  1811. dom.addClass( this.domElement, GUI.CLASS_AUTO_PLACE );
  1812. }
  1813. if ( ! this.parent ) {
  1814. setWidth( _this, params.width );
  1815. }
  1816. }
  1817. this.__resizeHandler = function () {
  1818. _this.onResizeDebounced();
  1819. };
  1820. dom.bind( window, 'resize', this.__resizeHandler );
  1821. dom.bind( this.__ul, 'webkitTransitionEnd', this.__resizeHandler );
  1822. dom.bind( this.__ul, 'transitionend', this.__resizeHandler );
  1823. dom.bind( this.__ul, 'oTransitionEnd', this.__resizeHandler );
  1824. this.onResize();
  1825. if ( params.resizable ) {
  1826. addResizeHandle( this );
  1827. }
  1828. saveToLocalStorage = function saveToLocalStorage() {
  1829. if ( SUPPORTS_LOCAL_STORAGE && localStorage.getItem( getLocalStorageHash( _this, 'isLocal' ) ) === 'true' ) {
  1830. localStorage.setItem( getLocalStorageHash( _this, 'gui' ), JSON.stringify( _this.getSaveObject() ) );
  1831. }
  1832. };
  1833. this.saveToLocalStorageIfPossible = saveToLocalStorage;
  1834. function resetWidth() {
  1835. var root = _this.getRoot();
  1836. root.width += 1;
  1837. Common.defer( function () {
  1838. root.width -= 1;
  1839. } );
  1840. }
  1841. if ( ! params.parent ) {
  1842. resetWidth();
  1843. }
  1844. };
  1845. GUI.toggleHide = function () {
  1846. hide = ! hide;
  1847. Common.each( hideableGuis, function ( gui ) {
  1848. gui.domElement.style.display = hide ? 'none' : '';
  1849. } );
  1850. };
  1851. GUI.CLASS_AUTO_PLACE = 'a';
  1852. GUI.CLASS_AUTO_PLACE_CONTAINER = 'ac';
  1853. GUI.CLASS_MAIN = 'main';
  1854. GUI.CLASS_CONTROLLER_ROW = 'cr';
  1855. GUI.CLASS_TOO_TALL = 'taller-than-window';
  1856. GUI.CLASS_CLOSED = 'closed';
  1857. GUI.CLASS_CLOSE_BUTTON = 'close-button';
  1858. GUI.CLASS_CLOSE_TOP = 'close-top';
  1859. GUI.CLASS_CLOSE_BOTTOM = 'close-bottom';
  1860. GUI.CLASS_DRAG = 'drag';
  1861. GUI.DEFAULT_WIDTH = 245;
  1862. GUI.TEXT_CLOSED = 'Close Controls';
  1863. GUI.TEXT_OPEN = 'Open Controls';
  1864. GUI._keydownHandler = function ( e ) {
  1865. if ( document.activeElement.type !== 'text' && ( e.which === HIDE_KEY_CODE || e.keyCode === HIDE_KEY_CODE ) ) {
  1866. GUI.toggleHide();
  1867. }
  1868. };
  1869. dom.bind( window, 'keydown', GUI._keydownHandler, false );
  1870. Common.extend( GUI.prototype,
  1871. {
  1872. add: function add( object, property ) {
  1873. return _add( this, object, property, {
  1874. factoryArgs: Array.prototype.slice.call( arguments, 2 )
  1875. } );
  1876. },
  1877. addColor: function addColor( object, property ) {
  1878. return _add( this, object, property, {
  1879. color: true
  1880. } );
  1881. },
  1882. remove: function remove( controller ) {
  1883. this.__ul.removeChild( controller.__li );
  1884. this.__controllers.splice( this.__controllers.indexOf( controller ), 1 );
  1885. var _this = this;
  1886. Common.defer( function () {
  1887. _this.onResize();
  1888. } );
  1889. },
  1890. destroy: function destroy() {
  1891. if ( this.parent ) {
  1892. throw new Error( 'Only the root GUI should be removed with .destroy(). ' + 'For subfolders, use gui.removeFolder(folder) instead.' );
  1893. }
  1894. if ( this.autoPlace ) {
  1895. autoPlaceContainer.removeChild( this.domElement );
  1896. }
  1897. var _this = this;
  1898. Common.each( this.__folders, function ( subfolder ) {
  1899. _this.removeFolder( subfolder );
  1900. } );
  1901. dom.unbind( window, 'keydown', GUI._keydownHandler, false );
  1902. removeListeners( this );
  1903. },
  1904. addFolder: function addFolder( name ) {
  1905. if ( this.__folders[ name ] !== undefined ) {
  1906. throw new Error( 'You already have a folder in this GUI by the' + ' name "' + name + '"' );
  1907. }
  1908. var newGuiParams = { name: name, parent: this };
  1909. newGuiParams.autoPlace = this.autoPlace;
  1910. if ( this.load &&
  1911. this.load.folders &&
  1912. this.load.folders[ name ] ) {
  1913. newGuiParams.closed = this.load.folders[ name ].closed;
  1914. newGuiParams.load = this.load.folders[ name ];
  1915. }
  1916. var gui = new GUI( newGuiParams );
  1917. this.__folders[ name ] = gui;
  1918. var li = addRow( this, gui.domElement );
  1919. dom.addClass( li, 'folder' );
  1920. return gui;
  1921. },
  1922. removeFolder: function removeFolder( folder ) {
  1923. this.__ul.removeChild( folder.domElement.parentElement );
  1924. delete this.__folders[ folder.name ];
  1925. if ( this.load &&
  1926. this.load.folders &&
  1927. this.load.folders[ folder.name ] ) {
  1928. delete this.load.folders[ folder.name ];
  1929. }
  1930. removeListeners( folder );
  1931. var _this = this;
  1932. Common.each( folder.__folders, function ( subfolder ) {
  1933. folder.removeFolder( subfolder );
  1934. } );
  1935. Common.defer( function () {
  1936. _this.onResize();
  1937. } );
  1938. },
  1939. open: function open() {
  1940. this.closed = false;
  1941. },
  1942. close: function close() {
  1943. this.closed = true;
  1944. },
  1945. hide: function hide() {
  1946. this.domElement.style.display = 'none';
  1947. },
  1948. show: function show() {
  1949. this.domElement.style.display = '';
  1950. },
  1951. onResize: function onResize() {
  1952. var root = this.getRoot();
  1953. if ( root.scrollable ) {
  1954. var top = dom.getOffset( root.__ul ).top;
  1955. var h = 0;
  1956. Common.each( root.__ul.childNodes, function ( node ) {
  1957. if ( ! ( root.autoPlace && node === root.__save_row ) ) {
  1958. h += dom.getHeight( node );
  1959. }
  1960. } );
  1961. if ( window.innerHeight - top - CLOSE_BUTTON_HEIGHT < h ) {
  1962. dom.addClass( root.domElement, GUI.CLASS_TOO_TALL );
  1963. root.__ul.style.height = window.innerHeight - top - CLOSE_BUTTON_HEIGHT + 'px';
  1964. } else {
  1965. dom.removeClass( root.domElement, GUI.CLASS_TOO_TALL );
  1966. root.__ul.style.height = 'auto';
  1967. }
  1968. }
  1969. if ( root.__resize_handle ) {
  1970. Common.defer( function () {
  1971. root.__resize_handle.style.height = root.__ul.offsetHeight + 'px';
  1972. } );
  1973. }
  1974. if ( root.__closeButton ) {
  1975. root.__closeButton.style.width = root.width + 'px';
  1976. }
  1977. },
  1978. onResizeDebounced: Common.debounce( function () {
  1979. this.onResize();
  1980. }, 50 ),
  1981. remember: function remember() {
  1982. if ( Common.isUndefined( SAVE_DIALOGUE ) ) {
  1983. SAVE_DIALOGUE = new CenteredDiv();
  1984. SAVE_DIALOGUE.domElement.innerHTML = saveDialogContents;
  1985. }
  1986. if ( this.parent ) {
  1987. throw new Error( 'You can only call remember on a top level GUI.' );
  1988. }
  1989. var _this = this;
  1990. Common.each( Array.prototype.slice.call( arguments ), function ( object ) {
  1991. if ( _this.__rememberedObjects.length === 0 ) {
  1992. addSaveMenu( _this );
  1993. }
  1994. if ( _this.__rememberedObjects.indexOf( object ) === - 1 ) {
  1995. _this.__rememberedObjects.push( object );
  1996. }
  1997. } );
  1998. if ( this.autoPlace ) {
  1999. setWidth( this, this.width );
  2000. }
  2001. },
  2002. getRoot: function getRoot() {
  2003. var gui = this;
  2004. while ( gui.parent ) {
  2005. gui = gui.parent;
  2006. }
  2007. return gui;
  2008. },
  2009. getSaveObject: function getSaveObject() {
  2010. var toReturn = this.load;
  2011. toReturn.closed = this.closed;
  2012. if ( this.__rememberedObjects.length > 0 ) {
  2013. toReturn.preset = this.preset;
  2014. if ( ! toReturn.remembered ) {
  2015. toReturn.remembered = {};
  2016. }
  2017. toReturn.remembered[ this.preset ] = getCurrentPreset( this );
  2018. }
  2019. toReturn.folders = {};
  2020. Common.each( this.__folders, function ( element, key ) {
  2021. toReturn.folders[ key ] = element.getSaveObject();
  2022. } );
  2023. return toReturn;
  2024. },
  2025. save: function save() {
  2026. if ( ! this.load.remembered ) {
  2027. this.load.remembered = {};
  2028. }
  2029. this.load.remembered[ this.preset ] = getCurrentPreset( this );
  2030. markPresetModified( this, false );
  2031. this.saveToLocalStorageIfPossible();
  2032. },
  2033. saveAs: function saveAs( presetName ) {
  2034. if ( ! this.load.remembered ) {
  2035. this.load.remembered = {};
  2036. this.load.remembered[ DEFAULT_DEFAULT_PRESET_NAME ] = getCurrentPreset( this, true );
  2037. }
  2038. this.load.remembered[ presetName ] = getCurrentPreset( this );
  2039. this.preset = presetName;
  2040. addPresetOption( this, presetName, true );
  2041. this.saveToLocalStorageIfPossible();
  2042. },
  2043. revert: function revert( gui ) {
  2044. Common.each( this.__controllers, function ( controller ) {
  2045. if ( ! this.getRoot().load.remembered ) {
  2046. controller.setValue( controller.initialValue );
  2047. } else {
  2048. recallSavedValue( gui || this.getRoot(), controller );
  2049. }
  2050. if ( controller.__onFinishChange ) {
  2051. controller.__onFinishChange.call( controller, controller.getValue() );
  2052. }
  2053. }, this );
  2054. Common.each( this.__folders, function ( folder ) {
  2055. folder.revert( folder );
  2056. } );
  2057. if ( ! gui ) {
  2058. markPresetModified( this.getRoot(), false );
  2059. }
  2060. },
  2061. listen: function listen( controller ) {
  2062. var init = this.__listening.length === 0;
  2063. this.__listening.push( controller );
  2064. if ( init ) {
  2065. updateDisplays( this.__listening );
  2066. }
  2067. },
  2068. updateDisplay: function updateDisplay() {
  2069. Common.each( this.__controllers, function ( controller ) {
  2070. controller.updateDisplay();
  2071. } );
  2072. Common.each( this.__folders, function ( folder ) {
  2073. folder.updateDisplay();
  2074. } );
  2075. }
  2076. } );
  2077. function addRow( gui, newDom, liBefore ) {
  2078. var li = document.createElement( 'li' );
  2079. if ( newDom ) {
  2080. li.appendChild( newDom );
  2081. }
  2082. if ( liBefore ) {
  2083. gui.__ul.insertBefore( li, liBefore );
  2084. } else {
  2085. gui.__ul.appendChild( li );
  2086. }
  2087. gui.onResize();
  2088. return li;
  2089. }
  2090. function removeListeners( gui ) {
  2091. dom.unbind( window, 'resize', gui.__resizeHandler );
  2092. if ( gui.saveToLocalStorageIfPossible ) {
  2093. dom.unbind( window, 'unload', gui.saveToLocalStorageIfPossible );
  2094. }
  2095. }
  2096. function markPresetModified( gui, modified ) {
  2097. var opt = gui.__preset_select[ gui.__preset_select.selectedIndex ];
  2098. if ( modified ) {
  2099. opt.innerHTML = opt.value + '*';
  2100. } else {
  2101. opt.innerHTML = opt.value;
  2102. }
  2103. }
  2104. function augmentController( gui, li, controller ) {
  2105. controller.__li = li;
  2106. controller.__gui = gui;
  2107. Common.extend( controller, {
  2108. options: function options( _options ) {
  2109. if ( arguments.length > 1 ) {
  2110. var nextSibling = controller.__li.nextElementSibling;
  2111. controller.remove();
  2112. return _add( gui, controller.object, controller.property, {
  2113. before: nextSibling,
  2114. factoryArgs: [ Common.toArray( arguments ) ]
  2115. } );
  2116. }
  2117. if ( Common.isArray( _options ) || Common.isObject( _options ) ) {
  2118. var _nextSibling = controller.__li.nextElementSibling;
  2119. controller.remove();
  2120. return _add( gui, controller.object, controller.property, {
  2121. before: _nextSibling,
  2122. factoryArgs: [ _options ]
  2123. } );
  2124. }
  2125. },
  2126. name: function name( _name ) {
  2127. controller.__li.firstElementChild.firstElementChild.innerHTML = _name;
  2128. return controller;
  2129. },
  2130. listen: function listen() {
  2131. controller.__gui.listen( controller );
  2132. return controller;
  2133. },
  2134. remove: function remove() {
  2135. controller.__gui.remove( controller );
  2136. return controller;
  2137. }
  2138. } );
  2139. if ( controller instanceof NumberControllerSlider ) {
  2140. var box = new NumberControllerBox( controller.object, controller.property, { min: controller.__min, max: controller.__max, step: controller.__step } );
  2141. Common.each( [ 'updateDisplay', 'onChange', 'onFinishChange', 'step', 'min', 'max' ], function ( method ) {
  2142. var pc = controller[ method ];
  2143. var pb = box[ method ];
  2144. controller[ method ] = box[ method ] = function () {
  2145. var args = Array.prototype.slice.call( arguments );
  2146. pb.apply( box, args );
  2147. return pc.apply( controller, args );
  2148. };
  2149. } );
  2150. dom.addClass( li, 'has-slider' );
  2151. controller.domElement.insertBefore( box.domElement, controller.domElement.firstElementChild );
  2152. } else if ( controller instanceof NumberControllerBox ) {
  2153. var r = function r( returned ) {
  2154. if ( Common.isNumber( controller.__min ) && Common.isNumber( controller.__max ) ) {
  2155. var oldName = controller.__li.firstElementChild.firstElementChild.innerHTML;
  2156. var wasListening = controller.__gui.__listening.indexOf( controller ) > - 1;
  2157. controller.remove();
  2158. var newController = _add( gui, controller.object, controller.property, {
  2159. before: controller.__li.nextElementSibling,
  2160. factoryArgs: [ controller.__min, controller.__max, controller.__step ]
  2161. } );
  2162. newController.name( oldName );
  2163. if ( wasListening ) newController.listen();
  2164. return newController;
  2165. }
  2166. return returned;
  2167. };
  2168. controller.min = Common.compose( r, controller.min );
  2169. controller.max = Common.compose( r, controller.max );
  2170. } else if ( controller instanceof BooleanController ) {
  2171. dom.bind( li, 'click', function () {
  2172. dom.fakeEvent( controller.__checkbox, 'click' );
  2173. } );
  2174. dom.bind( controller.__checkbox, 'click', function ( e ) {
  2175. e.stopPropagation();
  2176. } );
  2177. } else if ( controller instanceof FunctionController ) {
  2178. dom.bind( li, 'click', function () {
  2179. dom.fakeEvent( controller.__button, 'click' );
  2180. } );
  2181. dom.bind( li, 'mouseover', function () {
  2182. dom.addClass( controller.__button, 'hover' );
  2183. } );
  2184. dom.bind( li, 'mouseout', function () {
  2185. dom.removeClass( controller.__button, 'hover' );
  2186. } );
  2187. } else if ( controller instanceof ColorController ) {
  2188. dom.addClass( li, 'color' );
  2189. controller.updateDisplay = Common.compose( function ( val ) {
  2190. li.style.borderLeftColor = controller.__color.toString();
  2191. return val;
  2192. }, controller.updateDisplay );
  2193. controller.updateDisplay();
  2194. }
  2195. controller.setValue = Common.compose( function ( val ) {
  2196. if ( gui.getRoot().__preset_select && controller.isModified() ) {
  2197. markPresetModified( gui.getRoot(), true );
  2198. }
  2199. return val;
  2200. }, controller.setValue );
  2201. }
  2202. function recallSavedValue( gui, controller ) {
  2203. var root = gui.getRoot();
  2204. var matchedIndex = root.__rememberedObjects.indexOf( controller.object );
  2205. if ( matchedIndex !== - 1 ) {
  2206. var controllerMap = root.__rememberedObjectIndecesToControllers[ matchedIndex ];
  2207. if ( controllerMap === undefined ) {
  2208. controllerMap = {};
  2209. root.__rememberedObjectIndecesToControllers[ matchedIndex ] = controllerMap;
  2210. }
  2211. controllerMap[ controller.property ] = controller;
  2212. if ( root.load && root.load.remembered ) {
  2213. var presetMap = root.load.remembered;
  2214. var preset = void 0;
  2215. if ( presetMap[ gui.preset ] ) {
  2216. preset = presetMap[ gui.preset ];
  2217. } else if ( presetMap[ DEFAULT_DEFAULT_PRESET_NAME ] ) {
  2218. preset = presetMap[ DEFAULT_DEFAULT_PRESET_NAME ];
  2219. } else {
  2220. return;
  2221. }
  2222. if ( preset[ matchedIndex ] && preset[ matchedIndex ][ controller.property ] !== undefined ) {
  2223. var value = preset[ matchedIndex ][ controller.property ];
  2224. controller.initialValue = value;
  2225. controller.setValue( value );
  2226. }
  2227. }
  2228. }
  2229. }
  2230. function _add( gui, object, property, params ) {
  2231. if ( object[ property ] === undefined ) {
  2232. throw new Error( 'Object "' + object + '" has no property "' + property + '"' );
  2233. }
  2234. var controller = void 0;
  2235. if ( params.color ) {
  2236. controller = new ColorController( object, property );
  2237. } else {
  2238. var factoryArgs = [ object, property ].concat( params.factoryArgs );
  2239. controller = ControllerFactory.apply( gui, factoryArgs );
  2240. }
  2241. if ( params.before instanceof Controller ) {
  2242. params.before = params.before.__li;
  2243. }
  2244. recallSavedValue( gui, controller );
  2245. dom.addClass( controller.domElement, 'c' );
  2246. var name = document.createElement( 'span' );
  2247. dom.addClass( name, 'property-name' );
  2248. name.innerHTML = controller.property;
  2249. var container = document.createElement( 'div' );
  2250. container.appendChild( name );
  2251. container.appendChild( controller.domElement );
  2252. var li = addRow( gui, container, params.before );
  2253. dom.addClass( li, GUI.CLASS_CONTROLLER_ROW );
  2254. if ( controller instanceof ColorController ) {
  2255. dom.addClass( li, 'color' );
  2256. } else {
  2257. dom.addClass( li, _typeof( controller.getValue() ) );
  2258. }
  2259. augmentController( gui, li, controller );
  2260. gui.__controllers.push( controller );
  2261. return controller;
  2262. }
  2263. function getLocalStorageHash( gui, key ) {
  2264. return document.location.href + '.' + key;
  2265. }
  2266. function addPresetOption( gui, name, setSelected ) {
  2267. var opt = document.createElement( 'option' );
  2268. opt.innerHTML = name;
  2269. opt.value = name;
  2270. gui.__preset_select.appendChild( opt );
  2271. if ( setSelected ) {
  2272. gui.__preset_select.selectedIndex = gui.__preset_select.length - 1;
  2273. }
  2274. }
  2275. function showHideExplain( gui, explain ) {
  2276. explain.style.display = gui.useLocalStorage ? 'block' : 'none';
  2277. }
  2278. function addSaveMenu( gui ) {
  2279. var div = gui.__save_row = document.createElement( 'li' );
  2280. dom.addClass( gui.domElement, 'has-save' );
  2281. gui.__ul.insertBefore( div, gui.__ul.firstChild );
  2282. dom.addClass( div, 'save-row' );
  2283. var gears = document.createElement( 'span' );
  2284. gears.innerHTML = '&nbsp;';
  2285. dom.addClass( gears, 'button gears' );
  2286. var button = document.createElement( 'span' );
  2287. button.innerHTML = 'Save';
  2288. dom.addClass( button, 'button' );
  2289. dom.addClass( button, 'save' );
  2290. var button2 = document.createElement( 'span' );
  2291. button2.innerHTML = 'New';
  2292. dom.addClass( button2, 'button' );
  2293. dom.addClass( button2, 'save-as' );
  2294. var button3 = document.createElement( 'span' );
  2295. button3.innerHTML = 'Revert';
  2296. dom.addClass( button3, 'button' );
  2297. dom.addClass( button3, 'revert' );
  2298. var select = gui.__preset_select = document.createElement( 'select' );
  2299. if ( gui.load && gui.load.remembered ) {
  2300. Common.each( gui.load.remembered, function ( value, key ) {
  2301. addPresetOption( gui, key, key === gui.preset );
  2302. } );
  2303. } else {
  2304. addPresetOption( gui, DEFAULT_DEFAULT_PRESET_NAME, false );
  2305. }
  2306. dom.bind( select, 'change', function () {
  2307. for ( var index = 0; index < gui.__preset_select.length; index ++ ) {
  2308. gui.__preset_select[ index ].innerHTML = gui.__preset_select[ index ].value;
  2309. }
  2310. gui.preset = this.value;
  2311. } );
  2312. div.appendChild( select );
  2313. div.appendChild( gears );
  2314. div.appendChild( button );
  2315. div.appendChild( button2 );
  2316. div.appendChild( button3 );
  2317. if ( SUPPORTS_LOCAL_STORAGE ) {
  2318. var explain = document.getElementById( 'dg-local-explain' );
  2319. var localStorageCheckBox = document.getElementById( 'dg-local-storage' );
  2320. var saveLocally = document.getElementById( 'dg-save-locally' );
  2321. saveLocally.style.display = 'block';
  2322. if ( localStorage.getItem( getLocalStorageHash( gui, 'isLocal' ) ) === 'true' ) {
  2323. localStorageCheckBox.setAttribute( 'checked', 'checked' );
  2324. }
  2325. showHideExplain( gui, explain );
  2326. dom.bind( localStorageCheckBox, 'change', function () {
  2327. gui.useLocalStorage = ! gui.useLocalStorage;
  2328. showHideExplain( gui, explain );
  2329. } );
  2330. }
  2331. var newConstructorTextArea = document.getElementById( 'dg-new-constructor' );
  2332. dom.bind( newConstructorTextArea, 'keydown', function ( e ) {
  2333. if ( e.metaKey && ( e.which === 67 || e.keyCode === 67 ) ) {
  2334. SAVE_DIALOGUE.hide();
  2335. }
  2336. } );
  2337. dom.bind( gears, 'click', function () {
  2338. newConstructorTextArea.innerHTML = JSON.stringify( gui.getSaveObject(), undefined, 2 );
  2339. SAVE_DIALOGUE.show();
  2340. newConstructorTextArea.focus();
  2341. newConstructorTextArea.select();
  2342. } );
  2343. dom.bind( button, 'click', function () {
  2344. gui.save();
  2345. } );
  2346. dom.bind( button2, 'click', function () {
  2347. var presetName = prompt( 'Enter a new preset name.' );
  2348. if ( presetName ) {
  2349. gui.saveAs( presetName );
  2350. }
  2351. } );
  2352. dom.bind( button3, 'click', function () {
  2353. gui.revert();
  2354. } );
  2355. }
  2356. function addResizeHandle( gui ) {
  2357. var pmouseX = void 0;
  2358. gui.__resize_handle = document.createElement( 'div' );
  2359. Common.extend( gui.__resize_handle.style, {
  2360. width: '6px',
  2361. marginLeft: '-3px',
  2362. height: '200px',
  2363. cursor: 'ew-resize',
  2364. position: 'absolute'
  2365. } );
  2366. function drag( e ) {
  2367. e.preventDefault();
  2368. gui.width += pmouseX - e.clientX;
  2369. gui.onResize();
  2370. pmouseX = e.clientX;
  2371. return false;
  2372. }
  2373. function dragStop() {
  2374. dom.removeClass( gui.__closeButton, GUI.CLASS_DRAG );
  2375. dom.unbind( window, 'mousemove', drag );
  2376. dom.unbind( window, 'mouseup', dragStop );
  2377. }
  2378. function dragStart( e ) {
  2379. e.preventDefault();
  2380. pmouseX = e.clientX;
  2381. dom.addClass( gui.__closeButton, GUI.CLASS_DRAG );
  2382. dom.bind( window, 'mousemove', drag );
  2383. dom.bind( window, 'mouseup', dragStop );
  2384. return false;
  2385. }
  2386. dom.bind( gui.__resize_handle, 'mousedown', dragStart );
  2387. dom.bind( gui.__closeButton, 'mousedown', dragStart );
  2388. gui.domElement.insertBefore( gui.__resize_handle, gui.domElement.firstElementChild );
  2389. }
  2390. function setWidth( gui, w ) {
  2391. gui.domElement.style.width = w + 'px';
  2392. if ( gui.__save_row && gui.autoPlace ) {
  2393. gui.__save_row.style.width = w + 'px';
  2394. }
  2395. if ( gui.__closeButton ) {
  2396. gui.__closeButton.style.width = w + 'px';
  2397. }
  2398. }
  2399. function getCurrentPreset( gui, useInitialValues ) {
  2400. var toReturn = {};
  2401. Common.each( gui.__rememberedObjects, function ( val, index ) {
  2402. var savedValues = {};
  2403. var controllerMap = gui.__rememberedObjectIndecesToControllers[ index ];
  2404. Common.each( controllerMap, function ( controller, property ) {
  2405. savedValues[ property ] = useInitialValues ? controller.initialValue : controller.getValue();
  2406. } );
  2407. toReturn[ index ] = savedValues;
  2408. } );
  2409. return toReturn;
  2410. }
  2411. function setPresetSelectIndex( gui ) {
  2412. for ( var index = 0; index < gui.__preset_select.length; index ++ ) {
  2413. if ( gui.__preset_select[ index ].value === gui.preset ) {
  2414. gui.__preset_select.selectedIndex = index;
  2415. }
  2416. }
  2417. }
  2418. function updateDisplays( controllerArray ) {
  2419. if ( controllerArray.length !== 0 ) {
  2420. requestAnimationFrame$1.call( window, function () {
  2421. updateDisplays( controllerArray );
  2422. } );
  2423. }
  2424. Common.each( controllerArray, function ( c ) {
  2425. c.updateDisplay();
  2426. } );
  2427. }
  2428. var color = {
  2429. Color: Color,
  2430. math: ColorMath,
  2431. interpret: interpret
  2432. };
  2433. var controllers = {
  2434. Controller: Controller,
  2435. BooleanController: BooleanController,
  2436. OptionController: OptionController,
  2437. StringController: StringController,
  2438. NumberController: NumberController,
  2439. NumberControllerBox: NumberControllerBox,
  2440. NumberControllerSlider: NumberControllerSlider,
  2441. FunctionController: FunctionController,
  2442. ColorController: ColorController
  2443. };
  2444. var dom$1 = { dom: dom };
  2445. var gui = { GUI: GUI };
  2446. var GUI$1 = GUI;
  2447. var index = {
  2448. color: color,
  2449. controllers: controllers,
  2450. dom: dom$1,
  2451. gui: gui,
  2452. GUI: GUI$1
  2453. };
  2454. export { color, controllers, dom$1 as dom, gui, GUI$1 as GUI };
  2455. export default index;