@deck.gl/experimental-layers/dist/esm/path-outline-layer/path-outline-layer.js

Experimental layers for deck.gl

function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a 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); } }

function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }

function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }

function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }

function _get(target, property, receiver) { if (typeof Reflect !== "undefined" && Reflect.get) { _get = Reflect.get; } else { _get = function _get(target, property, receiver) { var base = _superPropBase(target, property); if (!base) return; var desc = Object.getOwnPropertyDescriptor(base, property); if (desc.get) { return desc.get.call(receiver); } return desc.value; }; } return _get(target, property, receiver || target); }

function _superPropBase(object, property) { while (!Object.prototype.hasOwnProperty.call(object, property)) { object = _getPrototypeOf(object); if (object === null) break; } return object; }

function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }

function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }

import { PathLayer } from '@deck.gl/layers';
import GL from 'luma.gl/constants';
import { Framebuffer, Texture2D } from 'luma.gl';
import outline from '../shaderlib/outline/outline'; // TODO - this should be built into assembleShaders

function injectShaderCode(_ref) {
  var source = _ref.source,
      _ref$declarations = _ref.declarations,
      declarations = _ref$declarations === void 0 ? '' : _ref$declarations,
      _ref$code = _ref.code,
      code = _ref$code === void 0 ? '' : _ref$code;
  var INJECT_DECLARATIONS = /^/;
  var INJECT_CODE = /}[^{}]*$/;
  return source.replace(INJECT_DECLARATIONS, declarations).replace(INJECT_CODE, code.concat('\n}\n'));
}

var VS_DECLARATIONS = "#ifdef MODULE_OUTLINE\n  attribute float instanceZLevel;\n#endif\n";
var VS_CODE = "#ifdef MODULE_OUTLINE\n  outline_setUV(gl_Position);\n  outline_setZLevel(instanceZLevel);\n#endif\n";
var FS_CODE = "#ifdef MODULE_OUTLINE\n  gl_FragColor = outline_filterColor(gl_FragColor);\n#endif\n";
var defaultProps = {
  getZLevel: {
    type: 'accessor',
    value: 0
  }
};

var PathOutlineLayer =
/*#__PURE__*/
function (_PathLayer) {
  _inherits(PathOutlineLayer, _PathLayer);

  function PathOutlineLayer() {
    _classCallCheck(this, PathOutlineLayer);

    return _possibleConstructorReturn(this, _getPrototypeOf(PathOutlineLayer).apply(this, arguments));
  }

  _createClass(PathOutlineLayer, [{
    key: "getShaders",
    // Override getShaders to inject the outline module
    value: function getShaders() {
      var shaders = _get(_getPrototypeOf(PathOutlineLayer.prototype), "getShaders", this).call(this);

      return Object.assign({}, shaders, {
        modules: shaders.modules.concat([outline]),
        vs: injectShaderCode({
          source: shaders.vs,
          declarations: VS_DECLARATIONS,
          code: VS_CODE
        }),
        fs: injectShaderCode({
          source: shaders.fs,
          code: FS_CODE
        })
      });
    }
  }, {
    key: "initializeState",
    value: function initializeState(context) {
      _get(_getPrototypeOf(PathOutlineLayer.prototype), "initializeState", this).call(this, context); // Create an outline "shadow" map
      // TODO - we should create a single outlineMap for all layers


      this.setState({
        outlineFramebuffer: new Framebuffer(context.gl),
        dummyTexture: new Texture2D(context.gl)
      }); // Create an attribute manager

      this.state.attributeManager.addInstanced({
        instanceZLevel: {
          size: 1,
          type: GL.UNSIGNED_BYTE,
          update: this.calculateZLevels,
          accessor: 'getZLevel'
        }
      });
    } // Override draw to add render module

  }, {
    key: "draw",
    value: function draw(_ref2) {
      var _ref2$moduleParameter = _ref2.moduleParameters,
          moduleParameters = _ref2$moduleParameter === void 0 ? {} : _ref2$moduleParameter,
          parameters = _ref2.parameters,
          uniforms = _ref2.uniforms,
          context = _ref2.context;
      // Need to calculate same uniforms as base layer
      var _this$props = this.props,
          rounded = _this$props.rounded,
          miterLimit = _this$props.miterLimit,
          widthScale = _this$props.widthScale,
          widthMinPixels = _this$props.widthMinPixels,
          widthMaxPixels = _this$props.widthMaxPixels,
          dashJustified = _this$props.dashJustified;
      uniforms = Object.assign({}, uniforms, {
        jointType: Number(rounded),
        alignMode: Number(dashJustified),
        widthScale: widthScale,
        miterLimit: miterLimit,
        widthMinPixels: widthMinPixels,
        widthMaxPixels: widthMaxPixels
      }); // Render the outline shadowmap (based on segment z orders)

      var _this$state = this.state,
          outlineFramebuffer = _this$state.outlineFramebuffer,
          dummyTexture = _this$state.dummyTexture;
      outlineFramebuffer.resize();
      outlineFramebuffer.clear({
        color: true,
        depth: true
      });
      this.state.model.updateModuleSettings({
        outlineEnabled: true,
        outlineRenderShadowmap: true,
        outlineShadowmap: dummyTexture
      });
      this.state.model.draw({
        uniforms: Object.assign({}, uniforms, {
          jointType: 0,
          widthScale: this.props.widthScale * 1.3
        }),
        parameters: {
          depthTest: false,
          blendEquation: GL.MAX // Biggest value needs to go into buffer

        },
        framebuffer: outlineFramebuffer
      }); // Now use the outline shadowmap to render the lines (with outlines)

      this.state.model.updateModuleSettings({
        outlineEnabled: true,
        outlineRenderShadowmap: false,
        outlineShadowmap: outlineFramebuffer
      });
      this.state.model.draw({
        uniforms: Object.assign({}, uniforms, {
          jointType: Number(rounded),
          widthScale: this.props.widthScale
        }),
        parameters: {
          depthTest: false
        }
      });
    }
  }, {
    key: "calculateZLevels",
    value: function calculateZLevels(attribute) {
      var getZLevel = this.props.getZLevel;
      var pathTesselator = this.state.pathTesselator;
      attribute.value = pathTesselator._updateAttribute({
        target: attribute.value,
        size: 1,
        getValue: function getValue(object, index) {
          return [getZLevel(object, index) || 0];
        }
      });
    }
  }]);

  return PathOutlineLayer;
}(PathLayer);

export { PathOutlineLayer as default };
PathOutlineLayer.layerName = 'PathOutlineLayer';
PathOutlineLayer.defaultProps = defaultProps;
//# sourceMappingURL=path-outline-layer.js.map