liabru-matter-js/demo/lib/matter-tools.gui.js

/*!
 * matter-tools 0.12.3 by @liabru 2021-01-16
 * https://github.com/liabru/matter-tools
 * License MIT
 * 
 * The MIT License (MIT)
 * 
 * Copyright (c) 2014 Liam Brummitt
 * 
 * Permission is hereby granted, free of charge, to any person obtaining a copy
 * of this software and associated documentation files (the "Software"), to deal
 * in the Software without restriction, including without limitation the rights
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 * copies of the Software, and to permit persons to whom the Software is
 * furnished to do so, subject to the following conditions:
 * 
 * The above copyright notice and this permission notice shall be included in
 * all copies or substantial portions of the Software.
 * 
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 * THE SOFTWARE.
 */
(function webpackUniversalModuleDefinition(root, factory) {
	if(typeof exports === 'object' && typeof module === 'object')
		module.exports = factory(require("matter-js"), require("matter-tools"));
	else if(typeof define === 'function' && define.amd)
		define("Gui", ["matter-js", "matter-tools"], factory);
	else if(typeof exports === 'object')
		exports["Gui"] = factory(require("matter-js"), require("matter-tools"));
	else
		root["MatterTools"] = root["MatterTools"] || {}, root["MatterTools"]["Gui"] = factory(root["Matter"], root["MatterTools"]);
})(this, function(__WEBPACK_EXTERNAL_MODULE__0__, __WEBPACK_EXTERNAL_MODULE__1__) {
return /******/ (function(modules) { // webpackBootstrap
/******/ 	// The module cache
/******/ 	var installedModules = {};
/******/
/******/ 	// The require function
/******/ 	function __webpack_require__(moduleId) {
/******/
/******/ 		// Check if module is in cache
/******/ 		if(installedModules[moduleId]) {
/******/ 			return installedModules[moduleId].exports;
/******/ 		}
/******/ 		// Create a new module (and put it into the cache)
/******/ 		var module = installedModules[moduleId] = {
/******/ 			i: moduleId,
/******/ 			l: false,
/******/ 			exports: {}
/******/ 		};
/******/
/******/ 		// Execute the module function
/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ 		// Flag the module as loaded
/******/ 		module.l = true;
/******/
/******/ 		// Return the exports of the module
/******/ 		return module.exports;
/******/ 	}
/******/
/******/
/******/ 	// expose the modules object (__webpack_modules__)
/******/ 	__webpack_require__.m = modules;
/******/
/******/ 	// expose the module cache
/******/ 	__webpack_require__.c = installedModules;
/******/
/******/ 	// define getter function for harmony exports
/******/ 	__webpack_require__.d = function(exports, name, getter) {
/******/ 		if(!__webpack_require__.o(exports, name)) {
/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ 		}
/******/ 	};
/******/
/******/ 	// define __esModule on exports
/******/ 	__webpack_require__.r = function(exports) {
/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ 		}
/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
/******/ 	};
/******/
/******/ 	// create a fake namespace object
/******/ 	// mode & 1: value is a module id, require it
/******/ 	// mode & 2: merge all properties of value into the ns
/******/ 	// mode & 4: return value when already ns object
/******/ 	// mode & 8|1: behave like require
/******/ 	__webpack_require__.t = function(value, mode) {
/******/ 		if(mode & 1) value = __webpack_require__(value);
/******/ 		if(mode & 8) return value;
/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ 		var ns = Object.create(null);
/******/ 		__webpack_require__.r(ns);
/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ 		return ns;
/******/ 	};
/******/
/******/ 	// getDefaultExport function for compatibility with non-harmony modules
/******/ 	__webpack_require__.n = function(module) {
/******/ 		var getter = module && module.__esModule ?
/******/ 			function getDefault() { return module['default']; } :
/******/ 			function getModuleExports() { return module; };
/******/ 		__webpack_require__.d(getter, 'a', getter);
/******/ 		return getter;
/******/ 	};
/******/
/******/ 	// Object.prototype.hasOwnProperty.call
/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ 	// __webpack_public_path__
/******/ 	__webpack_require__.p = "/demo/lib";
/******/
/******/
/******/ 	// Load entry module and return exports
/******/ 	return __webpack_require__(__webpack_require__.s = 11);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/***/ (function(module, exports) {

module.exports = __WEBPACK_EXTERNAL_MODULE__0__;

/***/ }),
/* 1 */
/***/ (function(module, exports) {

module.exports = __WEBPACK_EXTERNAL_MODULE__1__;

/***/ }),
/* 2 */
/***/ (function(module, exports, __webpack_require__) {

"use strict";


/**
* @class Common
*/

const Common = module.exports = {};

Common.injectStyles = function(styles, id) {
  if (document.getElementById(id)) {
    return;
  }

  let root = document.createElement('div');
  root.innerHTML = `<style id="${id}" type="text/css">${styles}</style>`;

  let lastStyle = document.head.querySelector('style:last-of-type');

  if (lastStyle) {
    Common.domInsertBefore(root.firstElementChild, lastStyle);
  } else {
    document.head.appendChild(root.firstElementChild);
  }
};

Common.injectScript = function(url, id, callback) {
  if (document.getElementById(id)) {
    return;
  }

  let script = document.createElement('script');
  script.id = id;
  script.src = url;
  script.onload = callback;

  document.body.appendChild(script);
};

Common.domRemove = function(element) {
  return element.parentElement.removeChild(element);
};

Common.domInsertBefore = function(element, before) {
  return before.parentNode.insertBefore(element, before.previousElementSibling);
};


/***/ }),
/* 3 */,
/* 4 */,
/* 5 */,
/* 6 */,
/* 7 */,
/* 8 */,
/* 9 */,
/* 10 */,
/* 11 */
/***/ (function(module, exports, __webpack_require__) {

"use strict";


/**
 * A tool for modifying the properties of an engine and renderer.
 * @module Gui
 */

var Gui = module.exports = {};

const dat = __webpack_require__(12);
const ToolsCommon = __webpack_require__(2);
const Serializer = __webpack_require__(1).Serializer;

const Matter = __webpack_require__(0);
const Engine = Matter.Engine;
const Detector = Matter.Detector;
const Grid = Matter.Grid;
const World = Matter.World;
const Bodies = Matter.Bodies;
const Events = Matter.Events;
const Composite = Matter.Composite;

/**
 * Creates a Gui
 * @function Gui.create
 * @param {engine} [engine]
 * @param {runner} [runner]
 * @param {render} [render]
 * @return {gui} The created gui instance
 */
Gui.create = function(engine, runner, render) {
  dat.GUI.TEXT_CLOSED = '▲';
  dat.GUI.TEXT_OPEN = '▼';

  var datGui = new dat.GUI({ autoPlace: false });

  var gui = {
    engine: engine,
    runner: runner,
    render: render,
    datGui: datGui,
    broadphase: 'grid',
    broadphaseCache: {
      grid: (engine.broadphase.controller === Grid) ? engine.broadphase : Grid.create(),
      bruteForce: {
        detector: Detector.bruteForce
      }
    },
    amount: 1,
    size: 40,
    sides: 4,
    density: 0.001,
    restitution: 0,
    friction: 0.1,
    frictionStatic: 0.5,
    frictionAir: 0.01,
    offset: { x: 0, y: 0 },
    renderer: 'canvas',
    chamfer: 0,
    isRecording: false
  };
  
  if (Serializer) {
    gui.serializer = Serializer.create();
  }

  let styles = __webpack_require__(13);
  ToolsCommon.injectStyles(styles, 'matter-gui-style');

  _initDatGui(gui);

  return gui;
};

/**
 * Updates the Gui
 * @function Gui.update
 * @param {gui} gui
 */
Gui.update = function(gui) {
  var i;
  var datGui = gui.datGui;
  
  for (i in datGui.__folders) {
    Gui.update(gui, datGui.__folders[i]);
  }
  
  for (i in datGui.__controllers) {
    var controller = datGui.__controllers[i];
    if (controller.updateDisplay)
      controller.updateDisplay();
  }
};

/**
 * Closes all sections of the Gui
 * @function Gui.closeAll
 * @param {gui} gui
 */
Gui.closeAll = function(gui) {
  var datGui = gui.datGui;
  
  for (var i in datGui.__folders) {
    datGui.__folders[i].close();
  }
};

/**
 * Destroys the GUI
 * @function Gui.destroy
 * @param {gui} gui
 */
Gui.destroy = function(gui) {
  gui.datGui.domElement.parentElement.removeChild(gui.datGui.domElement);
  gui.datGui.destroy();
};

var _initDatGui = function(gui) {
  var engine = gui.engine,
    runner = gui.runner,
    datGui = gui.datGui;

  var funcs = {
    addBody: function() { _addBody(gui); },
    clear: function() { _clear(gui); },
    save: function() { Serializer.saveState(gui.serializer, engine, 'guiState'); Events.trigger(gui, 'save'); },
    load: function() { Serializer.loadState(gui.serializer, engine, 'guiState'); Events.trigger(gui, 'load'); }
  };

  var metrics = datGui.addFolder('Metrics');

  if (runner) {
    metrics.add(runner, 'fps').listen();
  }

  if (engine.metrics.extended) {
    if (runner) {
      metrics.add(runner, 'delta').listen();
      metrics.add(runner, 'correction').listen();
    }

    if (engine) {
      metrics.add(engine.metrics, 'bodies').listen();
      metrics.add(engine.metrics, 'collisions').listen();
      metrics.add(engine.metrics, 'pairs').listen();
      metrics.add(engine.metrics, 'broadEff').listen();
      metrics.add(engine.metrics, 'midEff').listen();
      metrics.add(engine.metrics, 'narrowEff').listen();
      metrics.add(engine.metrics, 'narrowReuse').listen();
    }
    
    metrics.open();
  }

  if (engine) {
    var controls = datGui.addFolder('Add Body');
    controls.add(gui, 'amount', 1, 5).step(1);
    controls.add(gui, 'size', 5, 150).step(1);
    controls.add(gui, 'sides', 1, 8).step(1);
    controls.add(gui, 'density', 0.0001, 0.01).step(0.001);
    controls.add(gui, 'friction', 0, 1).step(0.05);
    controls.add(gui, 'frictionStatic', 0, 10).step(0.1);
    controls.add(gui, 'frictionAir', 0, gui.frictionAir * 10).step(gui.frictionAir / 10);
    controls.add(gui, 'restitution', 0, 1).step(0.1);
    controls.add(gui, 'chamfer', 0, 30).step(2);
    controls.add(funcs, 'addBody');
    controls.open();

    var worldGui = datGui.addFolder('World');

    if (gui.serializer) {
      worldGui.add(funcs, 'load');
      worldGui.add(funcs, 'save');
    }

    worldGui.add(funcs, 'clear');
    worldGui.open();
    
    var gravity = datGui.addFolder('Gravity');
    gravity.add(engine.world.gravity, 'scale', 0, 0.001).step(0.0001);
    gravity.add(engine.world.gravity, 'x', -1, 1).step(0.01);
    gravity.add(engine.world.gravity, 'y', -1, 1).step(0.01);

    var physics = datGui.addFolder('Engine');
    physics.add(engine, 'enableSleeping');

    physics.add(engine.timing, 'timeScale', 0, 1.2).step(0.05).listen();
    physics.add(engine, 'velocityIterations', 1, 10).step(1);
    physics.add(engine, 'positionIterations', 1, 10).step(1);
    physics.add(engine, 'constraintIterations', 1, 10).step(1);

    if (runner) {
      physics.add(runner, 'enabled');
    }
  }

  if (gui.render) {
    var render = datGui.addFolder('Render');

    render
      .add(gui.render.options, 'wireframes')
      .onFinishChange(function(value) {
        if (!value) {
          angleIndicatorWidget.setValue(false);
          axesWidget.setValue(false);
        }
      });

    render.add(gui.render.options, 'showDebug');
    render.add(gui.render.options, 'showPositions');
    render.add(gui.render.options, 'showBroadphase');
    render.add(gui.render.options, 'showBounds');
    render.add(gui.render.options, 'showVelocity');
    render.add(gui.render.options, 'showCollisions');
    render.add(gui.render.options, 'showSeparations');
    var axesWidget = render.add(gui.render.options, 'showAxes');
    var angleIndicatorWidget = render.add(gui.render.options, 'showAngleIndicator');
    render.add(gui.render.options, 'showSleeping');
    render.add(gui.render.options, 'showIds');
    render.add(gui.render.options, 'showVertexNumbers');
    render.add(gui.render.options, 'showConvexHulls');
    render.add(gui.render.options, 'showInternalEdges');
    render.add(gui.render.options, 'enabled');
    render.open();
  }

  document.body.appendChild(gui.datGui.domElement);
};

var _addBody = function(gui) {
  var engine = gui.engine;

  var options = { 
    density: gui.density,
    friction: gui.friction,
    frictionStatic: gui.frictionStatic,
    frictionAir: gui.frictionAir,
    restitution: gui.restitution
  };

  if (gui.chamfer && gui.sides > 2) {
    options.chamfer = {
      radius: gui.chamfer
    };
  }

  for (var i = 0; i < gui.amount; i++) {
    World.add(engine.world, Bodies.polygon(gui.offset.x + 120 + i * gui.size + i * 50, gui.offset.y + 200, gui.sides, gui.size, options));
  }
};

var _clear = function(gui) {
  var engine = gui.engine,
    constraints = Composite.allConstraints(engine.world),
    mouseConstraint = null;

  // find mouse constraints
  for (var i = 0; i < constraints.length; i += 1) {
    var constraint = constraints[i];

    // TODO: need a better way than this
    if (constraint.label === 'Mouse Constraint') {
      mouseConstraint = constraint;
      break;
    }
  }
  
  World.clear(engine.world, true);
  Engine.clear(engine);

  // add mouse constraint back in
  if (mouseConstraint) {
    Composite.add(engine.world, mouseConstraint);
  }

  // clear scene graph (if defined in controller)
  if (gui.render) {
    var renderController = gui.render.controller;
    if (renderController.clear)
      renderController.clear(gui.render);
  }

  Events.trigger(gui, 'clear');
};

/*
*
*  Events Documentation
*
*/

/**
* Fired after the gui's clear button pressed
*
* @event clear
* @param {} event An event object
* @param {} event.source The source object of the event
* @param {} event.name The name of the event
*/

/**
* Fired after the gui's save button pressed
*
* @event save
* @param {} event An event object
* @param {} event.source The source object of the event
* @param {} event.name The name of the event
*/

/**
* Fired after the gui's load button pressed
*
* @event load
* @param {} event An event object
* @param {} event.source The source object of the event
* @param {} event.name The name of the event
*/

/***/ }),
/* 12 */
/***/ (function(module, exports, __webpack_require__) {

/**
 * dat-gui JavaScript Controller Library
 * http://code.google.com/p/dat-gui
 *
 * 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(e,t){ true?t(exports):undefined}(this,function(e){"use strict";function t(e,t){var n=e.__state.conversionName.toString(),o=Math.round(e.r),i=Math.round(e.g),r=Math.round(e.b),s=e.a,a=Math.round(e.h),l=e.s.toFixed(1),d=e.v.toFixed(1);if(t||"THREE_CHAR_HEX"===n||"SIX_CHAR_HEX"===n){for(var c=e.hex.toString(16);c.length<6;)c="0"+c;return"#"+c}return"CSS_RGB"===n?"rgb("+o+","+i+","+r+")":"CSS_RGBA"===n?"rgba("+o+","+i+","+r+","+s+")":"HEX"===n?"0x"+e.hex.toString(16):"RGB_ARRAY"===n?"["+o+","+i+","+r+"]":"RGBA_ARRAY"===n?"["+o+","+i+","+r+","+s+"]":"RGB_OBJ"===n?"{r:"+o+",g:"+i+",b:"+r+"}":"RGBA_OBJ"===n?"{r:"+o+",g:"+i+",b:"+r+",a:"+s+"}":"HSV_OBJ"===n?"{h:"+a+",s:"+l+",v:"+d+"}":"HSVA_OBJ"===n?"{h:"+a+",s:"+l+",v:"+d+",a:"+s+"}":"unknown format"}function n(e,t,n){Object.defineProperty(e,t,{get:function(){return"RGB"===this.__state.space?this.__state[t]:(I.recalculateRGB(this,t,n),this.__state[t])},set:function(e){"RGB"!==this.__state.space&&(I.recalculateRGB(this,t,n),this.__state.space="RGB"),this.__state[t]=e}})}function o(e,t){Object.defineProperty(e,t,{get:function(){return"HSV"===this.__state.space?this.__state[t]:(I.recalculateHSV(this),this.__state[t])},set:function(e){"HSV"!==this.__state.space&&(I.recalculateHSV(this),this.__state.space="HSV"),this.__state[t]=e}})}function i(e){if("0"===e||S.isUndefined(e))return 0;var t=e.match(U);return S.isNull(t)?0:parseFloat(t[1])}function r(e){var t=e.toString();return t.indexOf(".")>-1?t.length-t.indexOf(".")-1:0}function s(e,t){var n=Math.pow(10,t);return Math.round(e*n)/n}function a(e,t,n,o,i){return o+(e-t)/(n-t)*(i-o)}function l(e,t,n,o){e.style.background="",S.each(ee,function(i){e.style.cssText+="background: "+i+"linear-gradient("+t+", "+n+" 0%, "+o+" 100%); "})}function d(e){e.style.background="",e.style.cssText+="background: -moz-linear-gradient(top,  #ff0000 0%, #ff00ff 17%, #0000ff 34%, #00ffff 50%, #00ff00 67%, #ffff00 84%, #ff0000 100%);",e.style.cssText+="background: -webkit-linear-gradient(top,  #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);",e.style.cssText+="background: -o-linear-gradient(top,  #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);",e.style.cssText+="background: -ms-linear-gradient(top,  #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);",e.style.cssText+="background: linear-gradient(top,  #ff0000 0%,#ff00ff 17%,#0000ff 34%,#00ffff 50%,#00ff00 67%,#ffff00 84%,#ff0000 100%);"}function c(e,t,n){var o=document.createElement("li");return t&&o.appendChild(t),n?e.__ul.insertBefore(o,n):e.__ul.appendChild(o),e.onResize(),o}function u(e){X.unbind(window,"resize",e.__resizeHandler),e.saveToLocalStorageIfPossible&&X.unbind(window,"unload",e.saveToLocalStorageIfPossible)}function _(e,t){var n=e.__preset_select[e.__preset_select.selectedIndex];n.innerHTML=t?n.value+"*":n.value}function h(e,t,n){if(n.__li=t,n.__gui=e,S.extend(n,{options:function(t){if(arguments.length>1){var o=n.__li.nextElementSibling;return n.remove(),f(e,n.object,n.property,{before:o,factoryArgs:[S.toArray(arguments)]})}if(S.isArray(t)||S.isObject(t)){var i=n.__li.nextElementSibling;return n.remove(),f(e,n.object,n.property,{before:i,factoryArgs:[t]})}},name:function(e){return n.__li.firstElementChild.firstElementChild.innerHTML=e,n},listen:function(){return n.__gui.listen(n),n},remove:function(){return n.__gui.remove(n),n}}),n instanceof q){var o=new Q(n.object,n.property,{min:n.__min,max:n.__max,step:n.__step});S.each(["updateDisplay","onChange","onFinishChange","step","min","max"],function(e){var t=n[e],i=o[e];n[e]=o[e]=function(){var e=Array.prototype.slice.call(arguments);return i.apply(o,e),t.apply(n,e)}}),X.addClass(t,"has-slider"),n.domElement.insertBefore(o.domElement,n.domElement.firstElementChild)}else if(n instanceof Q){var i=function(t){if(S.isNumber(n.__min)&&S.isNumber(n.__max)){var o=n.__li.firstElementChild.firstElementChild.innerHTML,i=n.__gui.__listening.indexOf(n)>-1;n.remove();var r=f(e,n.object,n.property,{before:n.__li.nextElementSibling,factoryArg


/***/ }),
/* 13 */
/***/ (function(module, exports) {

module.exports = "/*\n*\tMatterTools.Gui\n*/\n\nbody .dg .c,\nbody .dg .cr.function,\nbody .dg .c select,\nbody .dg .property-name,\nbody .dg .title {\n  -webkit-touch-callout: none;\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n}\n\nbody .dg.main {\n  z-index: 10;\n  height: 100%;\n  background: #14151f;\n  position: fixed;\n  top: 0;\n  right: 0;\n  padding: 48px 0 0 0;\n  box-shadow: 0 0 7px rgba(0, 0, 0, 0.1);\n}\n\nbody .dg.main,\nbody .dg.main * {\n  box-sizing: border-box;\n  font-family: \"Helvetica Neue\", Helvetica, Arial, \"Lucida Grande\", sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\nbody .dg.main *:focus,\nbody .dg.main *:active {\n  outline: 0;\n}\n\nbody .dg.main *:-moz-focusring {\n  outline: 3px solid #4da4e4;\n  outline-offset: -1px;\n  z-index: 5;\n}\n\nbody .dg.main *:focus-visible {\n  outline: 3px solid #4da4e4;\n  outline-offset: -1px;\n  z-index: 5;\n}\n\nbody .dg.ac {\n  position: static;\n  top: inherit;\n  left: inherit;\n  bottom: inherit;\n  right: inherit;\n}\n\nbody .dg.main {\n  transform: translate(230px, 0);\n  transition: transform ease;\n  transition-delay: 2000ms;\n  transition-duration: 300ms;\n}\n\nbody .dg.main:hover {\n  transform: translate(0, 0);\n  transition-delay: 0ms;\n  transition-duration: 400ms;\n}\n\n@media only screen and (min-width: 1300px) {\n  body .dg.main,\n  body .dg.main:hover {\n    transition-delay: 0ms;\n    transform: translate(0, 0);\n  }\n}\n\nbody .dg.main .close-button {\n  display: none;\n}\n\nbody .dg.main > ul {\n  height: 100%;\n  background: #191921;\n  overflow-y: auto;\n  scrollbar-color: #0d0f1b #0d0f1b;\n  scrollbar-width: thin;\n}\n\nbody .dg.main > ul:hover {\n  scrollbar-color: #44444e #0d0f1b;\n  scrollbar-width: thin;\n}\n\nbody .dg.main > ul::-webkit-scrollbar {\n  background: #0d0f1b;\n  width: 6px;\n  height: 6px;\n}\n\nbody .dg.main > ul::-webkit-scrollbar-track,\nbody .dg.main > ul::-webkit-scrollbar-corner {\n  background: #0d0f1b;\n}\n\nbody .dg.main > ul::-webkit-scrollbar-thumb {\n  background: #0d0f1b;\n  border-radius: 3px;\n}\n\nbody .dg.main > ul:hover::-webkit-scrollbar-thumb {\n  background: #44444e;\n}\n\nbody .dg {\n  color: #6d6d7d;\n  text-shadow: none !important;\n  font-size: 12px;\n}\n\nbody .dg .closed .cr {\n  display: none;\n}\n\nbody .dg li:not(.folder) {\n  height: 29px;\n  background: #1c1c25;\n  border-bottom: 0px;\n  padding: 0 8px 0 12px;\n}\n\nbody .dg li.save-row .button {\n  text-shadow: none !important;\n}\n\nbody .dg li.title {\n  padding: 2px 0 0 24px;\n  color: #6a6977;\n  background: #0d0f1b\n    url(data:image/gif;base64,R0lGODlhBQAFAJEAAP////Pz8////////yH5BAEAAAIALAAAAAAFAAUAAAIIlI+hKgFxoCgAOw==)\n    no-repeat;\n  background-position: 12px;\n}\n\nbody .dg li.title:hover {\n  color: #9494a2;\n}\n\nbody .dg .cr.boolean:hover {\n  background: #20212b;\n}\n\nbody .dg .cr.function {\n  background: #262731;\n  color: #636371;\n  border-top: 1px solid #30313c;\n}\n\nbody .dg .cr.function:hover {\n  background: #30313e;\n}\n\nbody .dg .cr.function:active {\n  background: #2d2e3a;\n}\n\nbody .dg .cr.function:active .property-name {\n  transform: translateY(1px);\n}\n\nbody .dg .c,\nbody .dg .property-name {\n  width: 50%;\n}\n\nbody .dg .c select {\n  margin-top: 2px;\n  margin-left: -5px;\n  padding: 3px 5px;\n}\n\nbody .dg .c select,\nbody .dg .c input[type=\"text\"],\nbody .dg .cr.number input[type=\"text\"] {\n  text-align: right;\n  background: transparent;\n  color: #686c7b;\n  border: 0;\n  border-radius: 2px;\n  overflow: hidden;\n  font-size: 11px;\n}\n\nbody .dg .cr.number,\nbody .dg .cr.boolean,\nbody .dg .cr.function {\n  border-left: 0;\n}\n\nbody .dg .c select,\nbody .dg .c select:focus {\n  width: 88px;\n}\n\nbody .dg .c input[type=\"text\"]:hover {\n  background: #2b2c3a;\n}\n\nbody .dg .c input[type=\"text\"]:focus {\n  background: #2b2c3a;\n  color: #fff;\n  outline: none;\n}\n\nbody .dg .c input[type=\"checkbox\"] {\n  margin-top: 10px;\n  border: none;\n  border-radius: 50%;\n  

/***/ })
/******/ ]);
});