@openglobus/og 0.15.0 → 0.15.2

package/src/og/scene/Planet.js

@@ -4,43 +4,39 @@
 
 "use strict";
 
-import * as utils from "../utils/shared.js";
-import * as shaders from "../shaders/drawnode.js";
-import * as math from "../math.js";
-import * as mercator from "../mercator.js";
-import * as segmentHelper from "../segment/segmentHelper.js";
-import { decodeFloatFromRGBAArr } from "../math/coder.js";
+import { PlanetCamera } from "../camera/PlanetCamera.js";
+import { Atmosphere } from "../control/Atmosphere.js";
+import { SimpleSkyBackground } from "../control/SimpleSkyBackground.js";
+import { wgs84 } from "../ellipsoid/wgs84.js";
 import { Extent } from "../Extent.js";
-import { Framebuffer } from "../webgl/Framebuffer.js";
-import { GeoImageCreator } from "../utils/GeoImageCreator.js";
-import { Quat, Vec3, Vec4 } from "../math/index.js";
 import { Vector } from "../layer/Vector.js";
-import { Loader } from "../utils/Loader.js";
 import { Key, Lock } from "../Lock.js";
 import { LonLat } from "../LonLat.js";
-import { Node } from "../quadTree/Node.js";
+import * as math from "../math.js";
+import { decodeFloatFromRGBAArr } from "../math/coder.js";
+import { Quat, Vec3, Vec4 } from "../math/index.js";
+import { EarthQuadTreeStrategy } from "../quadTree/EarthQuadTreeStrategy.js";
+import { NIGHT, SPECULAR } from "../res/images.js";
+import * as segmentHelper from "../segment/segmentHelper.js";
+import * as shaders from "../shaders/drawnode.js";
+import { Geoid } from "../terrain/Geoid.js";
+import { GeoImageCreator } from "../utils/GeoImageCreator.js";
+import { Loader } from "../utils/Loader.js";
 import { NormalMapCreator } from "../utils/NormalMapCreator.js";
-import { PlanetCamera } from "../camera/PlanetCamera.js";
-import { RenderNode } from "./RenderNode.js";
-import { Segment } from "../segment/Segment.js";
-import { SegmentLonLat } from "../segment/SegmentLonLat.js";
 import { PlainSegmentWorker } from "../utils/PlainSegmentWorker.js";
+import * as utils from "../utils/shared.js";
+import { createColorRGB, isUndef } from "../utils/shared.js";
 import { TerrainWorker } from "../utils/TerrainWorker.js";
 import { VectorTileCreator } from "../utils/VectorTileCreator.js";
-import { wgs84 } from "../ellipsoid/wgs84.js";
-import { NIGHT, SPECULAR } from "../res/images.js";
-import { Geoid } from "../terrain/Geoid.js";
-import { createColorRGB, isUndef } from "../utils/shared.js";
-import { MAX_RENDERED_NODES } from "../quadTree/quadTree.js";
-import { EarthQuadTreeStrategy } from "../quadTree/EarthQuadTreeStrategy.js";
-import { SimpleSkyBackground } from "../control/SimpleSkyBackground.js";
-import { Atmosphere } from "../control/Atmosphere.js";
+import { Framebuffer } from "../webgl/Framebuffer.js";
+import { RenderNode } from "./RenderNode.js";
 
 const CUR_LOD_SIZE = 250; //px
 const MIN_LOD_SIZE = 312; //px
 const MAX_LOD_SIZE = 190; //px
 
-let _tempPickingPix_ = new Uint8Array(4), _tempDepthColor_ = new Uint8Array(4);
+let _tempPickingPix_ = new Uint8Array(4);
+let _tempDepthColor_ = new Uint8Array(4);
 
 const DEPTH_DISTANCE = 11;//m
 
@@ -320,13 +316,6 @@ export class Planet extends RenderNode {
          */
         this._textureCoordsBufferCache = [];
 
-        /**
-         * Framebuffer for relief. Is null when WEBGL_draw_buffers extension initialized.
-         * @protected
-         * @type {Object}
-         */
-        this._heightPickingFramebuffer = null;
-
         this.quadTreeStrategy = options.quadTreeStrategyPrototype ? new options.quadTreeStrategyPrototype({ planet: this }) : new EarthQuadTreeStrategy({ planet: this });
 
         /**
@@ -342,10 +331,10 @@ export class Planet extends RenderNode {
         this._specularTexture = null;
 
         //TODO: replace to a function
-        let a = utils.createColorRGB(options.ambient, new Vec3(0.2, 0.2, 0.2));
-        let d = utils.createColorRGB(options.diffuse, new Vec3(0.8, 0.8, 0.8));
-        let s = utils.createColorRGB(options.specular, new Vec3(0.013, 0.005, 0.0));
-        let shininess = options.shininess || 27.0;
+        let a = utils.createColorRGB(options.ambient, new Vec3(0.2, 0.2, 0.3));
+        let d = utils.createColorRGB(options.diffuse, new Vec3(1.0, 1.0, 1.0));
+        let s = utils.createColorRGB(options.specular, new Vec3(0.00063, 0.00055, 0.00032));
+        let shininess = options.shininess || 18.0;
 
         this._ambient = new Float32Array([a.x, a.y, a.z]);
         this._diffuse = new Float32Array([d.x, d.y, d.z]);
@@ -430,7 +419,7 @@ export class Planet extends RenderNode {
          * Night texture brightness coefficient
          * @type {number}
          */
-        this.nightTextureCoefficient = 1.5;
+        this.nightTextureCoefficient = 2.0;
 
         this._renderScreenNodesPASS = this._renderScreenNodesPASSNoAtmos;
 
@@ -754,13 +743,7 @@ export class Planet extends RenderNode {
 
         this.renderer.addDepthCallback(this, this._renderDepthFramebufferPASS);
 
-        this._heightPickingFramebuffer = new Framebuffer(this.renderer.handler, {
-            width: 320, height: 240
-        });
-
-        this._heightPickingFramebuffer.init();
-
-        this.renderer.screenTexture.height = this._heightPickingFramebuffer.textures[0];
+        this.renderer.addDistanceCallback(this, this._renderDistanceFramebufferPASS);
     }
 
     _onLayerLoadend(layer) {
@@ -939,6 +922,10 @@ export class Planet extends RenderNode {
         });
     }
 
+    _getLayerAttributionHTML(layer) {
+        return `<div class="og-attribution__layer">${layer._attribution}</div>`;
+    }
+
     /**
      * Updates attribution lists
      * @public
@@ -949,11 +936,10 @@ export class Planet extends RenderNode {
             let li = this._layers[i];
             if (li._visibility) {
                 if (li._attribution.length) {
-                    html += "<li>" + li._attribution + "</li>";
+                    html += this._getLayerAttributionHTML(li);
                 }
             }
         }
-
         this._applyAttribution(html)
     }
 
@@ -990,7 +976,7 @@ export class Planet extends RenderNode {
                 }
 
                 if (li._attribution.length) {
-                    html += "<li>" + li._attribution + "</li>";
+                    html += this._getLayerAttributionHTML(li);
                 }
 
             } else if (li._fading && li._fadingOpacity > 0) {
@@ -1016,13 +1002,12 @@ export class Planet extends RenderNode {
     _applyAttribution(html) {
         if (this.renderer) {
             if (html.length) {
-                html = "<ul>" + html + "</ul>";
                 if (this.renderer.div.attributions.innerHTML !== html) {
-                    this.renderer.div.attributions.style.display = "block";
+                    //this.renderer.div.attributions.style.display = "block";
                     this.renderer.div.attributions.innerHTML = html;
                 }
             } else {
-                this.renderer.div.attributions.style.display = "none";
+                //this.renderer.div.attributions.style.display = "none";
                 this.renderer.div.attributions.innerHTML = "";
             }
         }
@@ -1128,6 +1113,10 @@ export class Planet extends RenderNode {
     _globalPreDraw() {
         let cam = this.camera;
 
+        // Might be it's better to replace it in setTerrain,
+        // but we have to be sure that setTerrain exists with renderer insttance
+        this.renderer.__useDistanceFramebuffer__ = !this.terrain.isEmpty;
+
         this._distBeforeMemClear += this._prevCamEye.distance(cam.eye);
         this._prevCamEye.copy(cam.eye);
         cam.checkFly();
@@ -1160,7 +1149,7 @@ export class Planet extends RenderNode {
 
         this._renderScreenNodesPASS();
 
-        this._renderHeightPickingFramebufferPASS();
+        //this._renderHeightPickingFramebufferPASS();
 
         this.drawEntityCollections(this._frustumEntityCollections);
     }
@@ -1326,8 +1315,6 @@ export class Planet extends RenderNode {
             }
         }
         gl.disable(gl.POLYGON_OFFSET_FILL);
-
-        gl.disable(gl.BLEND);
     }
 
     /**
@@ -1450,31 +1437,19 @@ export class Planet extends RenderNode {
             }
         }
         gl.disable(gl.POLYGON_OFFSET_FILL);
-
-        gl.disable(gl.BLEND);
     }
 
     /**
      * @protected
      */
-    _renderHeightPickingFramebufferPASS() {
+    _renderDistanceFramebufferPASS() {
         if (!this.terrain.isEmpty) {
 
-            this._heightPickingFramebuffer.activate();
-
             let sh;
             let renderer = this.renderer;
             let h = renderer.handler;
             let gl = h.gl;
             let cam = renderer.activeCamera;
-            let frustumIndex = cam.currentFrustumIndex;
-
-            if (frustumIndex === cam.FARTHEST_FRUSTUM_INDEX) {
-                gl.clearColor(0.0, 0.0, 0.0, 1.0);
-                gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
-            } else {
-                gl.clear(gl.DEPTH_BUFFER_BIT);
-            }
 
             h.programs.drawnode_heightPicking.activate();
             sh = h.programs.drawnode_heightPicking._program;
@@ -1487,14 +1462,13 @@ export class Planet extends RenderNode {
             gl.uniform3fv(shu.eyePositionLow, cam.eyeLow);
 
             // drawing planet nodes
-            let rn = this._renderedNodesInFrustum[frustumIndex], sl = this._visibleTileLayerSlices;
+            let rn = this._renderedNodesInFrustum[cam.currentFrustumIndex];
+            let sl = this._visibleTileLayerSlices;
 
             let i = rn.length;
             while (i--) {
                 rn[i].segment.heightPickingRendering(sh, sl[0]);
             }
-
-            this._heightPickingFramebuffer.deactivate();
         }
     }
 
@@ -1514,6 +1488,7 @@ export class Planet extends RenderNode {
         gl.blendEquation(gl.FUNC_ADD);
         gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
         gl.enable(gl.BLEND);
+
         gl.enable(gl.CULL_FACE);
 
         gl.uniformMatrix4fv(shu.viewMatrix, false, cam.getViewMatrix());
@@ -1523,7 +1498,8 @@ export class Planet extends RenderNode {
         gl.uniform3fv(shu.eyePositionLow, cam.eyeLow);
 
         // drawing planet nodes
-        var rn = this._renderedNodesInFrustum[cam.getCurrentFrustum()], sl = this._visibleTileLayerSlices;
+        let rn = this._renderedNodesInFrustum[cam.getCurrentFrustum()];
+        let sl = this._visibleTileLayerSlices;
 
         let i = rn.length;
         while (i--) {
@@ -1539,8 +1515,6 @@ export class Planet extends RenderNode {
             }
         }
         gl.disable(gl.POLYGON_OFFSET_FILL);
-
-        gl.disable(gl.BLEND);
     }
 
     /**
@@ -1574,6 +1548,8 @@ export class Planet extends RenderNode {
         while (i--) {
             rn[i].segment.depthRendering(sh, sl[0]);
         }
+
+        gl.enable(gl.BLEND);
     }
 
     _collectVectorLayerCollections() {
@@ -1762,23 +1738,19 @@ export class Planet extends RenderNode {
             return this.getDistanceFromPixelEllipsoid(px) || 0;
         } else {
 
-            let r = this.renderer, cnv = this.renderer.handler.canvas;
+            let r = this.renderer;
+            let cnv = this.renderer.handler.canvas;
 
-            let spx = px.x / cnv.width, spy = (cnv.height - px.y) / cnv.height;
+            let spx = px.x / cnv.width;
+            let spy = (cnv.height - px.y) / cnv.height;
 
             _tempPickingPix_[0] = _tempPickingPix_[1] = _tempPickingPix_[2] = 0.0;
 
             let dist = 0;
 
-            // HEIGHT
-            this._heightPickingFramebuffer.activate();
+            r.readDistanceColor(spx, spy, _tempPickingPix_);
 
-            //if (this._heightPickingFramebuffer.isComplete()) {
-            this._heightPickingFramebuffer.readPixels(_tempPickingPix_, spx, spy);
             dist = decodeFloatFromRGBAArr(_tempPickingPix_);
-            //}
-
-            this._heightPickingFramebuffer.deactivate();
 
             if (!(_tempPickingPix_[0] || _tempPickingPix_[1] || _tempPickingPix_[2])) {
                 dist = this.getDistanceFromPixelEllipsoid(px) || 0;

package/src/og/scene/RenderNode.js

@@ -1,7 +1,7 @@
 "use strict";
 
-import { BaseNode } from "./BaseNode.js";
 import { Events } from "../Events.js";
+import { BaseNode } from "./BaseNode.js";
 
 /**
  * Render node is a logical part of a render mechanism. Represents scene rendering.
@@ -294,12 +294,9 @@ class RenderNode extends BaseNode {
      */
     drawPickingEntityCollections(ec) {
         if (ec.length) {
-            var gl = this.renderer.handler.gl;
-
-            gl.disable(gl.CULL_FACE);
 
             // billoard pass
-            var i = ec.length;
+            let  i = ec.length;
             while (i--) {
                 ec[i]._fadingOpacity && ec[i].billboardHandler.drawPicking();
             }
@@ -322,20 +319,12 @@ class RenderNode extends BaseNode {
                 ec[i]._fadingOpacity && ec[i].rayHandler.drawPicking();
             }
 
-            gl.enable(gl.CULL_FACE);
-
             // polylines pass
             i = ec.length;
             while (i--) {
                 ec[i]._visibility && ec[i].polylineHandler.drawPicking();
             }
 
-            //shapes pass
-            i = ec.length;
-            while (i--) {
-                ec[i]._visibility && ec[i].shapeHandler.drawPicking();
-            }
-
             //Strip pass
             i = ec.length;
             while (i--) {

package/src/og/scene/SkyBox.js

@@ -105,4 +105,4 @@ class SkyBox extends RenderNode {
     }
 }
 
-export { SkyBox };
+export { SkyBox };

package/src/og/scene/index.js

@@ -1,5 +1,5 @@
-import { Planet } from "./Planet";
 import { Axes } from "./Axes";
+import { Planet } from "./Planet";
 import { SkyBox } from "./SkyBox";
 
-export { Planet, Axes, SkyBox };
+export { Planet, Axes, SkyBox };

package/src/og/segment/Segment.js

@@ -1,15 +1,15 @@
 "use strict";
 
-import * as mercator from "../mercator.js";
-import { N, E, S, W, OPSIDE, NOTRENDERING } from "../quadTree/quadTree.js";
-import { EPSG3857 } from "../proj/EPSG3857.js";
+import { Box } from "../bv/Box.js";
+import { Sphere } from "../bv/Sphere.js";
 import { Extent } from "../Extent.js";
 import { Layer } from "../layer/Layer.js";
 import { LonLat } from "../LonLat.js";
 import { Ray } from "../math/Ray.js";
-import { Sphere } from "../bv/Sphere.js";
-import { Box } from "../bv/Box.js";
 import { Vec3 } from "../math/Vec3.js";
+import * as mercator from "../mercator.js";
+import { EPSG3857 } from "../proj/EPSG3857.js";
+import { E, N, NOTRENDERING, OPSIDE, S, W } from "../quadTree/quadTree.js";
 import * as segmentHelper from "../segment/segmentHelper.js";
 import { getMatrixSubArray } from "../utils/shared.js";
 import { Slice } from "./Slice.js";

package/src/og/segment/SegmentLonLatWgs84.js

@@ -1,8 +1,7 @@
 "use strict";
 
-import { POLE_PIECE_SIZE, SegmentLonLat } from "./SegmentLonLat.js";
-import { Segment, TILEGROUP_COMMON } from "./Segment.js";
-import * as mercator from "../mercator.js";
+import { TILEGROUP_COMMON } from "./Segment.js";
+import { SegmentLonLat } from "./SegmentLonLat.js";
 
 export class SegmentLonLatWgs84 extends SegmentLonLat {
     constructor(node, planet, tileZoom, extent) {

package/src/og/shaders/drawnode.js

@@ -725,7 +725,7 @@ export function drawnode_screen_wl_webgl2Atmos() {
                 float maxDist = sqrt(c * c - BOTTOM_RADIUS * BOTTOM_RADIUS);
                 float minDist = c - BOTTOM_RADIUS;
                 float vertDist = distance(cameraPosition, v_vertex);                    
-                opacity = maxMinOpacity.y + ( maxMinOpacity.x -  maxMinOpacity.y) * getLerpValue(minDist, maxDist, vertDist);
+                opacity = clamp(maxMinOpacity.y + ( maxMinOpacity.x -  maxMinOpacity.y) * getLerpValue(minDist, maxDist, vertDist), 0.0, 1.0);
             }
 
             void main(void) {
@@ -768,6 +768,10 @@ export function drawnode_screen_wl_webgl2Atmos() {
                 
                 float fadingOpacity;
                 getAtmosFadingOpacity(fadingOpacity);
+                
+                getSunIlluminance(cameraPosition, viewDir * SPHERE_TO_ELLIPSOID_SCALE, sunIlluminance);
+                
+                spec *= sunIlluminance;
 
                 diffuseColor = texture( defaultTexture, vTextureCoord.xy );
                 if( samplerCount == 0 ) {

package/src/og/shaders/geoObject.js

@@ -176,7 +176,6 @@ export const geo_object_picking = () =>
             eyePositionHigh: "vec3",
             eyePositionLow: "vec3",
             pickingScale: "float"
-
         },
         attributes: {
             aVertexPosition: "vec3",
@@ -207,14 +206,12 @@ export const geo_object_picking = () =>
             uniform vec3 eyePositionHigh;
             uniform vec3 eyePositionLow;
 
-            varying float vDispose;
             varying vec3 vColor;
             
             const float RADIANS = 3.141592653589793 / 180.0;
 
             void main(void) {
-            
-             
+                         
                 if (aDispose == 0.0) {
                    return;
                 }
@@ -258,8 +255,7 @@ export const geo_object_picking = () =>
         fragmentShader:
             `precision highp float;
             varying vec3 vColor;
-            varying float vDispose;
             void main () {
-                gl_FragColor = vec4(vColor, vDispose);
+                gl_FragColor = vec4(vColor, 1.0);
             }`
     });

package/src/og/shaders/pickingMask.js

@@ -0,0 +1,31 @@
+/**
+ * @module og/shaders/pickingMask
+ */
+
+'use strict';
+
+import { Program } from '../webgl/Program.js';
+
+export function pickingMask() {
+    return new Program("pickingMask", {
+        uniforms: {
+            offset: "vec2"
+        },
+        attributes: {
+            coordinates: "vec2"
+        },
+        vertexShader:
+            `attribute vec2 coordinates;
+            uniform vec2 offset;
+            void main() {
+            
+                gl_Position = vec4(coordinates + offset, 0.0, 1.0);
+                gl_PointSize = 20.0;
+            }`,
+        fragmentShader:
+            `precision highp float;
+            void main(void) {
+                gl_FragColor = vec4(1.0);
+            }`
+    });
+}

package/src/og/terrain/BilTerrain.js

@@ -1,10 +1,10 @@
 "use strict";
 
-import { GlobusTerrain } from "./GlobusTerrain.js";
+import { Layer } from "../layer/Layer.js";
 import { WMS } from "../layer/WMS.js";
 import { isPowerOfTwo, nextHighestPowerOfTwo } from "../math.js";
 import { getTileExtent } from "../mercator.js";
-import { Layer } from "../layer/Layer.js";
+import { GlobusTerrain } from "./GlobusTerrain.js";
 
 class BilTerrain extends GlobusTerrain {
     constructor(options) {
@@ -34,8 +34,8 @@ class BilTerrain extends GlobusTerrain {
             options.plainGridSize != undefined
                 ? options.plainGridSize
                 : isPowerOfTwo(this._imageSize)
-                ? this._imageSize / 2
-                : nextHighestPowerOfTwo(this._imageSize) / 2;
+                    ? this._imageSize / 2
+                    : nextHighestPowerOfTwo(this._imageSize) / 2;
 
         this._dataType = "arrayBuffer";
     }

package/src/og/terrain/GlobusTerrain.js

@@ -3,19 +3,19 @@
  */
 "use strict";
 
+import { Events } from "../Events.js";
 import * as mercator from "../mercator.js";
-import { EmptyTerrain } from "./EmptyTerrain.js";
 import { EPSG3857 } from "../proj/EPSG3857.js";
-import { Events } from "../Events.js";
-import { Loader } from "../utils/Loader.js";
 import { NOTRENDERING } from "../quadTree/quadTree.js";
+import { Loader } from "../utils/Loader.js";
+import { EmptyTerrain } from "./EmptyTerrain.js";
 // import { QueueArray } from '../QueueArray.js';
-import { createExtent, stringTemplate } from "../utils/shared.js";
-import { Layer } from "../layer/Layer.js";
-import { Vec3 } from "../math/Vec3.js";
-import { Ray } from "../math/Ray.js";
 import { Extent } from "../Extent.js";
+import { Layer } from "../layer/Layer.js";
 import { LonLat } from "../LonLat.js";
+import { Ray } from "../math/Ray.js";
+import { Vec3 } from "../math/Vec3.js";
+import { createExtent, stringTemplate } from "../utils/shared.js";
 
 const EVENT_NAMES = [
     /**

package/src/og/terrain/MapboxTerrain.js

@@ -1,8 +1,8 @@
-import { getTileExtent } from "../mercator.js";
 import { Layer } from "../layer/Layer.js";
-import { GlobusTerrain } from "./GlobusTerrain.js";
 import { isPowerOfTwo } from "../math.js";
 import * as mercator from "../mercator.js";
+import { getTileExtent } from "../mercator.js";
+import { GlobusTerrain } from "./GlobusTerrain.js";
 
 const KEY =
     "pk.eyJ1IjoiZm94bXVsZGVyODMiLCJhIjoiY2pqYmR3dG5oM2Z1bzNrczJqYm5pODhuNSJ9.Y4DRmEPhb-XSlCR9CAXACQ";

package/src/og/terrain/index.js

@@ -1,6 +1,6 @@
+import { BilTerrain } from './BilTerrain';
 import { EmptyTerrain } from './EmptyTerrain';
 import { GlobusTerrain } from './GlobusTerrain';
 import { MapboxTerrain } from './MapboxTerrain';
-import { BilTerrain } from './BilTerrain';
 
-export { EmptyTerrain, GlobusTerrain, MapboxTerrain, BilTerrain };
+export { EmptyTerrain, GlobusTerrain, MapboxTerrain, BilTerrain };

package/src/og/ui/Button.js

@@ -1,10 +1,10 @@
 'use strict'
 
-import { View } from './View.js';
 import { stringTemplate } from '../utils/shared.js';
+import { View } from './View.js';
 
 const TEMPLATE =
-    `<div class="og-button">
+    `<div class="og-button" title="{title}">
        <div class="og-button-icon">{icon}</div>
        <div class="og-button-text">{text}</div>
     </div>`;
@@ -14,7 +14,8 @@ class Button extends View {
         super({
             template: stringTemplate(TEMPLATE, {
                 icon: options.icon || "",
-                text: options.text || ""
+                text: options.text || "",
+                title: options.title || ""
             }),
             ...options,
             eventList: ["click", "mousedown", "mouseup", "touchstart", "touchend", "touchcancel", ...(options.eventList || [])]
@@ -103,4 +104,4 @@ class Button extends View {
     }
 }
 
-export { Button }
+export { Button };

package/src/og/ui/Dialog.js

@@ -1,8 +1,9 @@
 'use strict'
 
-import { View } from './View.js';
 import { getDefault, stringTemplate } from '../utils/shared.js';
 import { Button } from './Button.js';
+import { CLOSE_ICON } from './icons.js';
+import { View } from './View.js';
 
 const TEMPLATE = `<div class="og-ddialog" 
         style="display:{display}; resize:{resize}; width: {width}px; {height}; top: {top}px; left: {left}px; min-height: {minHeight}; max-height: {maxHeight}; min-width: {minWidth}; max-width: {maxWidth};">
@@ -13,10 +14,6 @@ const TEMPLATE = `<div class="og-ddialog"
        <div class="og-ddialog-container"></div>
     </div>>`;
 
-const CLOSE_ICON = `<svg className="svg-icon" style="width: 1em; height: 1em;vertical-align: middle;fill: currentColor; overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg">
-    <path d="M777.856 280.192l-33.92-33.952-231.872 231.872-231.84-231.872-33.984 33.888 231.872 231.904-231.84 231.84 33.888 33.984 231.904-231.904 231.84 231.872 33.952-33.888-231.872-231.904z"/>
-</svg>`
-
 class Dialog extends View {
     constructor(options = {}) {
         super({
@@ -239,4 +236,4 @@ class Dialog extends View {
     }
 }
 
-export { Dialog }
+export { Dialog };