2018-01-21 05:16:48 +00:00
/ * *
* dat - gui JavaScript Controller Library
2022-02-17 00:57:57 +00:00
* https : //github.com/dataarts/dat.gui
2018-01-21 05:16:48 +00:00
*
* Copyright 2011 Data Arts Team , Google Creative Lab
*
* Licensed under the Apache License , Version 2.0 ( the "License" ) ;
* you may not use this file except in compliance with the License .
* You may obtain a copy of the License at
*
* http : //www.apache.org/licenses/LICENSE-2.0
* /
function _ _ _$insertStyle ( css ) {
2023-05-28 09:23:34 +00:00
if ( ! css || typeof window === 'undefined' ) {
return ;
}
const style = document . createElement ( 'style' ) ;
style . setAttribute ( 'type' , 'text/css' ) ;
style . innerHTML = css ;
document . head . appendChild ( style ) ;
return css ;
2018-01-21 05:16:48 +00:00
}
function colorToString ( color , forceCSSHex ) {
var colorFormat = color . _ _state . conversionName . toString ( ) ;
var r = Math . round ( color . r ) ;
var g = Math . round ( color . g ) ;
var b = Math . round ( color . b ) ;
var a = color . a ;
var h = Math . round ( color . h ) ;
var s = color . s . toFixed ( 1 ) ;
var v = color . v . toFixed ( 1 ) ;
if ( forceCSSHex || colorFormat === 'THREE_CHAR_HEX' || colorFormat === 'SIX_CHAR_HEX' ) {
var str = color . hex . toString ( 16 ) ;
while ( str . length < 6 ) {
str = '0' + str ;
}
return '#' + str ;
} else if ( colorFormat === 'CSS_RGB' ) {
return 'rgb(' + r + ',' + g + ',' + b + ')' ;
} else if ( colorFormat === 'CSS_RGBA' ) {
return 'rgba(' + r + ',' + g + ',' + b + ',' + a + ')' ;
} else if ( colorFormat === 'HEX' ) {
return '0x' + color . hex . toString ( 16 ) ;
} else if ( colorFormat === 'RGB_ARRAY' ) {
return '[' + r + ',' + g + ',' + b + ']' ;
} else if ( colorFormat === 'RGBA_ARRAY' ) {
return '[' + r + ',' + g + ',' + b + ',' + a + ']' ;
} else if ( colorFormat === 'RGB_OBJ' ) {
return '{r:' + r + ',g:' + g + ',b:' + b + '}' ;
} else if ( colorFormat === 'RGBA_OBJ' ) {
return '{r:' + r + ',g:' + g + ',b:' + b + ',a:' + a + '}' ;
} else if ( colorFormat === 'HSV_OBJ' ) {
return '{h:' + h + ',s:' + s + ',v:' + v + '}' ;
} else if ( colorFormat === 'HSVA_OBJ' ) {
return '{h:' + h + ',s:' + s + ',v:' + v + ',a:' + a + '}' ;
}
return 'unknown format' ;
}
var ARR _EACH = Array . prototype . forEach ;
var ARR _SLICE = Array . prototype . slice ;
var Common = {
BREAK : { } ,
extend : function extend ( target ) {
this . each ( ARR _SLICE . call ( arguments , 1 ) , function ( obj ) {
var keys = this . isObject ( obj ) ? Object . keys ( obj ) : [ ] ;
keys . forEach ( function ( key ) {
if ( ! this . isUndefined ( obj [ key ] ) ) {
target [ key ] = obj [ key ] ;
}
} . bind ( this ) ) ;
} , this ) ;
return target ;
} ,
defaults : function defaults ( target ) {
this . each ( ARR _SLICE . call ( arguments , 1 ) , function ( obj ) {
var keys = this . isObject ( obj ) ? Object . keys ( obj ) : [ ] ;
keys . forEach ( function ( key ) {
if ( this . isUndefined ( target [ key ] ) ) {
target [ key ] = obj [ key ] ;
}
} . bind ( this ) ) ;
} , this ) ;
return target ;
} ,
compose : function compose ( ) {
var toCall = ARR _SLICE . call ( arguments ) ;
return function ( ) {
var args = ARR _SLICE . call ( arguments ) ;
for ( var i = toCall . length - 1 ; i >= 0 ; i -- ) {
args = [ toCall [ i ] . apply ( this , args ) ] ;
}
return args [ 0 ] ;
} ;
} ,
each : function each ( obj , itr , scope ) {
if ( ! obj ) {
return ;
}
if ( ARR _EACH && obj . forEach && obj . forEach === ARR _EACH ) {
obj . forEach ( itr , scope ) ;
} else if ( obj . length === obj . length + 0 ) {
var key = void 0 ;
var l = void 0 ;
for ( key = 0 , l = obj . length ; key < l ; key ++ ) {
if ( key in obj && itr . call ( scope , obj [ key ] , key ) === this . BREAK ) {
return ;
}
}
} else {
for ( var _key in obj ) {
if ( itr . call ( scope , obj [ _key ] , _key ) === this . BREAK ) {
return ;
}
}
}
} ,
defer : function defer ( fnc ) {
setTimeout ( fnc , 0 ) ;
} ,
debounce : function debounce ( func , threshold , callImmediately ) {
var timeout = void 0 ;
return function ( ) {
var obj = this ;
var args = arguments ;
function delayed ( ) {
timeout = null ;
if ( ! callImmediately ) func . apply ( obj , args ) ;
}
var callNow = callImmediately || ! timeout ;
clearTimeout ( timeout ) ;
timeout = setTimeout ( delayed , threshold ) ;
if ( callNow ) {
func . apply ( obj , args ) ;
}
} ;
} ,
toArray : function toArray ( obj ) {
if ( obj . toArray ) return obj . toArray ( ) ;
return ARR _SLICE . call ( obj ) ;
} ,
isUndefined : function isUndefined ( obj ) {
return obj === undefined ;
} ,
isNull : function isNull ( obj ) {
return obj === null ;
} ,
isNaN : function ( _isNaN ) {
function isNaN ( _x ) {
return _isNaN . apply ( this , arguments ) ;
}
isNaN . toString = function ( ) {
return _isNaN . toString ( ) ;
} ;
return isNaN ;
} ( function ( obj ) {
return isNaN ( obj ) ;
} ) ,
isArray : Array . isArray || function ( obj ) {
return obj . constructor === Array ;
} ,
isObject : function isObject ( obj ) {
return obj === Object ( obj ) ;
} ,
isNumber : function isNumber ( obj ) {
return obj === obj + 0 ;
} ,
isString : function isString ( obj ) {
return obj === obj + '' ;
} ,
isBoolean : function isBoolean ( obj ) {
return obj === false || obj === true ;
} ,
isFunction : function isFunction ( obj ) {
2020-04-04 05:29:37 +00:00
return obj instanceof Function ;
2018-01-21 05:16:48 +00:00
}
} ;
var INTERPRETATIONS = [
{
litmus : Common . isString ,
conversions : {
THREE _CHAR _HEX : {
read : function read ( original ) {
var test = original . match ( /^#([A-F0-9])([A-F0-9])([A-F0-9])$/i ) ;
if ( test === null ) {
return false ;
}
return {
space : 'HEX' ,
2023-05-28 09:23:34 +00:00
hex : parseInt ( '0x' + test [ 1 ] . toString ( ) + test [ 1 ] . toString ( ) + test [ 2 ] . toString ( ) + test [ 2 ] . toString ( ) + test [ 3 ] . toString ( ) + test [ 3 ] . toString ( ) , 16 )
2018-01-21 05:16:48 +00:00
} ;
} ,
write : colorToString
} ,
SIX _CHAR _HEX : {
read : function read ( original ) {
var test = original . match ( /^#([A-F0-9]{6})$/i ) ;
if ( test === null ) {
return false ;
}
return {
space : 'HEX' ,
2023-05-28 09:23:34 +00:00
hex : parseInt ( '0x' + test [ 1 ] . toString ( ) , 16 )
2018-01-21 05:16:48 +00:00
} ;
} ,
write : colorToString
} ,
CSS _RGB : {
read : function read ( original ) {
2022-02-17 00:57:57 +00:00
var test = original . match ( /^rgb\(\s*(\S+)\s*,\s*(\S+)\s*,\s*(\S+)\s*\)/ ) ;
2018-01-21 05:16:48 +00:00
if ( test === null ) {
return false ;
}
return {
space : 'RGB' ,
r : parseFloat ( test [ 1 ] ) ,
g : parseFloat ( test [ 2 ] ) ,
b : parseFloat ( test [ 3 ] )
} ;
} ,
write : colorToString
} ,
CSS _RGBA : {
read : function read ( original ) {
2022-02-17 00:57:57 +00:00
var test = original . match ( /^rgba\(\s*(\S+)\s*,\s*(\S+)\s*,\s*(\S+)\s*,\s*(\S+)\s*\)/ ) ;
2018-01-21 05:16:48 +00:00
if ( test === null ) {
return false ;
}
return {
space : 'RGB' ,
r : parseFloat ( test [ 1 ] ) ,
g : parseFloat ( test [ 2 ] ) ,
b : parseFloat ( test [ 3 ] ) ,
a : parseFloat ( test [ 4 ] )
} ;
} ,
write : colorToString
}
}
} ,
{
litmus : Common . isNumber ,
conversions : {
HEX : {
read : function read ( original ) {
return {
space : 'HEX' ,
hex : original ,
conversionName : 'HEX'
} ;
} ,
write : function write ( color ) {
return color . hex ;
}
}
}
} ,
{
litmus : Common . isArray ,
conversions : {
RGB _ARRAY : {
read : function read ( original ) {
if ( original . length !== 3 ) {
return false ;
}
return {
space : 'RGB' ,
r : original [ 0 ] ,
g : original [ 1 ] ,
b : original [ 2 ]
} ;
} ,
write : function write ( color ) {
return [ color . r , color . g , color . b ] ;
}
} ,
RGBA _ARRAY : {
read : function read ( original ) {
if ( original . length !== 4 ) return false ;
return {
space : 'RGB' ,
r : original [ 0 ] ,
g : original [ 1 ] ,
b : original [ 2 ] ,
a : original [ 3 ]
} ;
} ,
write : function write ( color ) {
return [ color . r , color . g , color . b , color . a ] ;
}
}
}
} ,
{
litmus : Common . isObject ,
conversions : {
RGBA _OBJ : {
read : function read ( original ) {
if ( Common . isNumber ( original . r ) && Common . isNumber ( original . g ) && Common . isNumber ( original . b ) && Common . isNumber ( original . a ) ) {
return {
space : 'RGB' ,
r : original . r ,
g : original . g ,
b : original . b ,
a : original . a
} ;
}
return false ;
} ,
write : function write ( color ) {
return {
r : color . r ,
g : color . g ,
b : color . b ,
a : color . a
} ;
}
} ,
RGB _OBJ : {
read : function read ( original ) {
if ( Common . isNumber ( original . r ) && Common . isNumber ( original . g ) && Common . isNumber ( original . b ) ) {
return {
space : 'RGB' ,
r : original . r ,
g : original . g ,
b : original . b
} ;
}
return false ;
} ,
write : function write ( color ) {
return {
r : color . r ,
g : color . g ,
b : color . b
} ;
}
} ,
HSVA _OBJ : {
read : function read ( original ) {
if ( Common . isNumber ( original . h ) && Common . isNumber ( original . s ) && Common . isNumber ( original . v ) && Common . isNumber ( original . a ) ) {
return {
space : 'HSV' ,
h : original . h ,
s : original . s ,
v : original . v ,
a : original . a
} ;
}
return false ;
} ,
write : function write ( color ) {
return {
h : color . h ,
s : color . s ,
v : color . v ,
a : color . a
} ;
}
} ,
HSV _OBJ : {
read : function read ( original ) {
if ( Common . isNumber ( original . h ) && Common . isNumber ( original . s ) && Common . isNumber ( original . v ) ) {
return {
space : 'HSV' ,
h : original . h ,
s : original . s ,
v : original . v
} ;
}
return false ;
} ,
write : function write ( color ) {
return {
h : color . h ,
s : color . s ,
v : color . v
} ;
}
}
}
} ] ;
var result = void 0 ;
var toReturn = void 0 ;
var interpret = function interpret ( ) {
toReturn = false ;
var original = arguments . length > 1 ? Common . toArray ( arguments ) : arguments [ 0 ] ;
Common . each ( INTERPRETATIONS , function ( family ) {
if ( family . litmus ( original ) ) {
Common . each ( family . conversions , function ( conversion , conversionName ) {
result = conversion . read ( original ) ;
if ( toReturn === false && result !== false ) {
toReturn = result ;
result . conversionName = conversionName ;
result . conversion = conversion ;
return Common . BREAK ;
}
} ) ;
return Common . BREAK ;
}
} ) ;
return toReturn ;
} ;
var tmpComponent = void 0 ;
var ColorMath = {
hsv _to _rgb : function hsv _to _rgb ( h , s , v ) {
var hi = Math . floor ( h / 60 ) % 6 ;
var f = h / 60 - Math . floor ( h / 60 ) ;
var p = v * ( 1.0 - s ) ;
var q = v * ( 1.0 - f * s ) ;
var t = v * ( 1.0 - ( 1.0 - f ) * s ) ;
var c = [ [ v , t , p ] , [ q , v , p ] , [ p , v , t ] , [ p , q , v ] , [ t , p , v ] , [ v , p , q ] ] [ hi ] ;
return {
r : c [ 0 ] * 255 ,
g : c [ 1 ] * 255 ,
b : c [ 2 ] * 255
} ;
} ,
rgb _to _hsv : function rgb _to _hsv ( r , g , b ) {
var min = Math . min ( r , g , b ) ;
var max = Math . max ( r , g , b ) ;
var delta = max - min ;
var h = void 0 ;
var s = void 0 ;
if ( max !== 0 ) {
s = delta / max ;
} else {
return {
h : NaN ,
s : 0 ,
v : 0
} ;
}
if ( r === max ) {
h = ( g - b ) / delta ;
} else if ( g === max ) {
h = 2 + ( b - r ) / delta ;
} else {
h = 4 + ( r - g ) / delta ;
}
h /= 6 ;
if ( h < 0 ) {
h += 1 ;
}
return {
h : h * 360 ,
s : s ,
v : max / 255
} ;
} ,
rgb _to _hex : function rgb _to _hex ( r , g , b ) {
var hex = this . hex _with _component ( 0 , 2 , r ) ;
hex = this . hex _with _component ( hex , 1 , g ) ;
hex = this . hex _with _component ( hex , 0 , b ) ;
return hex ;
} ,
component _from _hex : function component _from _hex ( hex , componentIndex ) {
return hex >> componentIndex * 8 & 0xFF ;
} ,
hex _with _component : function hex _with _component ( hex , componentIndex , value ) {
return value << ( tmpComponent = componentIndex * 8 ) | hex & ~ ( 0xFF << tmpComponent ) ;
}
} ;
var _typeof = typeof Symbol === "function" && typeof Symbol . iterator === "symbol" ? function ( obj ) {
return typeof obj ;
} : function ( obj ) {
return obj && typeof Symbol === "function" && obj . constructor === Symbol && obj !== Symbol . prototype ? "symbol" : typeof obj ;
} ;
var classCallCheck = function ( instance , Constructor ) {
if ( ! ( instance instanceof Constructor ) ) {
throw new TypeError ( "Cannot call a class as a function" ) ;
}
} ;
var createClass = function ( ) {
function defineProperties ( target , props ) {
for ( var i = 0 ; i < props . length ; i ++ ) {
var descriptor = props [ i ] ;
descriptor . enumerable = descriptor . enumerable || false ;
descriptor . configurable = true ;
if ( "value" in descriptor ) descriptor . writable = true ;
Object . defineProperty ( target , descriptor . key , descriptor ) ;
}
}
return function ( Constructor , protoProps , staticProps ) {
if ( protoProps ) defineProperties ( Constructor . prototype , protoProps ) ;
if ( staticProps ) defineProperties ( Constructor , staticProps ) ;
return Constructor ;
} ;
} ( ) ;
var get = function get ( object , property , receiver ) {
if ( object === null ) object = Function . prototype ;
var desc = Object . getOwnPropertyDescriptor ( object , property ) ;
if ( desc === undefined ) {
var parent = Object . getPrototypeOf ( object ) ;
if ( parent === null ) {
return undefined ;
} else {
return get ( parent , property , receiver ) ;
}
} else if ( "value" in desc ) {
return desc . value ;
} else {
var getter = desc . get ;
if ( getter === undefined ) {
return undefined ;
}
return getter . call ( receiver ) ;
}
} ;
var inherits = function ( subClass , superClass ) {
if ( typeof superClass !== "function" && superClass !== null ) {
throw new TypeError ( "Super expression must either be null or a function, not " + typeof superClass ) ;
}
subClass . prototype = Object . create ( superClass && superClass . prototype , {
constructor : {
value : subClass ,
enumerable : false ,
writable : true ,
configurable : true
}
} ) ;
if ( superClass ) Object . setPrototypeOf ? Object . setPrototypeOf ( subClass , superClass ) : subClass . _ _proto _ _ = superClass ;
} ;
var possibleConstructorReturn = function ( self , call ) {
if ( ! self ) {
throw new ReferenceError ( "this hasn't been initialised - super() hasn't been called" ) ;
}
return call && ( typeof call === "object" || typeof call === "function" ) ? call : self ;
} ;
var Color = function ( ) {
function Color ( ) {
classCallCheck ( this , Color ) ;
this . _ _state = interpret . apply ( this , arguments ) ;
if ( this . _ _state === false ) {
throw new Error ( 'Failed to interpret color arguments' ) ;
}
this . _ _state . a = this . _ _state . a || 1 ;
}
createClass ( Color , [ {
key : 'toString' ,
value : function toString ( ) {
return colorToString ( this ) ;
}
} , {
key : 'toHexString' ,
value : function toHexString ( ) {
return colorToString ( this , true ) ;
}
} , {
key : 'toOriginal' ,
value : function toOriginal ( ) {
return this . _ _state . conversion . write ( this ) ;
}
} ] ) ;
return Color ;
} ( ) ;
function defineRGBComponent ( target , component , componentHexIndex ) {
Object . defineProperty ( target , component , {
2023-05-28 09:23:34 +00:00
get : function get ( ) {
2018-01-21 05:16:48 +00:00
if ( this . _ _state . space === 'RGB' ) {
return this . _ _state [ component ] ;
}
Color . recalculateRGB ( this , component , componentHexIndex ) ;
return this . _ _state [ component ] ;
} ,
2023-05-28 09:23:34 +00:00
set : function set ( v ) {
2018-01-21 05:16:48 +00:00
if ( this . _ _state . space !== 'RGB' ) {
Color . recalculateRGB ( this , component , componentHexIndex ) ;
this . _ _state . space = 'RGB' ;
}
this . _ _state [ component ] = v ;
}
} ) ;
}
function defineHSVComponent ( target , component ) {
Object . defineProperty ( target , component , {
2023-05-28 09:23:34 +00:00
get : function get ( ) {
2018-01-21 05:16:48 +00:00
if ( this . _ _state . space === 'HSV' ) {
return this . _ _state [ component ] ;
}
Color . recalculateHSV ( this ) ;
return this . _ _state [ component ] ;
} ,
2023-05-28 09:23:34 +00:00
set : function set ( v ) {
2018-01-21 05:16:48 +00:00
if ( this . _ _state . space !== 'HSV' ) {
Color . recalculateHSV ( this ) ;
this . _ _state . space = 'HSV' ;
}
this . _ _state [ component ] = v ;
}
} ) ;
}
Color . recalculateRGB = function ( color , component , componentHexIndex ) {
if ( color . _ _state . space === 'HEX' ) {
color . _ _state [ component ] = ColorMath . component _from _hex ( color . _ _state . hex , componentHexIndex ) ;
} else if ( color . _ _state . space === 'HSV' ) {
Common . extend ( color . _ _state , ColorMath . hsv _to _rgb ( color . _ _state . h , color . _ _state . s , color . _ _state . v ) ) ;
} else {
throw new Error ( 'Corrupted color state' ) ;
}
} ;
Color . recalculateHSV = function ( color ) {
var result = ColorMath . rgb _to _hsv ( color . r , color . g , color . b ) ;
Common . extend ( color . _ _state , {
s : result . s ,
v : result . v
} ) ;
if ( ! Common . isNaN ( result . h ) ) {
color . _ _state . h = result . h ;
} else if ( Common . isUndefined ( color . _ _state . h ) ) {
color . _ _state . h = 0 ;
}
} ;
Color . COMPONENTS = [ 'r' , 'g' , 'b' , 'h' , 's' , 'v' , 'hex' , 'a' ] ;
defineRGBComponent ( Color . prototype , 'r' , 2 ) ;
defineRGBComponent ( Color . prototype , 'g' , 1 ) ;
defineRGBComponent ( Color . prototype , 'b' , 0 ) ;
defineHSVComponent ( Color . prototype , 'h' ) ;
defineHSVComponent ( Color . prototype , 's' ) ;
defineHSVComponent ( Color . prototype , 'v' ) ;
Object . defineProperty ( Color . prototype , 'a' , {
2023-05-28 09:23:34 +00:00
get : function get ( ) {
2018-01-21 05:16:48 +00:00
return this . _ _state . a ;
} ,
2023-05-28 09:23:34 +00:00
set : function set ( v ) {
2018-01-21 05:16:48 +00:00
this . _ _state . a = v ;
}
} ) ;
Object . defineProperty ( Color . prototype , 'hex' , {
2023-05-28 09:23:34 +00:00
get : function get ( ) {
2020-04-04 05:29:37 +00:00
if ( this . _ _state . space !== 'HEX' ) {
2018-01-21 05:16:48 +00:00
this . _ _state . hex = ColorMath . rgb _to _hex ( this . r , this . g , this . b ) ;
2020-04-04 05:29:37 +00:00
this . _ _state . space = 'HEX' ;
2018-01-21 05:16:48 +00:00
}
return this . _ _state . hex ;
} ,
2023-05-28 09:23:34 +00:00
set : function set ( v ) {
2018-01-21 05:16:48 +00:00
this . _ _state . space = 'HEX' ;
this . _ _state . hex = v ;
}
} ) ;
var Controller = function ( ) {
function Controller ( object , property ) {
classCallCheck ( this , Controller ) ;
this . initialValue = object [ property ] ;
this . domElement = document . createElement ( 'div' ) ;
this . object = object ;
this . property = property ;
this . _ _onChange = undefined ;
this . _ _onFinishChange = undefined ;
}
createClass ( Controller , [ {
key : 'onChange' ,
value : function onChange ( fnc ) {
this . _ _onChange = fnc ;
return this ;
}
} , {
key : 'onFinishChange' ,
value : function onFinishChange ( fnc ) {
this . _ _onFinishChange = fnc ;
return this ;
}
} , {
key : 'setValue' ,
value : function setValue ( newValue ) {
this . object [ this . property ] = newValue ;
if ( this . _ _onChange ) {
this . _ _onChange . call ( this , newValue ) ;
}
this . updateDisplay ( ) ;
return this ;
}
} , {
key : 'getValue' ,
value : function getValue ( ) {
return this . object [ this . property ] ;
}
} , {
key : 'updateDisplay' ,
value : function updateDisplay ( ) {
return this ;
}
} , {
key : 'isModified' ,
value : function isModified ( ) {
return this . initialValue !== this . getValue ( ) ;
}
} ] ) ;
return Controller ;
} ( ) ;
var EVENT _MAP = {
HTMLEvents : [ 'change' ] ,
MouseEvents : [ 'click' , 'mousemove' , 'mousedown' , 'mouseup' , 'mouseover' ] ,
KeyboardEvents : [ 'keydown' ]
} ;
var EVENT _MAP _INV = { } ;
Common . each ( EVENT _MAP , function ( v , k ) {
Common . each ( v , function ( e ) {
EVENT _MAP _INV [ e ] = k ;
} ) ;
} ) ;
var CSS _VALUE _PIXELS = /(\d+(\.\d+)?)px/ ;
function cssValueToPixels ( val ) {
if ( val === '0' || Common . isUndefined ( val ) ) {
return 0 ;
}
var match = val . match ( CSS _VALUE _PIXELS ) ;
if ( ! Common . isNull ( match ) ) {
return parseFloat ( match [ 1 ] ) ;
}
return 0 ;
}
2023-05-28 09:23:34 +00:00
var dom$1 = {
2018-01-21 05:16:48 +00:00
makeSelectable : function makeSelectable ( elem , selectable ) {
if ( elem === undefined || elem . style === undefined ) return ;
elem . onselectstart = selectable ? function ( ) {
return false ;
} : function ( ) { } ;
elem . style . MozUserSelect = selectable ? 'auto' : 'none' ;
elem . style . KhtmlUserSelect = selectable ? 'auto' : 'none' ;
elem . unselectable = selectable ? 'on' : 'off' ;
} ,
makeFullscreen : function makeFullscreen ( elem , hor , vert ) {
var vertical = vert ;
var horizontal = hor ;
if ( Common . isUndefined ( horizontal ) ) {
horizontal = true ;
}
if ( Common . isUndefined ( vertical ) ) {
vertical = true ;
}
elem . style . position = 'absolute' ;
if ( horizontal ) {
elem . style . left = 0 ;
elem . style . right = 0 ;
}
if ( vertical ) {
elem . style . top = 0 ;
elem . style . bottom = 0 ;
}
} ,
fakeEvent : function fakeEvent ( elem , eventType , pars , aux ) {
var params = pars || { } ;
var className = EVENT _MAP _INV [ eventType ] ;
if ( ! className ) {
throw new Error ( 'Event type ' + eventType + ' not supported.' ) ;
}
var evt = document . createEvent ( className ) ;
switch ( className ) {
case 'MouseEvents' :
{
var clientX = params . x || params . clientX || 0 ;
var clientY = params . y || params . clientY || 0 ;
evt . initMouseEvent ( eventType , params . bubbles || false , params . cancelable || true , window , params . clickCount || 1 , 0 ,
0 ,
clientX ,
clientY ,
false , false , false , false , 0 , null ) ;
break ;
}
case 'KeyboardEvents' :
{
var init = evt . initKeyboardEvent || evt . initKeyEvent ;
Common . defaults ( params , {
cancelable : true ,
ctrlKey : false ,
altKey : false ,
shiftKey : false ,
metaKey : false ,
keyCode : undefined ,
charCode : undefined
} ) ;
init ( eventType , params . bubbles || false , params . cancelable , window , params . ctrlKey , params . altKey , params . shiftKey , params . metaKey , params . keyCode , params . charCode ) ;
break ;
}
default :
{
evt . initEvent ( eventType , params . bubbles || false , params . cancelable || true ) ;
break ;
}
}
Common . defaults ( evt , aux ) ;
elem . dispatchEvent ( evt ) ;
} ,
bind : function bind ( elem , event , func , newBool ) {
var bool = newBool || false ;
if ( elem . addEventListener ) {
elem . addEventListener ( event , func , bool ) ;
} else if ( elem . attachEvent ) {
elem . attachEvent ( 'on' + event , func ) ;
}
2023-05-28 09:23:34 +00:00
return dom$1 ;
2018-01-21 05:16:48 +00:00
} ,
unbind : function unbind ( elem , event , func , newBool ) {
var bool = newBool || false ;
if ( elem . removeEventListener ) {
elem . removeEventListener ( event , func , bool ) ;
} else if ( elem . detachEvent ) {
elem . detachEvent ( 'on' + event , func ) ;
}
2023-05-28 09:23:34 +00:00
return dom$1 ;
2018-01-21 05:16:48 +00:00
} ,
addClass : function addClass ( elem , className ) {
if ( elem . className === undefined ) {
elem . className = className ;
} else if ( elem . className !== className ) {
var classes = elem . className . split ( / +/ ) ;
if ( classes . indexOf ( className ) === - 1 ) {
classes . push ( className ) ;
elem . className = classes . join ( ' ' ) . replace ( /^\s+/ , '' ) . replace ( /\s+$/ , '' ) ;
}
}
2023-05-28 09:23:34 +00:00
return dom$1 ;
2018-01-21 05:16:48 +00:00
} ,
removeClass : function removeClass ( elem , className ) {
if ( className ) {
if ( elem . className === className ) {
elem . removeAttribute ( 'class' ) ;
} else {
var classes = elem . className . split ( / +/ ) ;
var index = classes . indexOf ( className ) ;
if ( index !== - 1 ) {
classes . splice ( index , 1 ) ;
elem . className = classes . join ( ' ' ) ;
}
}
} else {
elem . className = undefined ;
}
2023-05-28 09:23:34 +00:00
return dom$1 ;
2018-01-21 05:16:48 +00:00
} ,
hasClass : function hasClass ( elem , className ) {
return new RegExp ( '(?:^|\\s+)' + className + '(?:\\s+|$)' ) . test ( elem . className ) || false ;
} ,
getWidth : function getWidth ( elem ) {
var style = getComputedStyle ( elem ) ;
return cssValueToPixels ( style [ 'border-left-width' ] ) + cssValueToPixels ( style [ 'border-right-width' ] ) + cssValueToPixels ( style [ 'padding-left' ] ) + cssValueToPixels ( style [ 'padding-right' ] ) + cssValueToPixels ( style . width ) ;
} ,
getHeight : function getHeight ( elem ) {
var style = getComputedStyle ( elem ) ;
return cssValueToPixels ( style [ 'border-top-width' ] ) + cssValueToPixels ( style [ 'border-bottom-width' ] ) + cssValueToPixels ( style [ 'padding-top' ] ) + cssValueToPixels ( style [ 'padding-bottom' ] ) + cssValueToPixels ( style . height ) ;
} ,
getOffset : function getOffset ( el ) {
var elem = el ;
var offset = { left : 0 , top : 0 } ;
if ( elem . offsetParent ) {
do {
offset . left += elem . offsetLeft ;
offset . top += elem . offsetTop ;
elem = elem . offsetParent ;
} while ( elem ) ;
}
return offset ;
} ,
isActive : function isActive ( elem ) {
return elem === document . activeElement && ( elem . type || elem . href ) ;
}
} ;
var BooleanController = function ( _Controller ) {
inherits ( BooleanController , _Controller ) ;
function BooleanController ( object , property ) {
classCallCheck ( this , BooleanController ) ;
var _this2 = possibleConstructorReturn ( this , ( BooleanController . _ _proto _ _ || Object . getPrototypeOf ( BooleanController ) ) . call ( this , object , property ) ) ;
var _this = _this2 ;
_this2 . _ _prev = _this2 . getValue ( ) ;
_this2 . _ _checkbox = document . createElement ( 'input' ) ;
_this2 . _ _checkbox . setAttribute ( 'type' , 'checkbox' ) ;
function onChange ( ) {
_this . setValue ( ! _this . _ _prev ) ;
}
2023-05-28 09:23:34 +00:00
dom$1 . bind ( _this2 . _ _checkbox , 'change' , onChange , false ) ;
2018-01-21 05:16:48 +00:00
_this2 . domElement . appendChild ( _this2 . _ _checkbox ) ;
_this2 . updateDisplay ( ) ;
return _this2 ;
}
createClass ( BooleanController , [ {
key : 'setValue' ,
value : function setValue ( v ) {
var toReturn = get ( BooleanController . prototype . _ _proto _ _ || Object . getPrototypeOf ( BooleanController . prototype ) , 'setValue' , this ) . call ( this , v ) ;
if ( this . _ _onFinishChange ) {
this . _ _onFinishChange . call ( this , this . getValue ( ) ) ;
}
this . _ _prev = this . getValue ( ) ;
return toReturn ;
}
} , {
key : 'updateDisplay' ,
value : function updateDisplay ( ) {
if ( this . getValue ( ) === true ) {
this . _ _checkbox . setAttribute ( 'checked' , 'checked' ) ;
this . _ _checkbox . checked = true ;
this . _ _prev = true ;
} else {
this . _ _checkbox . checked = false ;
this . _ _prev = false ;
}
return get ( BooleanController . prototype . _ _proto _ _ || Object . getPrototypeOf ( BooleanController . prototype ) , 'updateDisplay' , this ) . call ( this ) ;
}
} ] ) ;
return BooleanController ;
} ( Controller ) ;
var OptionController = function ( _Controller ) {
inherits ( OptionController , _Controller ) ;
function OptionController ( object , property , opts ) {
classCallCheck ( this , OptionController ) ;
var _this2 = possibleConstructorReturn ( this , ( OptionController . _ _proto _ _ || Object . getPrototypeOf ( OptionController ) ) . call ( this , object , property ) ) ;
var options = opts ;
var _this = _this2 ;
_this2 . _ _select = document . createElement ( 'select' ) ;
if ( Common . isArray ( options ) ) {
var map = { } ;
Common . each ( options , function ( element ) {
map [ element ] = element ;
} ) ;
options = map ;
}
Common . each ( options , function ( value , key ) {
var opt = document . createElement ( 'option' ) ;
opt . innerHTML = key ;
opt . setAttribute ( 'value' , value ) ;
_this . _ _select . appendChild ( opt ) ;
} ) ;
_this2 . updateDisplay ( ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( _this2 . _ _select , 'change' , function ( ) {
2018-01-21 05:16:48 +00:00
var desiredValue = this . options [ this . selectedIndex ] . value ;
_this . setValue ( desiredValue ) ;
} ) ;
_this2 . domElement . appendChild ( _this2 . _ _select ) ;
return _this2 ;
}
createClass ( OptionController , [ {
key : 'setValue' ,
value : function setValue ( v ) {
var toReturn = get ( OptionController . prototype . _ _proto _ _ || Object . getPrototypeOf ( OptionController . prototype ) , 'setValue' , this ) . call ( this , v ) ;
if ( this . _ _onFinishChange ) {
this . _ _onFinishChange . call ( this , this . getValue ( ) ) ;
}
return toReturn ;
}
} , {
key : 'updateDisplay' ,
value : function updateDisplay ( ) {
2023-05-28 09:23:34 +00:00
if ( dom$1 . isActive ( this . _ _select ) ) return this ;
2018-01-21 05:16:48 +00:00
this . _ _select . value = this . getValue ( ) ;
return get ( OptionController . prototype . _ _proto _ _ || Object . getPrototypeOf ( OptionController . prototype ) , 'updateDisplay' , this ) . call ( this ) ;
}
} ] ) ;
return OptionController ;
} ( Controller ) ;
var StringController = function ( _Controller ) {
inherits ( StringController , _Controller ) ;
function StringController ( object , property ) {
classCallCheck ( this , StringController ) ;
var _this2 = possibleConstructorReturn ( this , ( StringController . _ _proto _ _ || Object . getPrototypeOf ( StringController ) ) . call ( this , object , property ) ) ;
var _this = _this2 ;
function onChange ( ) {
_this . setValue ( _this . _ _input . value ) ;
}
function onBlur ( ) {
if ( _this . _ _onFinishChange ) {
_this . _ _onFinishChange . call ( _this , _this . getValue ( ) ) ;
}
}
_this2 . _ _input = document . createElement ( 'input' ) ;
_this2 . _ _input . setAttribute ( 'type' , 'text' ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( _this2 . _ _input , 'keyup' , onChange ) ;
dom$1 . bind ( _this2 . _ _input , 'change' , onChange ) ;
dom$1 . bind ( _this2 . _ _input , 'blur' , onBlur ) ;
dom$1 . bind ( _this2 . _ _input , 'keydown' , function ( e ) {
2018-01-21 05:16:48 +00:00
if ( e . keyCode === 13 ) {
this . blur ( ) ;
}
} ) ;
_this2 . updateDisplay ( ) ;
_this2 . domElement . appendChild ( _this2 . _ _input ) ;
return _this2 ;
}
createClass ( StringController , [ {
key : 'updateDisplay' ,
value : function updateDisplay ( ) {
2023-05-28 09:23:34 +00:00
if ( ! dom$1 . isActive ( this . _ _input ) ) {
2018-01-21 05:16:48 +00:00
this . _ _input . value = this . getValue ( ) ;
}
return get ( StringController . prototype . _ _proto _ _ || Object . getPrototypeOf ( StringController . prototype ) , 'updateDisplay' , this ) . call ( this ) ;
}
} ] ) ;
return StringController ;
} ( Controller ) ;
function numDecimals ( x ) {
var _x = x . toString ( ) ;
if ( _x . indexOf ( '.' ) > - 1 ) {
return _x . length - _x . indexOf ( '.' ) - 1 ;
}
return 0 ;
}
var NumberController = function ( _Controller ) {
inherits ( NumberController , _Controller ) ;
function NumberController ( object , property , params ) {
classCallCheck ( this , NumberController ) ;
var _this = possibleConstructorReturn ( this , ( NumberController . _ _proto _ _ || Object . getPrototypeOf ( NumberController ) ) . call ( this , object , property ) ) ;
var _params = params || { } ;
_this . _ _min = _params . min ;
_this . _ _max = _params . max ;
_this . _ _step = _params . step ;
if ( Common . isUndefined ( _this . _ _step ) ) {
if ( _this . initialValue === 0 ) {
_this . _ _impliedStep = 1 ;
} else {
_this . _ _impliedStep = Math . pow ( 10 , Math . floor ( Math . log ( Math . abs ( _this . initialValue ) ) / Math . LN10 ) ) / 10 ;
}
} else {
_this . _ _impliedStep = _this . _ _step ;
}
_this . _ _precision = numDecimals ( _this . _ _impliedStep ) ;
return _this ;
}
createClass ( NumberController , [ {
key : 'setValue' ,
value : function setValue ( v ) {
var _v = v ;
if ( this . _ _min !== undefined && _v < this . _ _min ) {
_v = this . _ _min ;
} else if ( this . _ _max !== undefined && _v > this . _ _max ) {
_v = this . _ _max ;
}
if ( this . _ _step !== undefined && _v % this . _ _step !== 0 ) {
_v = Math . round ( _v / this . _ _step ) * this . _ _step ;
}
return get ( NumberController . prototype . _ _proto _ _ || Object . getPrototypeOf ( NumberController . prototype ) , 'setValue' , this ) . call ( this , _v ) ;
}
} , {
key : 'min' ,
value : function min ( minValue ) {
this . _ _min = minValue ;
return this ;
}
} , {
key : 'max' ,
value : function max ( maxValue ) {
this . _ _max = maxValue ;
return this ;
}
} , {
key : 'step' ,
value : function step ( stepValue ) {
this . _ _step = stepValue ;
this . _ _impliedStep = stepValue ;
this . _ _precision = numDecimals ( stepValue ) ;
return this ;
}
} ] ) ;
return NumberController ;
} ( Controller ) ;
function roundToDecimal ( value , decimals ) {
var tenTo = Math . pow ( 10 , decimals ) ;
return Math . round ( value * tenTo ) / tenTo ;
}
var NumberControllerBox = function ( _NumberController ) {
inherits ( NumberControllerBox , _NumberController ) ;
function NumberControllerBox ( object , property , params ) {
classCallCheck ( this , NumberControllerBox ) ;
var _this2 = possibleConstructorReturn ( this , ( NumberControllerBox . _ _proto _ _ || Object . getPrototypeOf ( NumberControllerBox ) ) . call ( this , object , property , params ) ) ;
_this2 . _ _truncationSuspended = false ;
var _this = _this2 ;
var prevY = void 0 ;
function onChange ( ) {
var attempted = parseFloat ( _this . _ _input . value ) ;
if ( ! Common . isNaN ( attempted ) ) {
_this . setValue ( attempted ) ;
}
}
function onFinish ( ) {
if ( _this . _ _onFinishChange ) {
_this . _ _onFinishChange . call ( _this , _this . getValue ( ) ) ;
}
}
function onBlur ( ) {
onFinish ( ) ;
}
function onMouseDrag ( e ) {
var diff = prevY - e . clientY ;
_this . setValue ( _this . getValue ( ) + diff * _this . _ _impliedStep ) ;
prevY = e . clientY ;
}
function onMouseUp ( ) {
2023-05-28 09:23:34 +00:00
dom$1 . unbind ( window , 'mousemove' , onMouseDrag ) ;
dom$1 . unbind ( window , 'mouseup' , onMouseUp ) ;
2018-01-21 05:16:48 +00:00
onFinish ( ) ;
}
function onMouseDown ( e ) {
2023-05-28 09:23:34 +00:00
dom$1 . bind ( window , 'mousemove' , onMouseDrag ) ;
dom$1 . bind ( window , 'mouseup' , onMouseUp ) ;
2018-01-21 05:16:48 +00:00
prevY = e . clientY ;
}
_this2 . _ _input = document . createElement ( 'input' ) ;
_this2 . _ _input . setAttribute ( 'type' , 'text' ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( _this2 . _ _input , 'change' , onChange ) ;
dom$1 . bind ( _this2 . _ _input , 'blur' , onBlur ) ;
dom$1 . bind ( _this2 . _ _input , 'mousedown' , onMouseDown ) ;
dom$1 . bind ( _this2 . _ _input , 'keydown' , function ( e ) {
2018-01-21 05:16:48 +00:00
if ( e . keyCode === 13 ) {
_this . _ _truncationSuspended = true ;
this . blur ( ) ;
_this . _ _truncationSuspended = false ;
onFinish ( ) ;
}
} ) ;
_this2 . updateDisplay ( ) ;
_this2 . domElement . appendChild ( _this2 . _ _input ) ;
return _this2 ;
}
createClass ( NumberControllerBox , [ {
key : 'updateDisplay' ,
value : function updateDisplay ( ) {
this . _ _input . value = this . _ _truncationSuspended ? this . getValue ( ) : roundToDecimal ( this . getValue ( ) , this . _ _precision ) ;
return get ( NumberControllerBox . prototype . _ _proto _ _ || Object . getPrototypeOf ( NumberControllerBox . prototype ) , 'updateDisplay' , this ) . call ( this ) ;
}
} ] ) ;
return NumberControllerBox ;
} ( NumberController ) ;
function map ( v , i1 , i2 , o1 , o2 ) {
return o1 + ( o2 - o1 ) * ( ( v - i1 ) / ( i2 - i1 ) ) ;
}
var NumberControllerSlider = function ( _NumberController ) {
inherits ( NumberControllerSlider , _NumberController ) ;
function NumberControllerSlider ( object , property , min , max , step ) {
classCallCheck ( this , NumberControllerSlider ) ;
var _this2 = possibleConstructorReturn ( this , ( NumberControllerSlider . _ _proto _ _ || Object . getPrototypeOf ( NumberControllerSlider ) ) . call ( this , object , property , { min : min , max : max , step : step } ) ) ;
var _this = _this2 ;
_this2 . _ _background = document . createElement ( 'div' ) ;
_this2 . _ _foreground = document . createElement ( 'div' ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( _this2 . _ _background , 'mousedown' , onMouseDown ) ;
dom$1 . bind ( _this2 . _ _background , 'touchstart' , onTouchStart ) ;
dom$1 . addClass ( _this2 . _ _background , 'slider' ) ;
dom$1 . addClass ( _this2 . _ _foreground , 'slider-fg' ) ;
2018-01-21 05:16:48 +00:00
function onMouseDown ( e ) {
document . activeElement . blur ( ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( window , 'mousemove' , onMouseDrag ) ;
dom$1 . bind ( window , 'mouseup' , onMouseUp ) ;
2018-01-21 05:16:48 +00:00
onMouseDrag ( e ) ;
}
function onMouseDrag ( e ) {
e . preventDefault ( ) ;
var bgRect = _this . _ _background . getBoundingClientRect ( ) ;
_this . setValue ( map ( e . clientX , bgRect . left , bgRect . right , _this . _ _min , _this . _ _max ) ) ;
return false ;
}
function onMouseUp ( ) {
2023-05-28 09:23:34 +00:00
dom$1 . unbind ( window , 'mousemove' , onMouseDrag ) ;
dom$1 . unbind ( window , 'mouseup' , onMouseUp ) ;
2018-01-21 05:16:48 +00:00
if ( _this . _ _onFinishChange ) {
_this . _ _onFinishChange . call ( _this , _this . getValue ( ) ) ;
}
}
function onTouchStart ( e ) {
if ( e . touches . length !== 1 ) {
return ;
}
2023-05-28 09:23:34 +00:00
dom$1 . bind ( window , 'touchmove' , onTouchMove ) ;
dom$1 . bind ( window , 'touchend' , onTouchEnd ) ;
2018-01-21 05:16:48 +00:00
onTouchMove ( e ) ;
}
function onTouchMove ( e ) {
var clientX = e . touches [ 0 ] . clientX ;
var bgRect = _this . _ _background . getBoundingClientRect ( ) ;
_this . setValue ( map ( clientX , bgRect . left , bgRect . right , _this . _ _min , _this . _ _max ) ) ;
}
function onTouchEnd ( ) {
2023-05-28 09:23:34 +00:00
dom$1 . unbind ( window , 'touchmove' , onTouchMove ) ;
dom$1 . unbind ( window , 'touchend' , onTouchEnd ) ;
2018-01-21 05:16:48 +00:00
if ( _this . _ _onFinishChange ) {
_this . _ _onFinishChange . call ( _this , _this . getValue ( ) ) ;
}
}
_this2 . updateDisplay ( ) ;
_this2 . _ _background . appendChild ( _this2 . _ _foreground ) ;
_this2 . domElement . appendChild ( _this2 . _ _background ) ;
return _this2 ;
}
createClass ( NumberControllerSlider , [ {
key : 'updateDisplay' ,
value : function updateDisplay ( ) {
var pct = ( this . getValue ( ) - this . _ _min ) / ( this . _ _max - this . _ _min ) ;
this . _ _foreground . style . width = pct * 100 + '%' ;
return get ( NumberControllerSlider . prototype . _ _proto _ _ || Object . getPrototypeOf ( NumberControllerSlider . prototype ) , 'updateDisplay' , this ) . call ( this ) ;
}
} ] ) ;
return NumberControllerSlider ;
} ( NumberController ) ;
var FunctionController = function ( _Controller ) {
inherits ( FunctionController , _Controller ) ;
function FunctionController ( object , property , text ) {
classCallCheck ( this , FunctionController ) ;
var _this2 = possibleConstructorReturn ( this , ( FunctionController . _ _proto _ _ || Object . getPrototypeOf ( FunctionController ) ) . call ( this , object , property ) ) ;
var _this = _this2 ;
_this2 . _ _button = document . createElement ( 'div' ) ;
_this2 . _ _button . innerHTML = text === undefined ? 'Fire' : text ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( _this2 . _ _button , 'click' , function ( e ) {
2018-01-21 05:16:48 +00:00
e . preventDefault ( ) ;
_this . fire ( ) ;
return false ;
} ) ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( _this2 . _ _button , 'button' ) ;
2018-01-21 05:16:48 +00:00
_this2 . domElement . appendChild ( _this2 . _ _button ) ;
return _this2 ;
}
createClass ( FunctionController , [ {
key : 'fire' ,
value : function fire ( ) {
if ( this . _ _onChange ) {
this . _ _onChange . call ( this ) ;
}
this . getValue ( ) . call ( this . object ) ;
if ( this . _ _onFinishChange ) {
this . _ _onFinishChange . call ( this , this . getValue ( ) ) ;
}
}
} ] ) ;
return FunctionController ;
} ( Controller ) ;
var ColorController = function ( _Controller ) {
2018-05-04 00:56:17 +00:00
inherits ( ColorController , _Controller ) ;
function ColorController ( object , property ) {
classCallCheck ( this , ColorController ) ;
var _this2 = possibleConstructorReturn ( this , ( ColorController . _ _proto _ _ || Object . getPrototypeOf ( ColorController ) ) . call ( this , object , property ) ) ;
_this2 . _ _color = new Color ( _this2 . getValue ( ) ) ;
_this2 . _ _temp = new Color ( 0 ) ;
var _this = _this2 ;
_this2 . domElement = document . createElement ( 'div' ) ;
2023-05-28 09:23:34 +00:00
dom$1 . makeSelectable ( _this2 . domElement , false ) ;
2018-05-04 00:56:17 +00:00
_this2 . _ _selector = document . createElement ( 'div' ) ;
_this2 . _ _selector . className = 'selector' ;
_this2 . _ _saturation _field = document . createElement ( 'div' ) ;
_this2 . _ _saturation _field . className = 'saturation-field' ;
_this2 . _ _field _knob = document . createElement ( 'div' ) ;
_this2 . _ _field _knob . className = 'field-knob' ;
_this2 . _ _field _knob _border = '2px solid ' ;
_this2 . _ _hue _knob = document . createElement ( 'div' ) ;
_this2 . _ _hue _knob . className = 'hue-knob' ;
_this2 . _ _hue _field = document . createElement ( 'div' ) ;
_this2 . _ _hue _field . className = 'hue-field' ;
_this2 . _ _input = document . createElement ( 'input' ) ;
_this2 . _ _input . type = 'text' ;
_this2 . _ _input _textShadow = '0 1px 1px ' ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( _this2 . _ _input , 'keydown' , function ( e ) {
2018-05-04 00:56:17 +00:00
if ( e . keyCode === 13 ) {
onBlur . call ( this ) ;
}
} ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( _this2 . _ _input , 'blur' , onBlur ) ;
dom$1 . bind ( _this2 . _ _selector , 'mousedown' , function ( ) {
dom$1 . addClass ( this , 'drag' ) . bind ( window , 'mouseup' , function ( ) {
dom$1 . removeClass ( _this . _ _selector , 'drag' ) ;
2018-05-04 00:56:17 +00:00
} ) ;
} ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( _this2 . _ _selector , 'touchstart' , function ( ) {
dom$1 . addClass ( this , 'drag' ) . bind ( window , 'touchend' , function ( ) {
dom$1 . removeClass ( _this . _ _selector , 'drag' ) ;
2018-05-04 00:56:17 +00:00
} ) ;
} ) ;
var valueField = document . createElement ( 'div' ) ;
Common . extend ( _this2 . _ _selector . style , {
width : '122px' ,
height : '102px' ,
padding : '3px' ,
backgroundColor : '#222' ,
boxShadow : '0px 1px 3px rgba(0,0,0,0.3)'
} ) ;
Common . extend ( _this2 . _ _field _knob . style , {
position : 'absolute' ,
width : '12px' ,
height : '12px' ,
border : _this2 . _ _field _knob _border + ( _this2 . _ _color . v < 0.5 ? '#fff' : '#000' ) ,
boxShadow : '0px 1px 3px rgba(0,0,0,0.5)' ,
borderRadius : '12px' ,
zIndex : 1
} ) ;
Common . extend ( _this2 . _ _hue _knob . style , {
position : 'absolute' ,
width : '15px' ,
height : '2px' ,
borderRight : '4px solid #fff' ,
zIndex : 1
} ) ;
Common . extend ( _this2 . _ _saturation _field . style , {
width : '100px' ,
height : '100px' ,
border : '1px solid #555' ,
marginRight : '3px' ,
display : 'inline-block' ,
cursor : 'pointer'
} ) ;
Common . extend ( valueField . style , {
width : '100%' ,
height : '100%' ,
background : 'none'
} ) ;
linearGradient ( valueField , 'top' , 'rgba(0,0,0,0)' , '#000' ) ;
Common . extend ( _this2 . _ _hue _field . style , {
width : '15px' ,
height : '100px' ,
border : '1px solid #555' ,
cursor : 'ns-resize' ,
position : 'absolute' ,
top : '3px' ,
right : '3px'
} ) ;
hueGradient ( _this2 . _ _hue _field ) ;
Common . extend ( _this2 . _ _input . style , {
outline : 'none' ,
textAlign : 'center' ,
color : '#fff' ,
border : 0 ,
fontWeight : 'bold' ,
textShadow : _this2 . _ _input _textShadow + 'rgba(0,0,0,0.7)'
} ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( _this2 . _ _saturation _field , 'mousedown' , fieldDown ) ;
dom$1 . bind ( _this2 . _ _saturation _field , 'touchstart' , fieldDown ) ;
dom$1 . bind ( _this2 . _ _field _knob , 'mousedown' , fieldDown ) ;
dom$1 . bind ( _this2 . _ _field _knob , 'touchstart' , fieldDown ) ;
dom$1 . bind ( _this2 . _ _hue _field , 'mousedown' , fieldDownH ) ;
dom$1 . bind ( _this2 . _ _hue _field , 'touchstart' , fieldDownH ) ;
2018-05-04 00:56:17 +00:00
function fieldDown ( e ) {
setSV ( e ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( window , 'mousemove' , setSV ) ;
dom$1 . bind ( window , 'touchmove' , setSV ) ;
dom$1 . bind ( window , 'mouseup' , fieldUpSV ) ;
dom$1 . bind ( window , 'touchend' , fieldUpSV ) ;
2018-05-04 00:56:17 +00:00
}
function fieldDownH ( e ) {
setH ( e ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( window , 'mousemove' , setH ) ;
dom$1 . bind ( window , 'touchmove' , setH ) ;
dom$1 . bind ( window , 'mouseup' , fieldUpH ) ;
dom$1 . bind ( window , 'touchend' , fieldUpH ) ;
2018-05-04 00:56:17 +00:00
}
function fieldUpSV ( ) {
2023-05-28 09:23:34 +00:00
dom$1 . unbind ( window , 'mousemove' , setSV ) ;
dom$1 . unbind ( window , 'touchmove' , setSV ) ;
dom$1 . unbind ( window , 'mouseup' , fieldUpSV ) ;
dom$1 . unbind ( window , 'touchend' , fieldUpSV ) ;
2018-05-04 00:56:17 +00:00
onFinish ( ) ;
}
function fieldUpH ( ) {
2023-05-28 09:23:34 +00:00
dom$1 . unbind ( window , 'mousemove' , setH ) ;
dom$1 . unbind ( window , 'touchmove' , setH ) ;
dom$1 . unbind ( window , 'mouseup' , fieldUpH ) ;
dom$1 . unbind ( window , 'touchend' , fieldUpH ) ;
2018-05-04 00:56:17 +00:00
onFinish ( ) ;
}
function onBlur ( ) {
var i = interpret ( this . value ) ;
if ( i !== false ) {
_this . _ _color . _ _state = i ;
_this . setValue ( _this . _ _color . toOriginal ( ) ) ;
} else {
this . value = _this . _ _color . toString ( ) ;
}
}
function onFinish ( ) {
if ( _this . _ _onFinishChange ) {
_this . _ _onFinishChange . call ( _this , _this . _ _color . toOriginal ( ) ) ;
}
}
_this2 . _ _saturation _field . appendChild ( valueField ) ;
_this2 . _ _selector . appendChild ( _this2 . _ _field _knob ) ;
_this2 . _ _selector . appendChild ( _this2 . _ _saturation _field ) ;
_this2 . _ _selector . appendChild ( _this2 . _ _hue _field ) ;
_this2 . _ _hue _field . appendChild ( _this2 . _ _hue _knob ) ;
_this2 . domElement . appendChild ( _this2 . _ _input ) ;
_this2 . domElement . appendChild ( _this2 . _ _selector ) ;
_this2 . updateDisplay ( ) ;
function setSV ( e ) {
if ( e . type . indexOf ( 'touch' ) === - 1 ) {
e . preventDefault ( ) ;
}
var fieldRect = _this . _ _saturation _field . getBoundingClientRect ( ) ;
var _ref = e . touches && e . touches [ 0 ] || e ,
clientX = _ref . clientX ,
clientY = _ref . clientY ;
var s = ( clientX - fieldRect . left ) / ( fieldRect . right - fieldRect . left ) ;
var v = 1 - ( clientY - fieldRect . top ) / ( fieldRect . bottom - fieldRect . top ) ;
if ( v > 1 ) {
v = 1 ;
} else if ( v < 0 ) {
v = 0 ;
}
if ( s > 1 ) {
s = 1 ;
} else if ( s < 0 ) {
s = 0 ;
}
_this . _ _color . v = v ;
_this . _ _color . s = s ;
_this . setValue ( _this . _ _color . toOriginal ( ) ) ;
return false ;
}
function setH ( e ) {
if ( e . type . indexOf ( 'touch' ) === - 1 ) {
e . preventDefault ( ) ;
}
var fieldRect = _this . _ _hue _field . getBoundingClientRect ( ) ;
var _ref2 = e . touches && e . touches [ 0 ] || e ,
clientY = _ref2 . clientY ;
var h = 1 - ( clientY - fieldRect . top ) / ( fieldRect . bottom - fieldRect . top ) ;
if ( h > 1 ) {
h = 1 ;
} else if ( h < 0 ) {
h = 0 ;
}
_this . _ _color . h = h * 360 ;
_this . setValue ( _this . _ _color . toOriginal ( ) ) ;
return false ;
}
return _this2 ;
}
createClass ( ColorController , [ {
key : 'updateDisplay' ,
value : function updateDisplay ( ) {
var i = interpret ( this . getValue ( ) ) ;
if ( i !== false ) {
var mismatch = false ;
Common . each ( Color . COMPONENTS , function ( component ) {
if ( ! Common . isUndefined ( i [ component ] ) && ! Common . isUndefined ( this . _ _color . _ _state [ component ] ) && i [ component ] !== this . _ _color . _ _state [ component ] ) {
mismatch = true ;
return { } ;
}
} , this ) ;
if ( mismatch ) {
Common . extend ( this . _ _color . _ _state , i ) ;
2018-05-01 05:21:34 +00:00
}
2018-05-04 00:56:17 +00:00
}
Common . extend ( this . _ _temp . _ _state , this . _ _color . _ _state ) ;
this . _ _temp . a = 1 ;
var flip = this . _ _color . v < 0.5 || this . _ _color . s > 0.5 ? 255 : 0 ;
var _flip = 255 - flip ;
Common . extend ( this . _ _field _knob . style , {
marginLeft : 100 * this . _ _color . s - 7 + 'px' ,
marginTop : 100 * ( 1 - this . _ _color . v ) - 7 + 'px' ,
backgroundColor : this . _ _temp . toHexString ( ) ,
border : this . _ _field _knob _border + 'rgb(' + flip + ',' + flip + ',' + flip + ')'
} ) ;
this . _ _hue _knob . style . marginTop = ( 1 - this . _ _color . h / 360 ) * 100 + 'px' ;
this . _ _temp . s = 1 ;
this . _ _temp . v = 1 ;
linearGradient ( this . _ _saturation _field , 'left' , '#fff' , this . _ _temp . toHexString ( ) ) ;
this . _ _input . value = this . _ _color . toString ( ) ;
Common . extend ( this . _ _input . style , {
backgroundColor : this . _ _color . toHexString ( ) ,
color : 'rgb(' + flip + ',' + flip + ',' + flip + ')' ,
textShadow : this . _ _input _textShadow + 'rgba(' + _flip + ',' + _flip + ',' + _flip + ',.7)'
} ) ;
}
} ] ) ;
return ColorController ;
2018-01-21 05:16:48 +00:00
} ( Controller ) ;
var vendors = [ '-moz-' , '-o-' , '-webkit-' , '-ms-' , '' ] ;
function linearGradient ( elem , x , a , b ) {
2018-05-04 00:56:17 +00:00
elem . style . background = '' ;
Common . each ( vendors , function ( vendor ) {
elem . style . cssText += 'background: ' + vendor + 'linear-gradient(' + x + ', ' + a + ' 0%, ' + b + ' 100%); ' ;
} ) ;
2018-01-21 05:16:48 +00:00
}
function hueGradient ( elem ) {
2018-05-04 00:56:17 +00:00
elem . style . background = '' ;
elem . style . cssText += 'background: -moz-linear-gradient(top, #ff0000 0%, #ff00ff 17%, #0000ff 34%, #00ffff 50%, #00ff00 67%, #ffff00 84%, #ff0000 100%);' ;
elem . style . cssText += 'background: -webkit-linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);' ;
elem . style . cssText += 'background: -o-linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);' ;
elem . style . cssText += 'background: -ms-linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);' ;
elem . style . cssText += 'background: linear-gradient(top, #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);' ;
2018-01-21 05:16:48 +00:00
}
var css = {
load : function load ( url , indoc ) {
var doc = indoc || document ;
var link = doc . createElement ( 'link' ) ;
link . type = 'text/css' ;
link . rel = 'stylesheet' ;
link . href = url ;
doc . getElementsByTagName ( 'head' ) [ 0 ] . appendChild ( link ) ;
} ,
inject : function inject ( cssContent , indoc ) {
var doc = indoc || document ;
var injected = document . createElement ( 'style' ) ;
injected . type = 'text/css' ;
injected . innerHTML = cssContent ;
var head = doc . getElementsByTagName ( 'head' ) [ 0 ] ;
try {
head . appendChild ( injected ) ;
} catch ( e ) {
}
}
} ;
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>" ;
var ControllerFactory = function ControllerFactory ( object , property ) {
var initialValue = object [ property ] ;
if ( Common . isArray ( arguments [ 2 ] ) || Common . isObject ( arguments [ 2 ] ) ) {
return new OptionController ( object , property , arguments [ 2 ] ) ;
}
if ( Common . isNumber ( initialValue ) ) {
if ( Common . isNumber ( arguments [ 2 ] ) && Common . isNumber ( arguments [ 3 ] ) ) {
if ( Common . isNumber ( arguments [ 4 ] ) ) {
return new NumberControllerSlider ( object , property , arguments [ 2 ] , arguments [ 3 ] , arguments [ 4 ] ) ;
}
return new NumberControllerSlider ( object , property , arguments [ 2 ] , arguments [ 3 ] ) ;
}
if ( Common . isNumber ( arguments [ 4 ] ) ) {
return new NumberControllerBox ( object , property , { min : arguments [ 2 ] , max : arguments [ 3 ] , step : arguments [ 4 ] } ) ;
}
return new NumberControllerBox ( object , property , { min : arguments [ 2 ] , max : arguments [ 3 ] } ) ;
}
if ( Common . isString ( initialValue ) ) {
return new StringController ( object , property ) ;
}
if ( Common . isFunction ( initialValue ) ) {
return new FunctionController ( object , property , '' ) ;
}
if ( Common . isBoolean ( initialValue ) ) {
return new BooleanController ( object , property ) ;
}
return null ;
} ;
function requestAnimationFrame ( callback ) {
setTimeout ( callback , 1000 / 60 ) ;
}
var requestAnimationFrame$1 = window . requestAnimationFrame || window . webkitRequestAnimationFrame || window . mozRequestAnimationFrame || window . oRequestAnimationFrame || window . msRequestAnimationFrame || requestAnimationFrame ;
var CenteredDiv = function ( ) {
function CenteredDiv ( ) {
classCallCheck ( this , CenteredDiv ) ;
this . backgroundElement = document . createElement ( 'div' ) ;
Common . extend ( this . backgroundElement . style , {
backgroundColor : 'rgba(0,0,0,0.8)' ,
top : 0 ,
left : 0 ,
display : 'none' ,
zIndex : '1000' ,
opacity : 0 ,
WebkitTransition : 'opacity 0.2s linear' ,
transition : 'opacity 0.2s linear'
} ) ;
2023-05-28 09:23:34 +00:00
dom$1 . makeFullscreen ( this . backgroundElement ) ;
2018-01-21 05:16:48 +00:00
this . backgroundElement . style . position = 'fixed' ;
this . domElement = document . createElement ( 'div' ) ;
Common . extend ( this . domElement . style , {
position : 'fixed' ,
display : 'none' ,
zIndex : '1001' ,
opacity : 0 ,
WebkitTransition : '-webkit-transform 0.2s ease-out, opacity 0.2s linear' ,
transition : 'transform 0.2s ease-out, opacity 0.2s linear'
} ) ;
document . body . appendChild ( this . backgroundElement ) ;
document . body . appendChild ( this . domElement ) ;
var _this = this ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( this . backgroundElement , 'click' , function ( ) {
2018-01-21 05:16:48 +00:00
_this . hide ( ) ;
} ) ;
}
createClass ( CenteredDiv , [ {
key : 'show' ,
value : function show ( ) {
var _this = this ;
this . backgroundElement . style . display = 'block' ;
this . domElement . style . display = 'block' ;
this . domElement . style . opacity = 0 ;
this . domElement . style . webkitTransform = 'scale(1.1)' ;
this . layout ( ) ;
Common . defer ( function ( ) {
_this . backgroundElement . style . opacity = 1 ;
_this . domElement . style . opacity = 1 ;
_this . domElement . style . webkitTransform = 'scale(1)' ;
} ) ;
}
} , {
key : 'hide' ,
value : function hide ( ) {
var _this = this ;
var hide = function hide ( ) {
_this . domElement . style . display = 'none' ;
_this . backgroundElement . style . display = 'none' ;
2023-05-28 09:23:34 +00:00
dom$1 . unbind ( _this . domElement , 'webkitTransitionEnd' , hide ) ;
dom$1 . unbind ( _this . domElement , 'transitionend' , hide ) ;
dom$1 . unbind ( _this . domElement , 'oTransitionEnd' , hide ) ;
2018-01-21 05:16:48 +00:00
} ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( this . domElement , 'webkitTransitionEnd' , hide ) ;
dom$1 . bind ( this . domElement , 'transitionend' , hide ) ;
dom$1 . bind ( this . domElement , 'oTransitionEnd' , hide ) ;
2018-01-21 05:16:48 +00:00
this . backgroundElement . style . opacity = 0 ;
this . domElement . style . opacity = 0 ;
this . domElement . style . webkitTransform = 'scale(1.1)' ;
}
} , {
key : 'layout' ,
value : function layout ( ) {
2023-05-28 09:23:34 +00:00
this . domElement . style . left = window . innerWidth / 2 - dom$1 . getWidth ( this . domElement ) / 2 + 'px' ;
this . domElement . style . top = window . innerHeight / 2 - dom$1 . getHeight ( this . domElement ) / 2 + 'px' ;
2018-01-21 05:16:48 +00:00
}
} ] ) ;
return CenteredDiv ;
} ( ) ;
2023-05-28 09:23:34 +00:00
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 .cr.function .property-name{width:100%}.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 - 1 px 0 # 111 } . dg . main : : - webkit - scrollbar { width : 5 px ; background : # 1 a1a1a } . dg . main : : - webkit - scrollbar - corner { height : 0 ; display : none } . dg . main : : - webkit - scrollbar - thumb { border - radius : 5 px ; background : # 676767 } . dg li : not ( . folder ) { background : # 1 a1a1a ; border - bottom : 1 px solid # 2 c2c2c } . dg li . save - row { line - height : 25 px ; background : # dad5cb ; border : 0 } . dg li . save - row select { margin - left : 5 px ; width : 108 px } . dg li . save - row . button { margin - left : 5 px ; margin - top : 1 px ; border - radius : 2 px ; font - size : 9 px ; line - height : 7 px ; padding : 4 px 4 px 5 px 4 px ; background : # c5bdad ; color : # fff ; text - shadow : 0 1 px 0 # b0a58f ; box - shadow : 0 - 1 px 0 # b0a58f ; cursor : pointer } . dg li . save - row
2018-01-21 05:16:48 +00:00
css . inject ( styleSheet ) ;
var CSS _NAMESPACE = 'dg' ;
var HIDE _KEY _CODE = 72 ;
var CLOSE _BUTTON _HEIGHT = 20 ;
var DEFAULT _DEFAULT _PRESET _NAME = 'Default' ;
var SUPPORTS _LOCAL _STORAGE = function ( ) {
try {
2018-05-05 22:14:28 +00:00
return ! ! window . localStorage ;
2018-01-21 05:16:48 +00:00
} catch ( e ) {
return false ;
}
} ( ) ;
var SAVE _DIALOGUE = void 0 ;
var autoPlaceVirgin = true ;
var autoPlaceContainer = void 0 ;
var hide = false ;
var hideableGuis = [ ] ;
2023-05-28 09:23:34 +00:00
var GUI$1 = function GUI ( pars ) {
2018-01-21 05:16:48 +00:00
var _this = this ;
var params = pars || { } ;
this . domElement = document . createElement ( 'div' ) ;
this . _ _ul = document . createElement ( 'ul' ) ;
this . domElement . appendChild ( this . _ _ul ) ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( this . domElement , CSS _NAMESPACE ) ;
2018-01-21 05:16:48 +00:00
this . _ _folders = { } ;
this . _ _controllers = [ ] ;
this . _ _rememberedObjects = [ ] ;
this . _ _rememberedObjectIndecesToControllers = [ ] ;
this . _ _listening = [ ] ;
params = Common . defaults ( params , {
closeOnTop : false ,
autoPlace : true ,
width : GUI . DEFAULT _WIDTH
} ) ;
params = Common . defaults ( params , {
resizable : params . autoPlace ,
hideable : params . autoPlace
} ) ;
if ( ! Common . isUndefined ( params . load ) ) {
if ( params . preset ) {
params . load . preset = params . preset ;
}
} else {
params . load = { preset : DEFAULT _DEFAULT _PRESET _NAME } ;
}
if ( Common . isUndefined ( params . parent ) && params . hideable ) {
hideableGuis . push ( this ) ;
}
params . resizable = Common . isUndefined ( params . parent ) && params . resizable ;
if ( params . autoPlace && Common . isUndefined ( params . scrollable ) ) {
params . scrollable = true ;
}
var useLocalStorage = SUPPORTS _LOCAL _STORAGE && localStorage . getItem ( getLocalStorageHash ( this , 'isLocal' ) ) === 'true' ;
var saveToLocalStorage = void 0 ;
2018-10-07 04:47:16 +00:00
var titleRow = void 0 ;
2018-01-21 05:16:48 +00:00
Object . defineProperties ( this ,
{
parent : {
2023-05-28 09:23:34 +00:00
get : function get ( ) {
2018-01-21 05:16:48 +00:00
return params . parent ;
}
} ,
scrollable : {
2023-05-28 09:23:34 +00:00
get : function get ( ) {
2018-01-21 05:16:48 +00:00
return params . scrollable ;
}
} ,
autoPlace : {
2023-05-28 09:23:34 +00:00
get : function get ( ) {
2018-01-21 05:16:48 +00:00
return params . autoPlace ;
}
} ,
closeOnTop : {
2023-05-28 09:23:34 +00:00
get : function get ( ) {
2018-01-21 05:16:48 +00:00
return params . closeOnTop ;
}
} ,
preset : {
2023-05-28 09:23:34 +00:00
get : function get ( ) {
2018-01-21 05:16:48 +00:00
if ( _this . parent ) {
return _this . getRoot ( ) . preset ;
}
return params . load . preset ;
} ,
2023-05-28 09:23:34 +00:00
set : function set ( v ) {
2018-01-21 05:16:48 +00:00
if ( _this . parent ) {
_this . getRoot ( ) . preset = v ;
} else {
params . load . preset = v ;
}
setPresetSelectIndex ( this ) ;
_this . revert ( ) ;
}
} ,
width : {
2023-05-28 09:23:34 +00:00
get : function get ( ) {
2018-01-21 05:16:48 +00:00
return params . width ;
} ,
2023-05-28 09:23:34 +00:00
set : function set ( v ) {
2018-01-21 05:16:48 +00:00
params . width = v ;
setWidth ( _this , v ) ;
}
} ,
name : {
2023-05-28 09:23:34 +00:00
get : function get ( ) {
2018-01-21 05:16:48 +00:00
return params . name ;
} ,
2023-05-28 09:23:34 +00:00
set : function set ( v ) {
2018-01-21 05:16:48 +00:00
params . name = v ;
2018-10-07 04:47:16 +00:00
if ( titleRow ) {
titleRow . innerHTML = params . name ;
2018-01-21 05:16:48 +00:00
}
}
} ,
closed : {
2023-05-28 09:23:34 +00:00
get : function get ( ) {
2018-01-21 05:16:48 +00:00
return params . closed ;
} ,
2023-05-28 09:23:34 +00:00
set : function set ( v ) {
2018-01-21 05:16:48 +00:00
params . closed = v ;
if ( params . closed ) {
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( _this . _ _ul , GUI . CLASS _CLOSED ) ;
2018-01-21 05:16:48 +00:00
} else {
2023-05-28 09:23:34 +00:00
dom$1 . removeClass ( _this . _ _ul , GUI . CLASS _CLOSED ) ;
2018-01-21 05:16:48 +00:00
}
this . onResize ( ) ;
if ( _this . _ _closeButton ) {
_this . _ _closeButton . innerHTML = v ? GUI . TEXT _OPEN : GUI . TEXT _CLOSED ;
}
}
} ,
load : {
2023-05-28 09:23:34 +00:00
get : function get ( ) {
2018-01-21 05:16:48 +00:00
return params . load ;
}
} ,
useLocalStorage : {
2023-05-28 09:23:34 +00:00
get : function get ( ) {
2018-01-21 05:16:48 +00:00
return useLocalStorage ;
} ,
2023-05-28 09:23:34 +00:00
set : function set ( bool ) {
2018-01-21 05:16:48 +00:00
if ( SUPPORTS _LOCAL _STORAGE ) {
useLocalStorage = bool ;
if ( bool ) {
2023-05-28 09:23:34 +00:00
dom$1 . bind ( window , 'unload' , saveToLocalStorage ) ;
2018-01-21 05:16:48 +00:00
} else {
2023-05-28 09:23:34 +00:00
dom$1 . unbind ( window , 'unload' , saveToLocalStorage ) ;
2018-01-21 05:16:48 +00:00
}
localStorage . setItem ( getLocalStorageHash ( _this , 'isLocal' ) , bool ) ;
}
}
}
} ) ;
if ( Common . isUndefined ( params . parent ) ) {
2019-01-08 18:21:13 +00:00
this . closed = params . closed || false ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( this . domElement , GUI . CLASS _MAIN ) ;
dom$1 . makeSelectable ( this . domElement , false ) ;
2018-01-21 05:16:48 +00:00
if ( SUPPORTS _LOCAL _STORAGE ) {
if ( useLocalStorage ) {
_this . useLocalStorage = true ;
var savedGui = localStorage . getItem ( getLocalStorageHash ( this , 'gui' ) ) ;
if ( savedGui ) {
params . load = JSON . parse ( savedGui ) ;
}
}
}
this . _ _closeButton = document . createElement ( 'div' ) ;
this . _ _closeButton . innerHTML = GUI . TEXT _CLOSED ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( this . _ _closeButton , GUI . CLASS _CLOSE _BUTTON ) ;
2018-01-21 05:16:48 +00:00
if ( params . closeOnTop ) {
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( this . _ _closeButton , GUI . CLASS _CLOSE _TOP ) ;
2018-01-21 05:16:48 +00:00
this . domElement . insertBefore ( this . _ _closeButton , this . domElement . childNodes [ 0 ] ) ;
} else {
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( this . _ _closeButton , GUI . CLASS _CLOSE _BOTTOM ) ;
2018-01-21 05:16:48 +00:00
this . domElement . appendChild ( this . _ _closeButton ) ;
}
2023-05-28 09:23:34 +00:00
dom$1 . bind ( this . _ _closeButton , 'click' , function ( ) {
2018-01-21 05:16:48 +00:00
_this . closed = ! _this . closed ;
} ) ;
} else {
if ( params . closed === undefined ) {
params . closed = true ;
}
2018-10-07 04:47:16 +00:00
var titleRowName = document . createTextNode ( params . name ) ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( titleRowName , 'controller-name' ) ;
2018-10-07 04:47:16 +00:00
titleRow = addRow ( _this , titleRowName ) ;
2018-01-21 05:16:48 +00:00
var onClickTitle = function onClickTitle ( e ) {
e . preventDefault ( ) ;
_this . closed = ! _this . closed ;
return false ;
} ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( this . _ _ul , GUI . CLASS _CLOSED ) ;
dom$1 . addClass ( titleRow , 'title' ) ;
dom$1 . bind ( titleRow , 'click' , onClickTitle ) ;
2018-01-21 05:16:48 +00:00
if ( ! params . closed ) {
this . closed = false ;
}
}
if ( params . autoPlace ) {
if ( Common . isUndefined ( params . parent ) ) {
if ( autoPlaceVirgin ) {
autoPlaceContainer = document . createElement ( 'div' ) ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( autoPlaceContainer , CSS _NAMESPACE ) ;
dom$1 . addClass ( autoPlaceContainer , GUI . CLASS _AUTO _PLACE _CONTAINER ) ;
2018-01-21 05:16:48 +00:00
document . body . appendChild ( autoPlaceContainer ) ;
autoPlaceVirgin = false ;
}
autoPlaceContainer . appendChild ( this . domElement ) ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( this . domElement , GUI . CLASS _AUTO _PLACE ) ;
2018-01-21 05:16:48 +00:00
}
if ( ! this . parent ) {
setWidth ( _this , params . width ) ;
}
}
this . _ _resizeHandler = function ( ) {
_this . onResizeDebounced ( ) ;
} ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( window , 'resize' , this . _ _resizeHandler ) ;
dom$1 . bind ( this . _ _ul , 'webkitTransitionEnd' , this . _ _resizeHandler ) ;
dom$1 . bind ( this . _ _ul , 'transitionend' , this . _ _resizeHandler ) ;
dom$1 . bind ( this . _ _ul , 'oTransitionEnd' , this . _ _resizeHandler ) ;
2018-01-21 05:16:48 +00:00
this . onResize ( ) ;
if ( params . resizable ) {
addResizeHandle ( this ) ;
}
saveToLocalStorage = function saveToLocalStorage ( ) {
if ( SUPPORTS _LOCAL _STORAGE && localStorage . getItem ( getLocalStorageHash ( _this , 'isLocal' ) ) === 'true' ) {
localStorage . setItem ( getLocalStorageHash ( _this , 'gui' ) , JSON . stringify ( _this . getSaveObject ( ) ) ) ;
}
} ;
this . saveToLocalStorageIfPossible = saveToLocalStorage ;
function resetWidth ( ) {
var root = _this . getRoot ( ) ;
root . width += 1 ;
Common . defer ( function ( ) {
root . width -= 1 ;
} ) ;
}
if ( ! params . parent ) {
resetWidth ( ) ;
}
} ;
2023-05-28 09:23:34 +00:00
GUI$1 . toggleHide = function ( ) {
2018-01-21 05:16:48 +00:00
hide = ! hide ;
Common . each ( hideableGuis , function ( gui ) {
gui . domElement . style . display = hide ? 'none' : '' ;
} ) ;
} ;
2023-05-28 09:23:34 +00:00
GUI$1 . CLASS _AUTO _PLACE = 'a' ;
GUI$1 . CLASS _AUTO _PLACE _CONTAINER = 'ac' ;
GUI$1 . CLASS _MAIN = 'main' ;
GUI$1 . CLASS _CONTROLLER _ROW = 'cr' ;
GUI$1 . CLASS _TOO _TALL = 'taller-than-window' ;
GUI$1 . CLASS _CLOSED = 'closed' ;
GUI$1 . CLASS _CLOSE _BUTTON = 'close-button' ;
GUI$1 . CLASS _CLOSE _TOP = 'close-top' ;
GUI$1 . CLASS _CLOSE _BOTTOM = 'close-bottom' ;
GUI$1 . CLASS _DRAG = 'drag' ;
GUI$1 . DEFAULT _WIDTH = 245 ;
GUI$1 . TEXT _CLOSED = 'Close Controls' ;
GUI$1 . TEXT _OPEN = 'Open Controls' ;
GUI$1 . _keydownHandler = function ( e ) {
2018-01-21 05:16:48 +00:00
if ( document . activeElement . type !== 'text' && ( e . which === HIDE _KEY _CODE || e . keyCode === HIDE _KEY _CODE ) ) {
2023-05-28 09:23:34 +00:00
GUI$1 . toggleHide ( ) ;
2018-01-21 05:16:48 +00:00
}
} ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( window , 'keydown' , GUI$1 . _keydownHandler , false ) ;
Common . extend ( GUI$1 . prototype ,
2018-01-21 05:16:48 +00:00
{
add : function add ( object , property ) {
return _add ( this , object , property , {
factoryArgs : Array . prototype . slice . call ( arguments , 2 )
} ) ;
} ,
addColor : function addColor ( object , property ) {
return _add ( this , object , property , {
color : true
} ) ;
} ,
remove : function remove ( controller ) {
this . _ _ul . removeChild ( controller . _ _li ) ;
this . _ _controllers . splice ( this . _ _controllers . indexOf ( controller ) , 1 ) ;
var _this = this ;
Common . defer ( function ( ) {
_this . onResize ( ) ;
} ) ;
} ,
destroy : function destroy ( ) {
2018-02-17 04:03:17 +00:00
if ( this . parent ) {
throw new Error ( 'Only the root GUI should be removed with .destroy(). ' + 'For subfolders, use gui.removeFolder(folder) instead.' ) ;
}
2018-01-21 05:16:48 +00:00
if ( this . autoPlace ) {
autoPlaceContainer . removeChild ( this . domElement ) ;
}
2018-02-17 04:03:17 +00:00
var _this = this ;
Common . each ( this . _ _folders , function ( subfolder ) {
_this . removeFolder ( subfolder ) ;
} ) ;
2023-05-28 09:23:34 +00:00
dom$1 . unbind ( window , 'keydown' , GUI$1 . _keydownHandler , false ) ;
2018-02-17 04:03:17 +00:00
removeListeners ( this ) ;
2018-01-21 05:16:48 +00:00
} ,
addFolder : function addFolder ( name ) {
if ( this . _ _folders [ name ] !== undefined ) {
throw new Error ( 'You already have a folder in this GUI by the' + ' name "' + name + '"' ) ;
}
var newGuiParams = { name : name , parent : this } ;
newGuiParams . autoPlace = this . autoPlace ;
if ( this . load &&
this . load . folders &&
this . load . folders [ name ] ) {
newGuiParams . closed = this . load . folders [ name ] . closed ;
newGuiParams . load = this . load . folders [ name ] ;
}
2023-05-28 09:23:34 +00:00
var gui = new GUI$1 ( newGuiParams ) ;
2018-01-21 05:16:48 +00:00
this . _ _folders [ name ] = gui ;
var li = addRow ( this , gui . domElement ) ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( li , 'folder' ) ;
2018-01-21 05:16:48 +00:00
return gui ;
} ,
removeFolder : function removeFolder ( folder ) {
this . _ _ul . removeChild ( folder . domElement . parentElement ) ;
delete this . _ _folders [ folder . name ] ;
if ( this . load &&
this . load . folders &&
this . load . folders [ folder . name ] ) {
delete this . load . folders [ folder . name ] ;
}
2018-02-17 04:03:17 +00:00
removeListeners ( folder ) ;
2018-01-21 05:16:48 +00:00
var _this = this ;
2018-02-17 04:03:17 +00:00
Common . each ( folder . _ _folders , function ( subfolder ) {
folder . removeFolder ( subfolder ) ;
} ) ;
2018-01-21 05:16:48 +00:00
Common . defer ( function ( ) {
_this . onResize ( ) ;
} ) ;
} ,
open : function open ( ) {
this . closed = false ;
} ,
close : function close ( ) {
this . closed = true ;
} ,
2019-03-30 04:43:38 +00:00
hide : function hide ( ) {
this . domElement . style . display = 'none' ;
} ,
show : function show ( ) {
this . domElement . style . display = '' ;
} ,
2018-01-21 05:16:48 +00:00
onResize : function onResize ( ) {
var root = this . getRoot ( ) ;
if ( root . scrollable ) {
2023-05-28 09:23:34 +00:00
var top = dom$1 . getOffset ( root . _ _ul ) . top ;
2018-01-21 05:16:48 +00:00
var h = 0 ;
Common . each ( root . _ _ul . childNodes , function ( node ) {
if ( ! ( root . autoPlace && node === root . _ _save _row ) ) {
2023-05-28 09:23:34 +00:00
h += dom$1 . getHeight ( node ) ;
2018-01-21 05:16:48 +00:00
}
} ) ;
if ( window . innerHeight - top - CLOSE _BUTTON _HEIGHT < h ) {
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( root . domElement , GUI$1 . CLASS _TOO _TALL ) ;
2018-01-21 05:16:48 +00:00
root . _ _ul . style . height = window . innerHeight - top - CLOSE _BUTTON _HEIGHT + 'px' ;
} else {
2023-05-28 09:23:34 +00:00
dom$1 . removeClass ( root . domElement , GUI$1 . CLASS _TOO _TALL ) ;
2018-01-21 05:16:48 +00:00
root . _ _ul . style . height = 'auto' ;
}
}
if ( root . _ _resize _handle ) {
Common . defer ( function ( ) {
root . _ _resize _handle . style . height = root . _ _ul . offsetHeight + 'px' ;
} ) ;
}
if ( root . _ _closeButton ) {
root . _ _closeButton . style . width = root . width + 'px' ;
}
} ,
onResizeDebounced : Common . debounce ( function ( ) {
this . onResize ( ) ;
} , 50 ) ,
remember : function remember ( ) {
if ( Common . isUndefined ( SAVE _DIALOGUE ) ) {
SAVE _DIALOGUE = new CenteredDiv ( ) ;
SAVE _DIALOGUE . domElement . innerHTML = saveDialogContents ;
}
if ( this . parent ) {
throw new Error ( 'You can only call remember on a top level GUI.' ) ;
}
var _this = this ;
Common . each ( Array . prototype . slice . call ( arguments ) , function ( object ) {
if ( _this . _ _rememberedObjects . length === 0 ) {
addSaveMenu ( _this ) ;
}
if ( _this . _ _rememberedObjects . indexOf ( object ) === - 1 ) {
_this . _ _rememberedObjects . push ( object ) ;
}
} ) ;
if ( this . autoPlace ) {
setWidth ( this , this . width ) ;
}
} ,
getRoot : function getRoot ( ) {
var gui = this ;
while ( gui . parent ) {
gui = gui . parent ;
}
return gui ;
} ,
getSaveObject : function getSaveObject ( ) {
var toReturn = this . load ;
toReturn . closed = this . closed ;
if ( this . _ _rememberedObjects . length > 0 ) {
toReturn . preset = this . preset ;
if ( ! toReturn . remembered ) {
toReturn . remembered = { } ;
}
toReturn . remembered [ this . preset ] = getCurrentPreset ( this ) ;
}
toReturn . folders = { } ;
Common . each ( this . _ _folders , function ( element , key ) {
toReturn . folders [ key ] = element . getSaveObject ( ) ;
} ) ;
return toReturn ;
} ,
save : function save ( ) {
if ( ! this . load . remembered ) {
this . load . remembered = { } ;
}
this . load . remembered [ this . preset ] = getCurrentPreset ( this ) ;
markPresetModified ( this , false ) ;
this . saveToLocalStorageIfPossible ( ) ;
} ,
saveAs : function saveAs ( presetName ) {
if ( ! this . load . remembered ) {
this . load . remembered = { } ;
this . load . remembered [ DEFAULT _DEFAULT _PRESET _NAME ] = getCurrentPreset ( this , true ) ;
}
this . load . remembered [ presetName ] = getCurrentPreset ( this ) ;
this . preset = presetName ;
addPresetOption ( this , presetName , true ) ;
this . saveToLocalStorageIfPossible ( ) ;
} ,
revert : function revert ( gui ) {
Common . each ( this . _ _controllers , function ( controller ) {
if ( ! this . getRoot ( ) . load . remembered ) {
controller . setValue ( controller . initialValue ) ;
} else {
recallSavedValue ( gui || this . getRoot ( ) , controller ) ;
}
if ( controller . _ _onFinishChange ) {
controller . _ _onFinishChange . call ( controller , controller . getValue ( ) ) ;
}
} , this ) ;
Common . each ( this . _ _folders , function ( folder ) {
folder . revert ( folder ) ;
} ) ;
if ( ! gui ) {
markPresetModified ( this . getRoot ( ) , false ) ;
}
} ,
listen : function listen ( controller ) {
var init = this . _ _listening . length === 0 ;
this . _ _listening . push ( controller ) ;
if ( init ) {
updateDisplays ( this . _ _listening ) ;
}
} ,
updateDisplay : function updateDisplay ( ) {
Common . each ( this . _ _controllers , function ( controller ) {
controller . updateDisplay ( ) ;
} ) ;
Common . each ( this . _ _folders , function ( folder ) {
folder . updateDisplay ( ) ;
} ) ;
}
} ) ;
function addRow ( gui , newDom , liBefore ) {
var li = document . createElement ( 'li' ) ;
if ( newDom ) {
li . appendChild ( newDom ) ;
}
if ( liBefore ) {
gui . _ _ul . insertBefore ( li , liBefore ) ;
} else {
gui . _ _ul . appendChild ( li ) ;
}
gui . onResize ( ) ;
return li ;
}
2018-02-17 04:03:17 +00:00
function removeListeners ( gui ) {
2023-05-28 09:23:34 +00:00
dom$1 . unbind ( window , 'resize' , gui . _ _resizeHandler ) ;
2018-02-17 04:03:17 +00:00
if ( gui . saveToLocalStorageIfPossible ) {
2023-05-28 09:23:34 +00:00
dom$1 . unbind ( window , 'unload' , gui . saveToLocalStorageIfPossible ) ;
2018-02-17 04:03:17 +00:00
}
}
2018-01-21 05:16:48 +00:00
function markPresetModified ( gui , modified ) {
var opt = gui . _ _preset _select [ gui . _ _preset _select . selectedIndex ] ;
if ( modified ) {
opt . innerHTML = opt . value + '*' ;
} else {
opt . innerHTML = opt . value ;
}
}
function augmentController ( gui , li , controller ) {
controller . _ _li = li ;
controller . _ _gui = gui ;
2022-02-17 00:57:57 +00:00
Common . extend ( controller , {
2018-01-21 05:16:48 +00:00
options : function options ( _options ) {
if ( arguments . length > 1 ) {
var nextSibling = controller . _ _li . nextElementSibling ;
controller . remove ( ) ;
return _add ( gui , controller . object , controller . property , {
before : nextSibling ,
factoryArgs : [ Common . toArray ( arguments ) ]
} ) ;
}
if ( Common . isArray ( _options ) || Common . isObject ( _options ) ) {
var _nextSibling = controller . _ _li . nextElementSibling ;
controller . remove ( ) ;
return _add ( gui , controller . object , controller . property , {
before : _nextSibling ,
factoryArgs : [ _options ]
} ) ;
}
} ,
name : function name ( _name ) {
controller . _ _li . firstElementChild . firstElementChild . innerHTML = _name ;
return controller ;
} ,
listen : function listen ( ) {
controller . _ _gui . listen ( controller ) ;
return controller ;
} ,
remove : function remove ( ) {
controller . _ _gui . remove ( controller ) ;
return controller ;
}
} ) ;
if ( controller instanceof NumberControllerSlider ) {
var box = new NumberControllerBox ( controller . object , controller . property , { min : controller . _ _min , max : controller . _ _max , step : controller . _ _step } ) ;
2019-01-05 00:26:08 +00:00
Common . each ( [ 'updateDisplay' , 'onChange' , 'onFinishChange' , 'step' , 'min' , 'max' ] , function ( method ) {
2018-01-21 05:16:48 +00:00
var pc = controller [ method ] ;
var pb = box [ method ] ;
controller [ method ] = box [ method ] = function ( ) {
var args = Array . prototype . slice . call ( arguments ) ;
pb . apply ( box , args ) ;
return pc . apply ( controller , args ) ;
} ;
} ) ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( li , 'has-slider' ) ;
2018-01-21 05:16:48 +00:00
controller . domElement . insertBefore ( box . domElement , controller . domElement . firstElementChild ) ;
} else if ( controller instanceof NumberControllerBox ) {
var r = function r ( returned ) {
if ( Common . isNumber ( controller . _ _min ) && Common . isNumber ( controller . _ _max ) ) {
var oldName = controller . _ _li . firstElementChild . firstElementChild . innerHTML ;
var wasListening = controller . _ _gui . _ _listening . indexOf ( controller ) > - 1 ;
controller . remove ( ) ;
var newController = _add ( gui , controller . object , controller . property , {
before : controller . _ _li . nextElementSibling ,
factoryArgs : [ controller . _ _min , controller . _ _max , controller . _ _step ]
} ) ;
newController . name ( oldName ) ;
if ( wasListening ) newController . listen ( ) ;
return newController ;
}
return returned ;
} ;
controller . min = Common . compose ( r , controller . min ) ;
controller . max = Common . compose ( r , controller . max ) ;
} else if ( controller instanceof BooleanController ) {
2023-05-28 09:23:34 +00:00
dom$1 . bind ( li , 'click' , function ( ) {
dom$1 . fakeEvent ( controller . _ _checkbox , 'click' ) ;
2018-01-21 05:16:48 +00:00
} ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( controller . _ _checkbox , 'click' , function ( e ) {
2018-01-21 05:16:48 +00:00
e . stopPropagation ( ) ;
} ) ;
} else if ( controller instanceof FunctionController ) {
2023-05-28 09:23:34 +00:00
dom$1 . bind ( li , 'click' , function ( ) {
dom$1 . fakeEvent ( controller . _ _button , 'click' ) ;
2018-01-21 05:16:48 +00:00
} ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( li , 'mouseover' , function ( ) {
dom$1 . addClass ( controller . _ _button , 'hover' ) ;
2018-01-21 05:16:48 +00:00
} ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( li , 'mouseout' , function ( ) {
dom$1 . removeClass ( controller . _ _button , 'hover' ) ;
2018-01-21 05:16:48 +00:00
} ) ;
} else if ( controller instanceof ColorController ) {
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( li , 'color' ) ;
2018-01-21 05:16:48 +00:00
controller . updateDisplay = Common . compose ( function ( val ) {
li . style . borderLeftColor = controller . _ _color . toString ( ) ;
return val ;
} , controller . updateDisplay ) ;
controller . updateDisplay ( ) ;
}
controller . setValue = Common . compose ( function ( val ) {
if ( gui . getRoot ( ) . _ _preset _select && controller . isModified ( ) ) {
markPresetModified ( gui . getRoot ( ) , true ) ;
}
return val ;
} , controller . setValue ) ;
}
function recallSavedValue ( gui , controller ) {
var root = gui . getRoot ( ) ;
var matchedIndex = root . _ _rememberedObjects . indexOf ( controller . object ) ;
if ( matchedIndex !== - 1 ) {
var controllerMap = root . _ _rememberedObjectIndecesToControllers [ matchedIndex ] ;
if ( controllerMap === undefined ) {
controllerMap = { } ;
root . _ _rememberedObjectIndecesToControllers [ matchedIndex ] = controllerMap ;
}
controllerMap [ controller . property ] = controller ;
if ( root . load && root . load . remembered ) {
var presetMap = root . load . remembered ;
var preset = void 0 ;
if ( presetMap [ gui . preset ] ) {
preset = presetMap [ gui . preset ] ;
} else if ( presetMap [ DEFAULT _DEFAULT _PRESET _NAME ] ) {
preset = presetMap [ DEFAULT _DEFAULT _PRESET _NAME ] ;
} else {
return ;
}
if ( preset [ matchedIndex ] && preset [ matchedIndex ] [ controller . property ] !== undefined ) {
var value = preset [ matchedIndex ] [ controller . property ] ;
controller . initialValue = value ;
controller . setValue ( value ) ;
}
}
}
}
function _add ( gui , object , property , params ) {
if ( object [ property ] === undefined ) {
throw new Error ( 'Object "' + object + '" has no property "' + property + '"' ) ;
}
var controller = void 0 ;
if ( params . color ) {
controller = new ColorController ( object , property ) ;
} else {
var factoryArgs = [ object , property ] . concat ( params . factoryArgs ) ;
controller = ControllerFactory . apply ( gui , factoryArgs ) ;
}
if ( params . before instanceof Controller ) {
params . before = params . before . _ _li ;
}
recallSavedValue ( gui , controller ) ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( controller . domElement , 'c' ) ;
2018-01-21 05:16:48 +00:00
var name = document . createElement ( 'span' ) ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( name , 'property-name' ) ;
2018-01-21 05:16:48 +00:00
name . innerHTML = controller . property ;
var container = document . createElement ( 'div' ) ;
container . appendChild ( name ) ;
container . appendChild ( controller . domElement ) ;
var li = addRow ( gui , container , params . before ) ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( li , GUI$1 . CLASS _CONTROLLER _ROW ) ;
2018-01-21 05:16:48 +00:00
if ( controller instanceof ColorController ) {
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( li , 'color' ) ;
2018-01-21 05:16:48 +00:00
} else {
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( li , _typeof ( controller . getValue ( ) ) ) ;
2018-01-21 05:16:48 +00:00
}
augmentController ( gui , li , controller ) ;
gui . _ _controllers . push ( controller ) ;
return controller ;
}
function getLocalStorageHash ( gui , key ) {
return document . location . href + '.' + key ;
}
function addPresetOption ( gui , name , setSelected ) {
var opt = document . createElement ( 'option' ) ;
opt . innerHTML = name ;
opt . value = name ;
gui . _ _preset _select . appendChild ( opt ) ;
if ( setSelected ) {
gui . _ _preset _select . selectedIndex = gui . _ _preset _select . length - 1 ;
}
}
function showHideExplain ( gui , explain ) {
explain . style . display = gui . useLocalStorage ? 'block' : 'none' ;
}
function addSaveMenu ( gui ) {
var div = gui . _ _save _row = document . createElement ( 'li' ) ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( gui . domElement , 'has-save' ) ;
2018-01-21 05:16:48 +00:00
gui . _ _ul . insertBefore ( div , gui . _ _ul . firstChild ) ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( div , 'save-row' ) ;
2018-01-21 05:16:48 +00:00
var gears = document . createElement ( 'span' ) ;
gears . innerHTML = ' ' ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( gears , 'button gears' ) ;
2018-01-21 05:16:48 +00:00
var button = document . createElement ( 'span' ) ;
button . innerHTML = 'Save' ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( button , 'button' ) ;
dom$1 . addClass ( button , 'save' ) ;
2018-01-21 05:16:48 +00:00
var button2 = document . createElement ( 'span' ) ;
button2 . innerHTML = 'New' ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( button2 , 'button' ) ;
dom$1 . addClass ( button2 , 'save-as' ) ;
2018-01-21 05:16:48 +00:00
var button3 = document . createElement ( 'span' ) ;
button3 . innerHTML = 'Revert' ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( button3 , 'button' ) ;
dom$1 . addClass ( button3 , 'revert' ) ;
2018-01-21 05:16:48 +00:00
var select = gui . _ _preset _select = document . createElement ( 'select' ) ;
if ( gui . load && gui . load . remembered ) {
Common . each ( gui . load . remembered , function ( value , key ) {
addPresetOption ( gui , key , key === gui . preset ) ;
} ) ;
} else {
addPresetOption ( gui , DEFAULT _DEFAULT _PRESET _NAME , false ) ;
}
2023-05-28 09:23:34 +00:00
dom$1 . bind ( select , 'change' , function ( ) {
2018-01-21 05:16:48 +00:00
for ( var index = 0 ; index < gui . _ _preset _select . length ; index ++ ) {
gui . _ _preset _select [ index ] . innerHTML = gui . _ _preset _select [ index ] . value ;
}
gui . preset = this . value ;
} ) ;
div . appendChild ( select ) ;
div . appendChild ( gears ) ;
div . appendChild ( button ) ;
div . appendChild ( button2 ) ;
div . appendChild ( button3 ) ;
if ( SUPPORTS _LOCAL _STORAGE ) {
var explain = document . getElementById ( 'dg-local-explain' ) ;
var localStorageCheckBox = document . getElementById ( 'dg-local-storage' ) ;
var saveLocally = document . getElementById ( 'dg-save-locally' ) ;
saveLocally . style . display = 'block' ;
if ( localStorage . getItem ( getLocalStorageHash ( gui , 'isLocal' ) ) === 'true' ) {
localStorageCheckBox . setAttribute ( 'checked' , 'checked' ) ;
}
showHideExplain ( gui , explain ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( localStorageCheckBox , 'change' , function ( ) {
2018-01-21 05:16:48 +00:00
gui . useLocalStorage = ! gui . useLocalStorage ;
showHideExplain ( gui , explain ) ;
} ) ;
}
var newConstructorTextArea = document . getElementById ( 'dg-new-constructor' ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( newConstructorTextArea , 'keydown' , function ( e ) {
2018-01-21 05:16:48 +00:00
if ( e . metaKey && ( e . which === 67 || e . keyCode === 67 ) ) {
SAVE _DIALOGUE . hide ( ) ;
}
} ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( gears , 'click' , function ( ) {
2018-01-21 05:16:48 +00:00
newConstructorTextArea . innerHTML = JSON . stringify ( gui . getSaveObject ( ) , undefined , 2 ) ;
SAVE _DIALOGUE . show ( ) ;
newConstructorTextArea . focus ( ) ;
newConstructorTextArea . select ( ) ;
} ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( button , 'click' , function ( ) {
2018-01-21 05:16:48 +00:00
gui . save ( ) ;
} ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( button2 , 'click' , function ( ) {
2018-01-21 05:16:48 +00:00
var presetName = prompt ( 'Enter a new preset name.' ) ;
if ( presetName ) {
gui . saveAs ( presetName ) ;
}
} ) ;
2023-05-28 09:23:34 +00:00
dom$1 . bind ( button3 , 'click' , function ( ) {
2018-01-21 05:16:48 +00:00
gui . revert ( ) ;
} ) ;
}
function addResizeHandle ( gui ) {
var pmouseX = void 0 ;
gui . _ _resize _handle = document . createElement ( 'div' ) ;
Common . extend ( gui . _ _resize _handle . style , {
width : '6px' ,
marginLeft : '-3px' ,
height : '200px' ,
cursor : 'ew-resize' ,
position : 'absolute'
} ) ;
function drag ( e ) {
e . preventDefault ( ) ;
gui . width += pmouseX - e . clientX ;
gui . onResize ( ) ;
pmouseX = e . clientX ;
return false ;
}
function dragStop ( ) {
2023-05-28 09:23:34 +00:00
dom$1 . removeClass ( gui . _ _closeButton , GUI$1 . CLASS _DRAG ) ;
dom$1 . unbind ( window , 'mousemove' , drag ) ;
dom$1 . unbind ( window , 'mouseup' , dragStop ) ;
2018-01-21 05:16:48 +00:00
}
function dragStart ( e ) {
e . preventDefault ( ) ;
pmouseX = e . clientX ;
2023-05-28 09:23:34 +00:00
dom$1 . addClass ( gui . _ _closeButton , GUI$1 . CLASS _DRAG ) ;
dom$1 . bind ( window , 'mousemove' , drag ) ;
dom$1 . bind ( window , 'mouseup' , dragStop ) ;
2018-01-21 05:16:48 +00:00
return false ;
}
2023-05-28 09:23:34 +00:00
dom$1 . bind ( gui . _ _resize _handle , 'mousedown' , dragStart ) ;
dom$1 . bind ( gui . _ _closeButton , 'mousedown' , dragStart ) ;
2018-01-21 05:16:48 +00:00
gui . domElement . insertBefore ( gui . _ _resize _handle , gui . domElement . firstElementChild ) ;
}
function setWidth ( gui , w ) {
gui . domElement . style . width = w + 'px' ;
if ( gui . _ _save _row && gui . autoPlace ) {
gui . _ _save _row . style . width = w + 'px' ;
}
if ( gui . _ _closeButton ) {
gui . _ _closeButton . style . width = w + 'px' ;
}
}
function getCurrentPreset ( gui , useInitialValues ) {
var toReturn = { } ;
Common . each ( gui . _ _rememberedObjects , function ( val , index ) {
var savedValues = { } ;
var controllerMap = gui . _ _rememberedObjectIndecesToControllers [ index ] ;
Common . each ( controllerMap , function ( controller , property ) {
savedValues [ property ] = useInitialValues ? controller . initialValue : controller . getValue ( ) ;
} ) ;
toReturn [ index ] = savedValues ;
} ) ;
return toReturn ;
}
function setPresetSelectIndex ( gui ) {
for ( var index = 0 ; index < gui . _ _preset _select . length ; index ++ ) {
if ( gui . _ _preset _select [ index ] . value === gui . preset ) {
gui . _ _preset _select . selectedIndex = index ;
}
}
}
function updateDisplays ( controllerArray ) {
if ( controllerArray . length !== 0 ) {
requestAnimationFrame$1 . call ( window , function ( ) {
updateDisplays ( controllerArray ) ;
} ) ;
}
Common . each ( controllerArray , function ( c ) {
c . updateDisplay ( ) ;
} ) ;
}
2018-05-05 22:14:28 +00:00
var color = {
Color : Color ,
math : ColorMath ,
interpret : interpret
} ;
var controllers = {
Controller : Controller ,
BooleanController : BooleanController ,
OptionController : OptionController ,
StringController : StringController ,
NumberController : NumberController ,
NumberControllerBox : NumberControllerBox ,
NumberControllerSlider : NumberControllerSlider ,
FunctionController : FunctionController ,
ColorController : ColorController
} ;
2023-05-28 09:23:34 +00:00
var dom = { dom : dom$1 } ;
var gui = { GUI : GUI$1 } ;
var GUI = GUI$1 ;
2018-01-21 05:16:48 +00:00
var index = {
2018-05-05 22:14:28 +00:00
color : color ,
controllers : controllers ,
2023-05-28 09:23:34 +00:00
dom : dom ,
2018-05-05 22:14:28 +00:00
gui : gui ,
2023-05-28 09:23:34 +00:00
GUI : GUI
2018-01-21 05:16:48 +00:00
} ;
2023-05-28 09:23:34 +00:00
export { GUI , color , controllers , index as default , dom , gui } ;
2018-01-21 05:16:48 +00:00
//# sourceMappingURL=dat.gui.module.js.map