dat.gui.module.js 85 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523
  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(_x) {
  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;
  2456. //# sourceMappingURL=dat.gui.module.js.map