geolba/GeotiefExplore
2
1
Fork 0
Code Issues 7 Pull Requests Projects 1 Releases Wiki Activity

- egdi logo

Browse Source 
- npm updates
- full responsive design
- LayerControl wit the option for defining a parent div
This commit is contained in:
Arno Kaimbacher 2020-12-14 17:22:02 +01:00
parent 572e6f41b5
commit 5c40b845bb
12 changed files with 1424 additions and 244 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
GeotiefExplore.code-workspace
View File

@ -4,11 +4,12 @@
"path": "." "path": "."
} }
], ],
"settings": {}, "settings": {
"svg.preview.background": "custom"
},
"launch": { "launch": {
"version": "0.2.0", "version": "0.2.0",
"configurations": [ "configurations": [
{ {
"type": "chrome", "type": "chrome",
"request": "launch", "request": "launch",
@ -23,7 +24,6 @@
// "webpack:///*": "*", // "webpack:///*": "*",
// "webpack:///src/*": "${workspaceFolder}/*", // "webpack:///src/*": "${workspaceFolder}/*",
// }, // },
// "sourceMapPathOverrides": { // "sourceMapPathOverrides": {
// // "webpack:///src/*": "${workspaceFolder}/*", // // "webpack:///src/*": "${workspaceFolder}/*",
// "webpack:///./*": "${workspaceFolder}/*" // "webpack:///./*": "${workspaceFolder}/*"

1
images/egdi_logo.min.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" version="1" width="181" height="51" viewBox="0 0 908 338"><text font-size="176.732" font-weight="700" x="-88.94" y="204.393" fill="#1772b6" style="-inkscape-font-specification:'sans-serif, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal" font-family="sans-serif" fill-opacity=".682">EGDI</text><path d="M941.442 286.591l-150.386 54.377-150.7-54.594 149.885-54.072c44.412 15.116 111.758 38.073 151.2 54.29z" stroke-opacity="null" stroke-linecap="null" stroke-linejoin="null" stroke-width=".917" stroke="null" fill-opacity=".682" fill="#ffcf00"/><path d="M790.757 92.944l150.93 53.724-.245 139.923-151.2-54.289z" fill="#cf4922" fill-rule="evenodd" fill-opacity=".682"/><path d="M790.757 92.944l-149.822 53.144 149.222 54.968" fill="#900c07" fill-opacity=".682"/><path d="M617.46 161.775l-.695 107.832 150.952-53.617z" fill="#1772b6" fill-opacity=".682"/><path d="M466.614 75.855L617.32 130.75l-.555 138.856-151.194-54.27z" fill="#94bd22" fill-rule="evenodd" fill-opacity=".682"/><path d="M619.13 21.35L466.614 75.854l150.704 54.895 151.23-53.814C730.528 61.329 655.739 39.9 619.13 21.349z" fill="#dd0" fill-opacity=".682"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

101
images/egdi_logo.svg Normal file
View File

@ -0,0 +1,101 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
version="1"
width="181"
height="51"
viewBox="0 0 908 338"
id="svg53"
sodipodi:docname="egdi_logo.svg"
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="2560"
inkscape:window-height="1537"
id="namedview855"
showgrid="true"
inkscape:zoom="10.617915"
inkscape:cx="101.42827"
inkscape:cy="18.327117"
inkscape:window-x="2552"
inkscape:window-y="-8"
inkscape:window-maximized="1"
inkscape:current-layer="svg53"
inkscape:snap-grids="false"
inkscape:snap-to-guides="true">
<inkscape:grid
type="xygrid"
id="grid871" />
</sodipodi:namedview>
<metadata
id="metadata59">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs57" />
<text
font-size="200"
font-weight="bold"
x="-88.939621"
y="204.3934"
fill="#000000"
id="text44"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:176.732px;font-family:sans-serif;-inkscape-font-specification:'sans-serif, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;fill:#1772b6;stroke:none;stroke-opacity:1;fill-opacity:0.682353;">EGDI</text>
<path
id="svg_5"
d="m 941.44193,286.59145 -150.38624,54.3767 -150.69914,-54.59419 149.88456,-54.07154 c 44.41157,15.11532 111.75814,38.07261 151.20082,54.28903 z"
stroke-opacity="null"
stroke-linecap="null"
stroke-linejoin="null"
stroke-width="0.917161"
stroke="null"
fill-opacity="null"
fill="#b91e1e"
sodipodi:nodetypes="ccccc"
style="fill:#ffcf00;fill-opacity:0.68235296" />
<path
id="rect61"
style="fill:#cf4922;fill-rule:evenodd;stroke-width:5.98077;fill-opacity:0.68235296"
d="M 790.75737,92.943673 941.68682,146.66828 941.44193,286.59145 790.24111,232.30242 Z"
sodipodi:nodetypes="ccccc" />
<path
style="fill:#900c07;fill-opacity:0.68235296;stroke:none;stroke-width:6.00462px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="M 790.75737,92.943673 640.93489,146.08834 790.15658,201.0559"
id="path899"
sodipodi:nodetypes="ccc" />
<path
style="fill:#1772b6;fill-opacity:0.68235296;stroke:none;stroke-width:6.07844px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 617.45905,161.77508 -0.6944,107.83162 150.95277,-53.61708 z"
id="path901"
sodipodi:nodetypes="cccc" />
<path
id="rect61-1"
style="fill:#94bd22;fill-rule:evenodd;stroke-width:6.07844;fill-opacity:0.68235296"
d="M 466.61374,75.854645 617.32028,130.75134 616.76465,269.6067 465.57094,215.33794 Z"
sodipodi:nodetypes="ccccc" />
<path
id="svg_5-9"
style="display:inline;stroke-width:6.62745;fill:#dddd00;fill-opacity:0.68235296"
d="M 619.13024,21.349472 466.61374,75.854645 617.3175,130.74977 768.54857,76.935603 C 730.52682,61.328962 655.73869,39.89961 619.13024,21.349472 Z"
sodipodi:nodetypes="ccccc" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

81
index.html
View File

@ -26,7 +26,8 @@
<!-- CSS <!-- CSS
–––––––––––––––––––––––––––––––––––––––––––––––––– --> –––––––––––––––––––––––––––––––––––––––––––––––––– -->
<!-- <link rel="stylesheet" href="src/css/styles.css?v=1.0"> --> <!-- <link type="text/css" rel="stylesheet" href="normalize.css" /> -->
<!-- <link rel="stylesheet" href="src/css/page.css?v=1.0"> -->
<link rel="stylesheet" type="text/css" href="dist/main.css" /> <link rel="stylesheet" type="text/css" href="dist/main.css" />
<!-- Favicon <!-- Favicon
@ -41,11 +42,81 @@
<body> <body>
<div id="webgl" class="mapDesktop">
<!-- <div id="progressArea"> <header class="header">
<img id="loadingImg" alt="" src="images/map/loading.gif" style="display:none;" /> <nav class="navigation" role="navigation">
</div> --> <a href="#" id="menu-icon" class="menu-icon active">
<i class="fa fa-bars"></i>
</a>
<div class="row">
<div class="logo three columns">
<a class="navbar-brand" href="/">
<img src="images/egdi_logo.svg" height="51">
</a>
</div> </div>
<ul class="menu main-navigation nine columns">
<li><a href="#home">Home</a></li>
</ul>
</div>
</nav>
</header>
<section class='main u-full-width'>
<div class="canvas-area eight columns">
<div id="div-map">
<div id="webgl" class="mapDesktop">
<!-- <canvas id="imgCanvas" class="img-canvas">
Canvas Not supported in your browser... Sorry!
</canvas> -->
</div>
</div>
</div>
<div class="input-area four columns">
<div class="row">
<div class="twelve columns">
<ul class="tab-nav">
<li class="metadata-link">
<span class="remove-check button active" name="#one">GEOLOGY</span>
</li>
<li class="file-link">
<span class="remove-check button" name="#two">ANALYSIS</span>
</li>
</ul>
<!-- HTML markup for tab content: Tab panes -->
<div class="tab-content">
<div class="tab-pane content-metadata active" id="one">
<div id="layer-control-parent-id"></div>
</div>
<div class="tab-pane content-file" id="two">
<h5 class="section-heading">Download Map Image</h5>
<!-- <label for="topText">Top Text:</label>
<input type="text" id="topText" class="form-control">
<label for="bottomText">Bottom Text:</label>
<input type="text" id="bottomText" class="form-control"> -->
<a class="button button-primary" type="submit" id="btnDownloadCanvasImage"
download="file.png">Download</a>
</div>
</div>
</div>
<!-- End of HTML markup for tab content: Tab panes -->
</div>
</div>
</section>
<script src="dist/main.js"></script> <script src="dist/main.js"></script>
</body> </body>

450
package-lock.json generated
View File

@ -1,10 +1,15 @@
{ {
"name": "GeotiefExplore", "name": "geo-tief",
"version": "1.0.0",
"lockfileVersion": 2, "lockfileVersion": 2,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "geo-tief",
"version": "1.0.0",
"license": "MIT",
"dependencies": { "dependencies": {
"normalize.css": "^8.0.1",
"proj4": "^2.6.3", "proj4": "^2.6.3",
"three": "^0.123.0" "three": "^0.123.0"
}, },
@ -45,25 +50,24 @@
"dev": true "dev": true
}, },
"node_modules/@babel/core": { "node_modules/@babel/core": {
"version": "7.12.9", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/core/-/core-7.12.9.tgz", "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.12.10.tgz",
"integrity": "sha512-gTXYh3M5wb7FRXQy+FErKFAv90BnlOuNn1QkCK2lREoPAjrQCO49+HVSrFoe5uakFAF5eenS75KbO2vQiLrTMQ==", "integrity": "sha512-eTAlQKq65zHfkHZV0sIVODCPGVgoo1HdBlbSLi9CqOzuZanMv2ihzY+4paiKr1mH+XmYESMAmJ/dpZ68eN6d8w==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@babel/code-frame": "^7.10.4", "@babel/code-frame": "^7.10.4",
"@babel/generator": "^7.12.5", "@babel/generator": "^7.12.10",
"@babel/helper-module-transforms": "^7.12.1", "@babel/helper-module-transforms": "^7.12.1",
"@babel/helpers": "^7.12.5", "@babel/helpers": "^7.12.5",
"@babel/parser": "^7.12.7", "@babel/parser": "^7.12.10",
"@babel/template": "^7.12.7", "@babel/template": "^7.12.7",
"@babel/traverse": "^7.12.9", "@babel/traverse": "^7.12.10",
"@babel/types": "^7.12.7", "@babel/types": "^7.12.10",
"convert-source-map": "^1.7.0", "convert-source-map": "^1.7.0",
"debug": "^4.1.0", "debug": "^4.1.0",
"gensync": "^1.0.0-beta.1", "gensync": "^1.0.0-beta.1",
"json5": "^2.1.2", "json5": "^2.1.2",
"lodash": "^4.17.19", "lodash": "^4.17.19",
"resolve": "^1.3.2",
"semver": "^5.4.1", "semver": "^5.4.1",
"source-map": "^0.5.0" "source-map": "^0.5.0"
}, },
@ -76,23 +80,23 @@
} }
}, },
"node_modules/@babel/generator": { "node_modules/@babel/generator": {
"version": "7.12.5", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.12.5.tgz", "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.12.10.tgz",
"integrity": "sha512-m16TQQJ8hPt7E+OS/XVQg/7U184MLXtvuGbCdA7na61vha+ImkyyNM/9DDA0unYCVZn3ZOhng+qz48/KBOT96A==", "integrity": "sha512-6mCdfhWgmqLdtTkhXjnIz0LcdVCd26wS2JXRtj2XY0u5klDsXBREA/pG5NVOuVnF2LUrBGNFtQkIqqTbblg0ww==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@babel/types": "^7.12.5", "@babel/types": "^7.12.10",
"jsesc": "^2.5.1", "jsesc": "^2.5.1",
"source-map": "^0.5.0" "source-map": "^0.5.0"
} }
}, },
"node_modules/@babel/helper-annotate-as-pure": { "node_modules/@babel/helper-annotate-as-pure": {
"version": "7.10.4", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.10.4.tgz", "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.12.10.tgz",
"integrity": "sha512-XQlqKQP4vXFB7BN8fEEerrmYvHp3fK/rBkRFz9jaJbzK0B1DSfej9Kc7ZzE8Z/OnId1jpJdNAZ3BFQjWG68rcA==", "integrity": "sha512-XplmVbC1n+KY6jL8/fgLVXXUauDIB+lD5+GsQEh6F6GBF1dq1qy4DP4yXWzDKcoqXB3X58t61e85Fitoww4JVQ==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@babel/types": "^7.10.4" "@babel/types": "^7.12.10"
} }
}, },
"node_modules/@babel/helper-builder-binary-assignment-operator-visitor": { "node_modules/@babel/helper-builder-binary-assignment-operator-visitor": {
@ -181,12 +185,12 @@
} }
}, },
"node_modules/@babel/helper-get-function-arity": { "node_modules/@babel/helper-get-function-arity": {
"version": "7.10.4", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/helper-get-function-arity/-/helper-get-function-arity-7.10.4.tgz", "resolved": "https://registry.npmjs.org/@babel/helper-get-function-arity/-/helper-get-function-arity-7.12.10.tgz",
"integrity": "sha512-EkN3YDB+SRDgiIUnNgcmiD361ti+AVbL3f3Henf6dqqUyr5dMsorno0lJWJuLhDhkI5sYEpgj6y9kB8AOU1I2A==", "integrity": "sha512-mm0n5BPjR06wh9mPQaDdXWDoll/j5UpCAPl1x8fS71GHm7HA6Ua2V4ylG1Ju8lvcTOietbPNNPaSilKj+pj+Ag==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@babel/types": "^7.10.4" "@babel/types": "^7.12.10"
} }
}, },
"node_modules/@babel/helper-hoist-variables": { "node_modules/@babel/helper-hoist-variables": {
@ -234,12 +238,12 @@
} }
}, },
"node_modules/@babel/helper-optimise-call-expression": { "node_modules/@babel/helper-optimise-call-expression": {
"version": "7.12.7", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.12.7.tgz", "resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.12.10.tgz",
"integrity": "sha512-I5xc9oSJ2h59OwyUqjv95HRyzxj53DAubUERgQMrpcCEYQyToeHA+NEcUEsVWB4j53RDeskeBJ0SgRAYHDBckw==", "integrity": "sha512-4tpbU0SrSTjjt65UMWSrUOPZTsgvPgGG4S8QSTNHacKzpS51IVWGDj0yCwyeZND/i+LSN2g/O63jEXEWm49sYQ==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@babel/types": "^7.12.7" "@babel/types": "^7.12.10"
} }
}, },
"node_modules/@babel/helper-plugin-utils": { "node_modules/@babel/helper-plugin-utils": {
@ -345,9 +349,9 @@
} }
}, },
"node_modules/@babel/parser": { "node_modules/@babel/parser": {
"version": "7.12.7", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.12.7.tgz", "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.12.10.tgz",
"integrity": "sha512-oWR02Ubp4xTLCAqPRiNIuMVgNO5Aif/xpXtabhzW2HWUD47XJsAB4Zd/Rg30+XeQA3juXigV7hlquOTmwqLiwg==", "integrity": "sha512-PJdRPwyoOqFAWfLytxrWwGrAxghCgh/yTNCYciOz8QgjflA7aZhECPZAa2VUedKg2+QMWkI0L9lynh2SNmNEgA==",
"dev": true, "dev": true,
"bin": { "bin": {
"parser": "bin/babel-parser.js" "parser": "bin/babel-parser.js"
@ -999,14 +1003,13 @@
} }
}, },
"node_modules/@babel/plugin-transform-runtime": { "node_modules/@babel/plugin-transform-runtime": {
"version": "7.12.1", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.12.1.tgz", "resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.12.10.tgz",
"integrity": "sha512-Ac/H6G9FEIkS2tXsZjL4RAdS3L3WHxci0usAnz7laPWUmFiGtj7tIASChqKZMHTSQTQY6xDbOq+V1/vIq3QrWg==", "integrity": "sha512-xOrUfzPxw7+WDm9igMgQCbO3cJKymX7dFdsgRr1eu9n3KjjyU4pptIXbXPseQDquw+W+RuJEJMHKHNsPNNm3CA==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@babel/helper-module-imports": "^7.12.1", "@babel/helper-module-imports": "^7.12.5",
"@babel/helper-plugin-utils": "^7.10.4", "@babel/helper-plugin-utils": "^7.10.4",
"resolve": "^1.8.1",
"semver": "^5.5.1" "semver": "^5.5.1"
}, },
"peerDependencies": { "peerDependencies": {
@ -1063,9 +1066,9 @@
} }
}, },
"node_modules/@babel/plugin-transform-typeof-symbol": { "node_modules/@babel/plugin-transform-typeof-symbol": {
"version": "7.12.1", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.12.1.tgz", "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.12.10.tgz",
"integrity": "sha512-EPGgpGy+O5Kg5pJFNDKuxt9RdmTgj5sgrus2XVeMp/ZIbOESadgILUbm50SNpghOh3/6yrbsH+NB5+WJTmsA7Q==", "integrity": "sha512-JQ6H8Rnsogh//ijxspCjc21YPd3VLVoYtAwv3zQmqAt8YGYUtdo5usNhdl4b9/Vir2kPFZl6n1h0PfUz4hJhaA==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@babel/helper-plugin-utils": "^7.10.4" "@babel/helper-plugin-utils": "^7.10.4"
@ -1100,9 +1103,9 @@
} }
}, },
"node_modules/@babel/preset-env": { "node_modules/@babel/preset-env": {
"version": "7.12.7", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.12.7.tgz", "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.12.10.tgz",
"integrity": "sha512-OnNdfAr1FUQg7ksb7bmbKoby4qFOHw6DKWWUNB9KqnnCldxhxJlP+21dpyaWFmf2h0rTbOkXJtAGevY3XW1eew==", "integrity": "sha512-Gz9hnBT/tGeTE2DBNDkD7BiWRELZt+8lSysHuDwmYXUIvtwZl0zI+D6mZgXZX0u8YBlLS4tmai9ONNY9tjRgRA==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@babel/compat-data": "^7.12.7", "@babel/compat-data": "^7.12.7",
@ -1164,12 +1167,12 @@
"@babel/plugin-transform-spread": "^7.12.1", "@babel/plugin-transform-spread": "^7.12.1",
"@babel/plugin-transform-sticky-regex": "^7.12.7", "@babel/plugin-transform-sticky-regex": "^7.12.7",
"@babel/plugin-transform-template-literals": "^7.12.1", "@babel/plugin-transform-template-literals": "^7.12.1",
"@babel/plugin-transform-typeof-symbol": "^7.12.1", "@babel/plugin-transform-typeof-symbol": "^7.12.10",
"@babel/plugin-transform-unicode-escapes": "^7.12.1", "@babel/plugin-transform-unicode-escapes": "^7.12.1",
"@babel/plugin-transform-unicode-regex": "^7.12.1", "@babel/plugin-transform-unicode-regex": "^7.12.1",
"@babel/preset-modules": "^0.1.3", "@babel/preset-modules": "^0.1.3",
"@babel/types": "^7.12.7", "@babel/types": "^7.12.10",
"core-js-compat": "^3.7.0", "core-js-compat": "^3.8.0",
"semver": "^5.5.0" "semver": "^5.5.0"
}, },
"peerDependencies": { "peerDependencies": {
@ -1213,26 +1216,26 @@
} }
}, },
"node_modules/@babel/traverse": { "node_modules/@babel/traverse": {
"version": "7.12.9", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.12.9.tgz", "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.12.10.tgz",
"integrity": "sha512-iX9ajqnLdoU1s1nHt36JDI9KG4k+vmI8WgjK5d+aDTwQbL2fUnzedNedssA645Ede3PM2ma1n8Q4h2ohwXgMXw==", "integrity": "sha512-6aEtf0IeRgbYWzta29lePeYSk+YAFIC3kyqESeft8o5CkFlYIMX+EQDDWEiAQ9LHOA3d0oHdgrSsID/CKqXJlg==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@babel/code-frame": "^7.10.4", "@babel/code-frame": "^7.10.4",
"@babel/generator": "^7.12.5", "@babel/generator": "^7.12.10",
"@babel/helper-function-name": "^7.10.4", "@babel/helper-function-name": "^7.10.4",
"@babel/helper-split-export-declaration": "^7.11.0", "@babel/helper-split-export-declaration": "^7.11.0",
"@babel/parser": "^7.12.7", "@babel/parser": "^7.12.10",
"@babel/types": "^7.12.7", "@babel/types": "^7.12.10",
"debug": "^4.1.0", "debug": "^4.1.0",
"globals": "^11.1.0", "globals": "^11.1.0",
"lodash": "^4.17.19" "lodash": "^4.17.19"
} }
}, },
"node_modules/@babel/types": { "node_modules/@babel/types": {
"version": "7.12.7", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/types/-/types-7.12.7.tgz", "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.12.10.tgz",
"integrity": "sha512-MNyI92qZq6jrQkXvtIiykvl4WtoRrVV9MPn+ZfsoEENjiWcBQ3ZSHrkxnJWgWtLX3XXqX5hrSQ+X69wkmesXuQ==", "integrity": "sha512-sf6wboJV5mGyip2hIpDSKsr80RszPinEFjsHTalMxZAZkoQ2/2yQzxlcFN52SJqsyPfLtPmenL4g2KB3KJXPDw==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@babel/helper-validator-identifier": "^7.10.4", "@babel/helper-validator-identifier": "^7.10.4",
@ -1329,9 +1332,9 @@
"peer": true "peer": true
}, },
"node_modules/@types/node": { "node_modules/@types/node": {
"version": "14.14.10", "version": "14.14.11",
"resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.10.tgz", "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.11.tgz",
"integrity": "sha512-J32dgx2hw8vXrSbu4ZlVhn1Nm3GbeCFNw2FWL8S5QKucHGY0cyNwjdQdO+KMBZ4wpmC7KhLCiNsdk1RFRIYUQQ==", "integrity": "sha512-BJ97wAUuU3NUiUCp44xzUFquQEvnk1wu7q4CMEUYKJWjdkr0YWYDsm4RFtAvxYsNjLsKcrFt6RvK8r+mnzMbEQ==",
"dev": true "dev": true
}, },
"node_modules/@webassemblyjs/ast": { "node_modules/@webassemblyjs/ast": {
@ -1912,12 +1915,12 @@
} }
}, },
"node_modules/core-js-compat": { "node_modules/core-js-compat": {
"version": "3.8.0", "version": "3.8.1",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.8.0.tgz", "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.8.1.tgz",
"integrity": "sha512-o9QKelQSxQMYWHXc/Gc4L8bx/4F7TTraE5rhuN8I7mKBt5dBIUpXpIR3omv70ebr8ST5R3PqbDQr+ZI3+Tt1FQ==", "integrity": "sha512-a16TLmy9NVD1rkjUGbwuyWkiDoN0FDpAwrfLONvHFQx0D9k7J9y0srwMT8QP/Z6HE3MIFaVynEeYwZwPX1o5RQ==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"browserslist": "^4.14.7", "browserslist": "^4.15.0",
"semver": "7.0.0" "semver": "7.0.0"
}, },
"funding": { "funding": {
@ -2120,9 +2123,9 @@
} }
}, },
"node_modules/electron-to-chromium": { "node_modules/electron-to-chromium": {
"version": "1.3.615", "version": "1.3.621",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.615.tgz", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.621.tgz",
"integrity": "sha512-fNYTQXoUhNc6RmHDlGN4dgcLURSBIqQCN7ls6MuQ741+NJyLNRz8DxAC+pZpOKfRs6cfY0lv2kWdy8Oxf9j4+A==", "integrity": "sha512-FeIuBzArONbAmKmZIsZIFGu/Gc9AVGlVeVbhCq+G2YIl6QkT0TDn2HKN/FMf1btXEB9kEmIuQf3/lBTVAbmFOg==",
"dev": true "dev": true
}, },
"node_modules/emoji-regex": { "node_modules/emoji-regex": {
@ -3260,9 +3263,9 @@
} }
}, },
"node_modules/mini-css-extract-plugin": { "node_modules/mini-css-extract-plugin": {
"version": "1.3.1", "version": "1.3.2",
"resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-1.3.1.tgz", "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-1.3.2.tgz",
"integrity": "sha512-jIOheqh9EU98rqj6ZaFTYNNDSFqdakNqaUZfkYwaXPjI9batmXVXX+K71NrqRAgtoGefELBMld1EQ7dqSAD5SQ==", "integrity": "sha512-ofYJgCZNm1TToSv02pGANe1lfb31g7ULwNV5Nt31d2dAnVLxFHoguDUAj6U0BLEO7Nrztq4mdtL1yFDaeW7J+A==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"loader-utils": "^2.0.0", "loader-utils": "^2.0.0",
@ -3381,6 +3384,11 @@
"validate-npm-package-license": "^3.0.1" "validate-npm-package-license": "^3.0.1"
} }
}, },
"node_modules/normalize.css": {
"version": "8.0.1",
"resolved": "https://registry.npmjs.org/normalize.css/-/normalize.css-8.0.1.tgz",
"integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg=="
},
"node_modules/npm-run-path": { "node_modules/npm-run-path": {
"version": "4.0.1", "version": "4.0.1",
"resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-4.0.1.tgz", "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-4.0.1.tgz",
@ -3585,9 +3593,9 @@
} }
}, },
"node_modules/postcss": { "node_modules/postcss": {
"version": "8.1.14", "version": "8.2.1",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.1.14.tgz", "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.2.1.tgz",
"integrity": "sha512-KatkyVPBKfENS+c3dpXJoDXnDD5UZs5exAnDksLqaRJPKwYphEPZt4N0m0i049v2/BtWVQibAhxW4ilXXcolpA==", "integrity": "sha512-RhsqOOAQzTgh1UB/IZdca7F9WDb7SUCR2Vnv1x7DbvuuggQIpoDwjK+q0rzoPffhYvWNKX5JSwS4so4K3UC6vA==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"colorette": "^1.2.1", "colorette": "^1.2.1",
@ -4235,9 +4243,9 @@
} }
}, },
"node_modules/tapable": { "node_modules/tapable": {
"version": "2.1.1", "version": "2.2.0",
"resolved": "https://registry.npmjs.org/tapable/-/tapable-2.1.1.tgz", "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.2.0.tgz",
"integrity": "sha512-Wib1S8m2wdpLbmQz0RBEVosIyvb/ykfKXf3ZIDqvWoMg/zTNm6G/tDSuUM61J1kNCDXWJrLHGSFeMhAG+gAGpQ==", "integrity": "sha512-FBk4IesMV1rBxX2tfiK8RAmogtWn53puLOQlvO8XuwlgxcYbP4mVPS9Ph4aeamSyyVjOl24aYWAuc8U5kCVwMw==",
"dev": true, "dev": true,
"engines": { "engines": {
"node": ">=6" "node": ">=6"
@ -4523,9 +4531,9 @@
} }
}, },
"node_modules/watchpack": { "node_modules/watchpack": {
"version": "2.0.1", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.0.1.tgz", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.1.0.tgz",
"integrity": "sha512-vO8AKGX22ZRo6PiOFM9dC0re8IcKh8Kd/aH2zeqUc6w4/jBGlTy2P7fTC6ekT0NjVeGjgU2dGC5rNstKkeLEQg==", "integrity": "sha512-UjgD1mqjkG99+3lgG36at4wPnUXNvis2v1utwTgQ43C22c4LD71LsYMExdWXh4HZ+RmW+B0t1Vrg2GpXAkTOQw==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"glob-to-regexp": "^0.4.1", "glob-to-regexp": "^0.4.1",
@ -4536,9 +4544,9 @@
} }
}, },
"node_modules/webpack": { "node_modules/webpack": {
"version": "5.9.0", "version": "5.10.0",
"resolved": "https://registry.npmjs.org/webpack/-/webpack-5.9.0.tgz", "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.10.0.tgz",
"integrity": "sha512-YnnqIV/uAS5ZrNpctSv378qV7HmbJ74DL+XfvMxzbX1bV9e7eeT6eEWU4wuUw33CNr/HspBh7R/xQlVjTEyAeA==", "integrity": "sha512-P0bHAXmIz0zsNcHNLqFmLY1ZtrT+jtBr7FqpuDtA2o7GiHC+zBsfhgK7SmJ1HG7BAEb3G9JoMdSVi7mEDvG3Zg==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@types/eslint-scope": "^3.7.0", "@types/eslint-scope": "^3.7.0",
@ -4559,7 +4567,7 @@
"loader-runner": "^4.1.0", "loader-runner": "^4.1.0",
"mime-types": "^2.1.27", "mime-types": "^2.1.27",
"neo-async": "^2.6.2", "neo-async": "^2.6.2",
"pkg-dir": "^4.2.0", "pkg-dir": "^5.0.0",
"schema-utils": "^3.0.0", "schema-utils": "^3.0.0",
"tapable": "^2.1.1", "tapable": "^2.1.1",
"terser-webpack-plugin": "^5.0.3", "terser-webpack-plugin": "^5.0.3",
@ -4646,17 +4654,15 @@
"resolved": "https://registry.npmjs.org/webpack-merge/-/webpack-merge-4.2.2.tgz", "resolved": "https://registry.npmjs.org/webpack-merge/-/webpack-merge-4.2.2.tgz",
"integrity": "sha512-TUE1UGoTX2Cd42j3krGYqObZbOD+xF7u28WB7tfUordytSjbWTIjK/8V0amkBfTYN4/pB/GIDlJZZ657BGG19g==", "integrity": "sha512-TUE1UGoTX2Cd42j3krGYqObZbOD+xF7u28WB7tfUordytSjbWTIjK/8V0amkBfTYN4/pB/GIDlJZZ657BGG19g==",
"dev": true, "dev": true,
"license": "MIT",
"dependencies": { "dependencies": {
"lodash": "^4.17.15" "lodash": "^4.17.15"
} }
}, },
"node_modules/webpack-merge": { "node_modules/webpack-merge": {
"version": "5.4.0", "version": "5.4.1",
"resolved": "https://registry.npmjs.org/webpack-merge/-/webpack-merge-5.4.0.tgz", "resolved": "https://registry.npmjs.org/webpack-merge/-/webpack-merge-5.4.1.tgz",
"integrity": "sha512-/scBgu8LVPlHDgqH95Aw1xS+L+PHrpHKOwYVGFaNOQl4Q4wwwWDarwB1WdZAbLQ24SKhY3Awe7VZGYAdp+N+gQ==", "integrity": "sha512-ubwNFcKJjm5BwPH1U8ZHTMaq2+XJqyvcfWXXU6yv4IIWWPWAFvgicok8VK1OiA7iYhl33aJxL5hvwTuZuNBIHw==",
"dev": true, "dev": true,
"license": "MIT",
"dependencies": { "dependencies": {
"clone-deep": "^4.0.1", "clone-deep": "^4.0.1",
"wildcard": "^2.0.0" "wildcard": "^2.0.0"
@ -4684,6 +4690,79 @@
"node": ">=0.10.0" "node": ">=0.10.0"
} }
}, },
"node_modules/webpack/node_modules/find-up": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz",
"integrity": "sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==",
"dev": true,
"dependencies": {
"locate-path": "^6.0.0",
"path-exists": "^4.0.0"
},
"engines": {
"node": ">=10"
},
"funding": {
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/webpack/node_modules/locate-path": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
"integrity": "sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==",
"dev": true,
"dependencies": {
"p-locate": "^5.0.0"
},
"engines": {
"node": ">=10"
},
"funding": {
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/webpack/node_modules/p-limit": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz",
"integrity": "sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==",
"dev": true,
"dependencies": {
"yocto-queue": "^0.1.0"
},
"engines": {
"node": ">=10"
},
"funding": {
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/webpack/node_modules/p-locate": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/p-locate/-/p-locate-5.0.0.tgz",
"integrity": "sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==",
"dev": true,
"dependencies": {
"p-limit": "^3.0.2"
},
"engines": {
"node": ">=10"
},
"funding": {
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/webpack/node_modules/pkg-dir": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-5.0.0.tgz",
"integrity": "sha512-NPE8TDbzl/3YQYY7CSS228s3g2ollTFnc+Qi3tqmqJp9Vg2ovUpixcJEo2HJScN2Ez+kEaal6y70c0ehqJBJeA==",
"dev": true,
"dependencies": {
"find-up": "^5.0.0"
},
"engines": {
"node": ">=10"
}
},
"node_modules/webpack/node_modules/schema-utils": { "node_modules/webpack/node_modules/schema-utils": {
"version": "3.0.0", "version": "3.0.0",
"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.0.0.tgz", "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.0.0.tgz",
@ -4914,47 +4993,46 @@
"dev": true "dev": true
}, },
"@babel/core": { "@babel/core": {
"version": "7.12.9", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/core/-/core-7.12.9.tgz", "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.12.10.tgz",
"integrity": "sha512-gTXYh3M5wb7FRXQy+FErKFAv90BnlOuNn1QkCK2lREoPAjrQCO49+HVSrFoe5uakFAF5eenS75KbO2vQiLrTMQ==", "integrity": "sha512-eTAlQKq65zHfkHZV0sIVODCPGVgoo1HdBlbSLi9CqOzuZanMv2ihzY+4paiKr1mH+XmYESMAmJ/dpZ68eN6d8w==",
"dev": true, "dev": true,
"requires": { "requires": {
"@babel/code-frame": "^7.10.4", "@babel/code-frame": "^7.10.4",
"@babel/generator": "^7.12.5", "@babel/generator": "^7.12.10",
"@babel/helper-module-transforms": "^7.12.1", "@babel/helper-module-transforms": "^7.12.1",
"@babel/helpers": "^7.12.5", "@babel/helpers": "^7.12.5",
"@babel/parser": "^7.12.7", "@babel/parser": "^7.12.10",
"@babel/template": "^7.12.7", "@babel/template": "^7.12.7",
"@babel/traverse": "^7.12.9", "@babel/traverse": "^7.12.10",
"@babel/types": "^7.12.7", "@babel/types": "^7.12.10",
"convert-source-map": "^1.7.0", "convert-source-map": "^1.7.0",
"debug": "^4.1.0", "debug": "^4.1.0",
"gensync": "^1.0.0-beta.1", "gensync": "^1.0.0-beta.1",
"json5": "^2.1.2", "json5": "^2.1.2",
"lodash": "^4.17.19", "lodash": "^4.17.19",
"resolve": "^1.3.2",
"semver": "^5.4.1", "semver": "^5.4.1",
"source-map": "^0.5.0" "source-map": "^0.5.0"
} }
}, },
"@babel/generator": { "@babel/generator": {
"version": "7.12.5", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.12.5.tgz", "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.12.10.tgz",
"integrity": "sha512-m16TQQJ8hPt7E+OS/XVQg/7U184MLXtvuGbCdA7na61vha+ImkyyNM/9DDA0unYCVZn3ZOhng+qz48/KBOT96A==", "integrity": "sha512-6mCdfhWgmqLdtTkhXjnIz0LcdVCd26wS2JXRtj2XY0u5klDsXBREA/pG5NVOuVnF2LUrBGNFtQkIqqTbblg0ww==",
"dev": true, "dev": true,
"requires": { "requires": {
"@babel/types": "^7.12.5", "@babel/types": "^7.12.10",
"jsesc": "^2.5.1", "jsesc": "^2.5.1",
"source-map": "^0.5.0" "source-map": "^0.5.0"
} }
}, },
"@babel/helper-annotate-as-pure": { "@babel/helper-annotate-as-pure": {
"version": "7.10.4", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.10.4.tgz", "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.12.10.tgz",
"integrity": "sha512-XQlqKQP4vXFB7BN8fEEerrmYvHp3fK/rBkRFz9jaJbzK0B1DSfej9Kc7ZzE8Z/OnId1jpJdNAZ3BFQjWG68rcA==", "integrity": "sha512-XplmVbC1n+KY6jL8/fgLVXXUauDIB+lD5+GsQEh6F6GBF1dq1qy4DP4yXWzDKcoqXB3X58t61e85Fitoww4JVQ==",
"dev": true, "dev": true,
"requires": { "requires": {
"@babel/types": "^7.10.4" "@babel/types": "^7.12.10"
} }
}, },
"@babel/helper-builder-binary-assignment-operator-visitor": { "@babel/helper-builder-binary-assignment-operator-visitor": {
@ -5034,12 +5112,12 @@
} }
}, },
"@babel/helper-get-function-arity": { "@babel/helper-get-function-arity": {
"version": "7.10.4", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/helper-get-function-arity/-/helper-get-function-arity-7.10.4.tgz", "resolved": "https://registry.npmjs.org/@babel/helper-get-function-arity/-/helper-get-function-arity-7.12.10.tgz",
"integrity": "sha512-EkN3YDB+SRDgiIUnNgcmiD361ti+AVbL3f3Henf6dqqUyr5dMsorno0lJWJuLhDhkI5sYEpgj6y9kB8AOU1I2A==", "integrity": "sha512-mm0n5BPjR06wh9mPQaDdXWDoll/j5UpCAPl1x8fS71GHm7HA6Ua2V4ylG1Ju8lvcTOietbPNNPaSilKj+pj+Ag==",
"dev": true, "dev": true,
"requires": { "requires": {
"@babel/types": "^7.10.4" "@babel/types": "^7.12.10"
} }
}, },
"@babel/helper-hoist-variables": { "@babel/helper-hoist-variables": {
@ -5087,12 +5165,12 @@
} }
}, },
"@babel/helper-optimise-call-expression": { "@babel/helper-optimise-call-expression": {
"version": "7.12.7", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.12.7.tgz", "resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.12.10.tgz",
"integrity": "sha512-I5xc9oSJ2h59OwyUqjv95HRyzxj53DAubUERgQMrpcCEYQyToeHA+NEcUEsVWB4j53RDeskeBJ0SgRAYHDBckw==", "integrity": "sha512-4tpbU0SrSTjjt65UMWSrUOPZTsgvPgGG4S8QSTNHacKzpS51IVWGDj0yCwyeZND/i+LSN2g/O63jEXEWm49sYQ==",
"dev": true, "dev": true,
"requires": { "requires": {
"@babel/types": "^7.12.7" "@babel/types": "^7.12.10"
} }
}, },
"@babel/helper-plugin-utils": { "@babel/helper-plugin-utils": {
@ -5198,9 +5276,9 @@
} }
}, },
"@babel/parser": { "@babel/parser": {
"version": "7.12.7", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.12.7.tgz", "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.12.10.tgz",
"integrity": "sha512-oWR02Ubp4xTLCAqPRiNIuMVgNO5Aif/xpXtabhzW2HWUD47XJsAB4Zd/Rg30+XeQA3juXigV7hlquOTmwqLiwg==", "integrity": "sha512-PJdRPwyoOqFAWfLytxrWwGrAxghCgh/yTNCYciOz8QgjflA7aZhECPZAa2VUedKg2+QMWkI0L9lynh2SNmNEgA==",
"dev": true "dev": true
}, },
"@babel/plugin-proposal-async-generator-functions": { "@babel/plugin-proposal-async-generator-functions": {
@ -5693,14 +5771,13 @@
} }
}, },
"@babel/plugin-transform-runtime": { "@babel/plugin-transform-runtime": {
"version": "7.12.1", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.12.1.tgz", "resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.12.10.tgz",
"integrity": "sha512-Ac/H6G9FEIkS2tXsZjL4RAdS3L3WHxci0usAnz7laPWUmFiGtj7tIASChqKZMHTSQTQY6xDbOq+V1/vIq3QrWg==", "integrity": "sha512-xOrUfzPxw7+WDm9igMgQCbO3cJKymX7dFdsgRr1eu9n3KjjyU4pptIXbXPseQDquw+W+RuJEJMHKHNsPNNm3CA==",
"dev": true, "dev": true,
"requires": { "requires": {
"@babel/helper-module-imports": "^7.12.1", "@babel/helper-module-imports": "^7.12.5",
"@babel/helper-plugin-utils": "^7.10.4", "@babel/helper-plugin-utils": "^7.10.4",
"resolve": "^1.8.1",
"semver": "^5.5.1" "semver": "^5.5.1"
} }
}, },
@ -5742,9 +5819,9 @@
} }
}, },
"@babel/plugin-transform-typeof-symbol": { "@babel/plugin-transform-typeof-symbol": {
"version": "7.12.1", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.12.1.tgz", "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.12.10.tgz",
"integrity": "sha512-EPGgpGy+O5Kg5pJFNDKuxt9RdmTgj5sgrus2XVeMp/ZIbOESadgILUbm50SNpghOh3/6yrbsH+NB5+WJTmsA7Q==", "integrity": "sha512-JQ6H8Rnsogh//ijxspCjc21YPd3VLVoYtAwv3zQmqAt8YGYUtdo5usNhdl4b9/Vir2kPFZl6n1h0PfUz4hJhaA==",
"dev": true, "dev": true,
"requires": { "requires": {
"@babel/helper-plugin-utils": "^7.10.4" "@babel/helper-plugin-utils": "^7.10.4"
@ -5770,9 +5847,9 @@
} }
}, },
"@babel/preset-env": { "@babel/preset-env": {
"version": "7.12.7", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.12.7.tgz", "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.12.10.tgz",
"integrity": "sha512-OnNdfAr1FUQg7ksb7bmbKoby4qFOHw6DKWWUNB9KqnnCldxhxJlP+21dpyaWFmf2h0rTbOkXJtAGevY3XW1eew==", "integrity": "sha512-Gz9hnBT/tGeTE2DBNDkD7BiWRELZt+8lSysHuDwmYXUIvtwZl0zI+D6mZgXZX0u8YBlLS4tmai9ONNY9tjRgRA==",
"dev": true, "dev": true,
"requires": { "requires": {
"@babel/compat-data": "^7.12.7", "@babel/compat-data": "^7.12.7",
@ -5834,12 +5911,12 @@
"@babel/plugin-transform-spread": "^7.12.1", "@babel/plugin-transform-spread": "^7.12.1",
"@babel/plugin-transform-sticky-regex": "^7.12.7", "@babel/plugin-transform-sticky-regex": "^7.12.7",
"@babel/plugin-transform-template-literals": "^7.12.1", "@babel/plugin-transform-template-literals": "^7.12.1",
"@babel/plugin-transform-typeof-symbol": "^7.12.1", "@babel/plugin-transform-typeof-symbol": "^7.12.10",
"@babel/plugin-transform-unicode-escapes": "^7.12.1", "@babel/plugin-transform-unicode-escapes": "^7.12.1",
"@babel/plugin-transform-unicode-regex": "^7.12.1", "@babel/plugin-transform-unicode-regex": "^7.12.1",
"@babel/preset-modules": "^0.1.3", "@babel/preset-modules": "^0.1.3",
"@babel/types": "^7.12.7", "@babel/types": "^7.12.10",
"core-js-compat": "^3.7.0", "core-js-compat": "^3.8.0",
"semver": "^5.5.0" "semver": "^5.5.0"
} }
}, },
@ -5877,26 +5954,26 @@
} }
}, },
"@babel/traverse": { "@babel/traverse": {
"version": "7.12.9", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.12.9.tgz", "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.12.10.tgz",
"integrity": "sha512-iX9ajqnLdoU1s1nHt36JDI9KG4k+vmI8WgjK5d+aDTwQbL2fUnzedNedssA645Ede3PM2ma1n8Q4h2ohwXgMXw==", "integrity": "sha512-6aEtf0IeRgbYWzta29lePeYSk+YAFIC3kyqESeft8o5CkFlYIMX+EQDDWEiAQ9LHOA3d0oHdgrSsID/CKqXJlg==",
"dev": true, "dev": true,
"requires": { "requires": {
"@babel/code-frame": "^7.10.4", "@babel/code-frame": "^7.10.4",
"@babel/generator": "^7.12.5", "@babel/generator": "^7.12.10",
"@babel/helper-function-name": "^7.10.4", "@babel/helper-function-name": "^7.10.4",
"@babel/helper-split-export-declaration": "^7.11.0", "@babel/helper-split-export-declaration": "^7.11.0",
"@babel/parser": "^7.12.7", "@babel/parser": "^7.12.10",
"@babel/types": "^7.12.7", "@babel/types": "^7.12.10",
"debug": "^4.1.0", "debug": "^4.1.0",
"globals": "^11.1.0", "globals": "^11.1.0",
"lodash": "^4.17.19" "lodash": "^4.17.19"
} }
}, },
"@babel/types": { "@babel/types": {
"version": "7.12.7", "version": "7.12.10",
"resolved": "https://registry.npmjs.org/@babel/types/-/types-7.12.7.tgz", "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.12.10.tgz",
"integrity": "sha512-MNyI92qZq6jrQkXvtIiykvl4WtoRrVV9MPn+ZfsoEENjiWcBQ3ZSHrkxnJWgWtLX3XXqX5hrSQ+X69wkmesXuQ==", "integrity": "sha512-sf6wboJV5mGyip2hIpDSKsr80RszPinEFjsHTalMxZAZkoQ2/2yQzxlcFN52SJqsyPfLtPmenL4g2KB3KJXPDw==",
"dev": true, "dev": true,
"requires": { "requires": {
"@babel/helper-validator-identifier": "^7.10.4", "@babel/helper-validator-identifier": "^7.10.4",
@ -5984,9 +6061,9 @@
"peer": true "peer": true
}, },
"@types/node": { "@types/node": {
"version": "14.14.10", "version": "14.14.11",
"resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.10.tgz", "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.11.tgz",
"integrity": "sha512-J32dgx2hw8vXrSbu4ZlVhn1Nm3GbeCFNw2FWL8S5QKucHGY0cyNwjdQdO+KMBZ4wpmC7KhLCiNsdk1RFRIYUQQ==", "integrity": "sha512-BJ97wAUuU3NUiUCp44xzUFquQEvnk1wu7q4CMEUYKJWjdkr0YWYDsm4RFtAvxYsNjLsKcrFt6RvK8r+mnzMbEQ==",
"dev": true "dev": true
}, },
"@webassemblyjs/ast": { "@webassemblyjs/ast": {
@ -6479,12 +6556,12 @@
} }
}, },
"core-js-compat": { "core-js-compat": {
"version": "3.8.0", "version": "3.8.1",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.8.0.tgz", "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.8.1.tgz",
"integrity": "sha512-o9QKelQSxQMYWHXc/Gc4L8bx/4F7TTraE5rhuN8I7mKBt5dBIUpXpIR3omv70ebr8ST5R3PqbDQr+ZI3+Tt1FQ==", "integrity": "sha512-a16TLmy9NVD1rkjUGbwuyWkiDoN0FDpAwrfLONvHFQx0D9k7J9y0srwMT8QP/Z6HE3MIFaVynEeYwZwPX1o5RQ==",
"dev": true, "dev": true,
"requires": { "requires": {
"browserslist": "^4.14.7", "browserslist": "^4.15.0",
"semver": "7.0.0" "semver": "7.0.0"
}, },
"dependencies": { "dependencies": {
@ -6619,9 +6696,9 @@
"dev": true "dev": true
}, },
"electron-to-chromium": { "electron-to-chromium": {
"version": "1.3.615", "version": "1.3.621",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.615.tgz", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.621.tgz",
"integrity": "sha512-fNYTQXoUhNc6RmHDlGN4dgcLURSBIqQCN7ls6MuQ741+NJyLNRz8DxAC+pZpOKfRs6cfY0lv2kWdy8Oxf9j4+A==", "integrity": "sha512-FeIuBzArONbAmKmZIsZIFGu/Gc9AVGlVeVbhCq+G2YIl6QkT0TDn2HKN/FMf1btXEB9kEmIuQf3/lBTVAbmFOg==",
"dev": true "dev": true
}, },
"emoji-regex": { "emoji-regex": {
@ -7466,9 +7543,9 @@
"dev": true "dev": true
}, },
"mini-css-extract-plugin": { "mini-css-extract-plugin": {
"version": "1.3.1", "version": "1.3.2",
"resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-1.3.1.tgz", "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-1.3.2.tgz",
"integrity": "sha512-jIOheqh9EU98rqj6ZaFTYNNDSFqdakNqaUZfkYwaXPjI9batmXVXX+K71NrqRAgtoGefELBMld1EQ7dqSAD5SQ==", "integrity": "sha512-ofYJgCZNm1TToSv02pGANe1lfb31g7ULwNV5Nt31d2dAnVLxFHoguDUAj6U0BLEO7Nrztq4mdtL1yFDaeW7J+A==",
"dev": true, "dev": true,
"requires": { "requires": {
"loader-utils": "^2.0.0", "loader-utils": "^2.0.0",
@ -7560,6 +7637,11 @@
"validate-npm-package-license": "^3.0.1" "validate-npm-package-license": "^3.0.1"
} }
}, },
"normalize.css": {
"version": "8.0.1",
"resolved": "https://registry.npmjs.org/normalize.css/-/normalize.css-8.0.1.tgz",
"integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg=="
},
"npm-run-path": { "npm-run-path": {
"version": "4.0.1", "version": "4.0.1",
"resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-4.0.1.tgz", "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-4.0.1.tgz",
@ -7701,9 +7783,9 @@
} }
}, },
"postcss": { "postcss": {
"version": "8.1.14", "version": "8.2.1",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.1.14.tgz", "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.2.1.tgz",
"integrity": "sha512-KatkyVPBKfENS+c3dpXJoDXnDD5UZs5exAnDksLqaRJPKwYphEPZt4N0m0i049v2/BtWVQibAhxW4ilXXcolpA==", "integrity": "sha512-RhsqOOAQzTgh1UB/IZdca7F9WDb7SUCR2Vnv1x7DbvuuggQIpoDwjK+q0rzoPffhYvWNKX5JSwS4so4K3UC6vA==",
"dev": true, "dev": true,
"requires": { "requires": {
"colorette": "^1.2.1", "colorette": "^1.2.1",
@ -8200,9 +8282,9 @@
} }
}, },
"tapable": { "tapable": {
"version": "2.1.1", "version": "2.2.0",
"resolved": "https://registry.npmjs.org/tapable/-/tapable-2.1.1.tgz", "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.2.0.tgz",
"integrity": "sha512-Wib1S8m2wdpLbmQz0RBEVosIyvb/ykfKXf3ZIDqvWoMg/zTNm6G/tDSuUM61J1kNCDXWJrLHGSFeMhAG+gAGpQ==", "integrity": "sha512-FBk4IesMV1rBxX2tfiK8RAmogtWn53puLOQlvO8XuwlgxcYbP4mVPS9Ph4aeamSyyVjOl24aYWAuc8U5kCVwMw==",
"dev": true "dev": true
}, },
"terser": { "terser": {
@ -8406,9 +8488,9 @@
} }
}, },
"watchpack": { "watchpack": {
"version": "2.0.1", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.0.1.tgz", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.1.0.tgz",
"integrity": "sha512-vO8AKGX22ZRo6PiOFM9dC0re8IcKh8Kd/aH2zeqUc6w4/jBGlTy2P7fTC6ekT0NjVeGjgU2dGC5rNstKkeLEQg==", "integrity": "sha512-UjgD1mqjkG99+3lgG36at4wPnUXNvis2v1utwTgQ43C22c4LD71LsYMExdWXh4HZ+RmW+B0t1Vrg2GpXAkTOQw==",
"dev": true, "dev": true,
"requires": { "requires": {
"glob-to-regexp": "^0.4.1", "glob-to-regexp": "^0.4.1",
@ -8416,9 +8498,9 @@
} }
}, },
"webpack": { "webpack": {
"version": "5.9.0", "version": "5.10.0",
"resolved": "https://registry.npmjs.org/webpack/-/webpack-5.9.0.tgz", "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.10.0.tgz",
"integrity": "sha512-YnnqIV/uAS5ZrNpctSv378qV7HmbJ74DL+XfvMxzbX1bV9e7eeT6eEWU4wuUw33CNr/HspBh7R/xQlVjTEyAeA==", "integrity": "sha512-P0bHAXmIz0zsNcHNLqFmLY1ZtrT+jtBr7FqpuDtA2o7GiHC+zBsfhgK7SmJ1HG7BAEb3G9JoMdSVi7mEDvG3Zg==",
"dev": true, "dev": true,
"requires": { "requires": {
"@types/eslint-scope": "^3.7.0", "@types/eslint-scope": "^3.7.0",
@ -8439,7 +8521,7 @@
"loader-runner": "^4.1.0", "loader-runner": "^4.1.0",
"mime-types": "^2.1.27", "mime-types": "^2.1.27",
"neo-async": "^2.6.2", "neo-async": "^2.6.2",
"pkg-dir": "^4.2.0", "pkg-dir": "^5.0.0",
"schema-utils": "^3.0.0", "schema-utils": "^3.0.0",
"tapable": "^2.1.1", "tapable": "^2.1.1",
"terser-webpack-plugin": "^5.0.3", "terser-webpack-plugin": "^5.0.3",
@ -8447,6 +8529,52 @@
"webpack-sources": "^2.1.1" "webpack-sources": "^2.1.1"
}, },
"dependencies": { "dependencies": {
"find-up": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz",
"integrity": "sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==",
"dev": true,
"requires": {
"locate-path": "^6.0.0",
"path-exists": "^4.0.0"
}
},
"locate-path": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
"integrity": "sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==",
"dev": true,
"requires": {
"p-locate": "^5.0.0"
}
},
"p-limit": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz",
"integrity": "sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==",
"dev": true,
"requires": {
"yocto-queue": "^0.1.0"
}
},
"p-locate": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/p-locate/-/p-locate-5.0.0.tgz",
"integrity": "sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==",
"dev": true,
"requires": {
"p-limit": "^3.0.2"
}
},
"pkg-dir": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-5.0.0.tgz",
"integrity": "sha512-NPE8TDbzl/3YQYY7CSS228s3g2ollTFnc+Qi3tqmqJp9Vg2ovUpixcJEo2HJScN2Ez+kEaal6y70c0ehqJBJeA==",
"dev": true,
"requires": {
"find-up": "^5.0.0"
}
},
"schema-utils": { "schema-utils": {
"version": "3.0.0", "version": "3.0.0",
"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.0.0.tgz", "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.0.0.tgz",
@ -8515,9 +8643,9 @@
} }
}, },
"webpack-merge": { "webpack-merge": {
"version": "5.4.0", "version": "5.4.1",
"resolved": "https://registry.npmjs.org/webpack-merge/-/webpack-merge-5.4.0.tgz", "resolved": "https://registry.npmjs.org/webpack-merge/-/webpack-merge-5.4.1.tgz",
"integrity": "sha512-/scBgu8LVPlHDgqH95Aw1xS+L+PHrpHKOwYVGFaNOQl4Q4wwwWDarwB1WdZAbLQ24SKhY3Awe7VZGYAdp+N+gQ==", "integrity": "sha512-ubwNFcKJjm5BwPH1U8ZHTMaq2+XJqyvcfWXXU6yv4IIWWPWAFvgicok8VK1OiA7iYhl33aJxL5hvwTuZuNBIHw==",
"dev": true, "dev": true,
"requires": { "requires": {
"clone-deep": "^4.0.1", "clone-deep": "^4.0.1",

14
package.json
View File

@ -1,8 +1,15 @@
{ {
"name": "geo-tief",
"version": "1.0.0",
"description": "3D geology viewer",
"main": "dist/main.js",
"dependencies": { "dependencies": {
"normalize.css": "^8.0.1",
"proj4": "^2.6.3", "proj4": "^2.6.3",
"three": "^0.123.0" "three": "^0.123.0"
}, },
"author": "Arno Kaimbacher",
"license": "MIT",
"devDependencies": { "devDependencies": {
"@babel/core": "^7.12.9", "@babel/core": "^7.12.9",
"@babel/plugin-proposal-class-properties": "^7.12.1", "@babel/plugin-proposal-class-properties": "^7.12.1",
@ -28,5 +35,10 @@
"serve": "http-server", "serve": "http-server",
"prod": "rm -rf dist && webpack --progress --mode=production", "prod": "rm -rf dist && webpack --progress --mode=production",
"watch": "concurrently \"npm run serve\" \"npx webpack --progress --mode=development --watch\" " "watch": "concurrently \"npm run serve\" \"npx webpack --progress --mode=development --watch\" "
} },
"keywords": [
"3D",
"geology",
"GeoTief"
]
} }

661
src/css/page.css
View File

@ -1,4 +1,86 @@
/*@charset "UTF-8";*/ @import "../../node_modules/normalize.css/normalize.css";
/* html, body
{
height: 100%;
width: 100%;
overflow: hidden;
text-size-adjust: 100%;
font-family: 'Open Sans', sans-serif;
} */
html, body {
height: 100%;
width: 100%;
line-height: 1.6;
font-weight: 400;
font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #222; }
/* body {
padding-top: 65px;
} */
section {
text-align: left;
padding: 60px 0 0 0;
}
.main {
padding-top: 51px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-around;
/* height: 100%; */
position: absolute;
overflow: hidden;
left: 0;
right: 0;
top: 0;
bottom: 0;
overflow-y: scroll
}
.canvas-area {
/* flex: 2;
display: flex;
align-items: center;
justify-content: center; */
height: 100%;
/* margin: 10px; */
}
.input-area {
/* flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center; */
/* margin: 10px; */
}
.btnDownloadMeme {
margin-top: 10px;
}
#div-map {
position: relative;
height: 100%;
width: 100%;
}
#webgl {
height: auto;
width: auto;
}
.mapDesktop { .mapDesktop {
overflow: hidden; overflow: hidden;
@ -75,10 +157,8 @@
.gba-control-home span { .gba-control-home span {
/*padding: 2px;*/
width: 30px; width: 30px;
height: 30px; height: 30px;
/*background-color: rgba(102,102,102,0.80);*/
-webkit-user-select: none; -webkit-user-select: none;
-moz-user-select: none; -moz-user-select: none;
-ms-user-select: none; -ms-user-select: none;
@ -86,11 +166,584 @@
cursor: pointer; cursor: pointer;
border-radius: 5px; border-radius: 5px;
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAMAAAAM7l6QAAABDlBMVEWZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmXl5f///+VlZWZmZmWlpaUlJSYmJiSkpKampqzs7O3t7fMzMyTk5O2trarq6uysrLR0dHY2Njb29v8/PyMjIy4uLi5ubm6urq1tbSbm5uhoaGmpqanp6eoqKi7u7u+vr7BwcHFxcXGxsbHx8fIyMjJycmpqanNzc3Ozs7Pz8/Q0NCNjY3S0tLT09PV1dXW1tavr6/Z2dmxsbHc3Nzd3d3i4uLn5+fv7+/w8PD39/f5+fn7+/uPj4/9/f3+/v6QkJA5Pja9AAAAGnRSTlMABUdVVmxucX6MtLvHycrN2Nzi4+vs7e/3+OshyJcAAAECSURBVHherdLFcsQwEEXRDjLDJOkWGYcnzMzM/P8/Eo8V18i4yl091alSaSGAgclSdnMTPQB9vKBumCriYZg3j0qKGI9DyVRxVPVNHjVZyTN6u/VzGFmNiN4di3NmWWiw1itq9+Faoux5WxhjFNeka660grkkTUZxQ1Ff7glR2WTEO+rUfI0zqgbFM1moB0rm+BEL+5FS1XzUjOvPlFHdViELx3tKa8M7xr/LW7tpvr/A6Gn+HlHGy/+Xv8Ny+XCzUtmo5/LyD2Ofp7m8LYN9nuZ9gy/1djssd17CVlmwD/Susjbrj2yvhdnJPQbTPEjpeHKPwCAvqBe6hmYXs1uY6YdfRkdtRcSvwdgAAAAASUVORK5CYII=') /*img/home.png*/; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAMAAAAM7l6QAAABDlBMVEWZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmXl5f///+VlZWZmZmWlpaUlJSYmJiSkpKampqzs7O3t7fMzMyTk5O2trarq6uysrLR0dHY2Njb29v8/PyMjIy4uLi5ubm6urq1tbSbm5uhoaGmpqanp6eoqKi7u7u+vr7BwcHFxcXGxsbHx8fIyMjJycmpqanNzc3Ozs7Pz8/Q0NCNjY3S0tLT09PV1dXW1tavr6/Z2dmxsbHc3Nzd3d3i4uLn5+fv7+/w8PD39/f5+fn7+/uPj4/9/f3+/v6QkJA5Pja9AAAAGnRSTlMABUdVVmxucX6MtLvHycrN2Nzi4+vs7e/3+OshyJcAAAECSURBVHherdLFcsQwEEXRDjLDJOkWGYcnzMzM/P8/Eo8V18i4yl091alSaSGAgclSdnMTPQB9vKBumCriYZg3j0qKGI9DyVRxVPVNHjVZyTN6u/VzGFmNiN4di3NmWWiw1itq9+Faoux5WxhjFNeka660grkkTUZxQ1Ff7glR2WTEO+rUfI0zqgbFM1moB0rm+BEL+5FS1XzUjOvPlFHdViELx3tKa8M7xr/LW7tpvr/A6Gn+HlHGy/+Xv8Ny+XCzUtmo5/LyD2Ofp7m8LYN9nuZ9gy/1djssd17CVlmwD/Susjbrj2yvhdnJPQbTPEjpeHKPwCAvqBe6hmYXs1uY6YdfRkdtRcSvwdgAAAAASUVORK5CYII=') /*img/home.png*/;
/*opacity : 0.8;*/
background-position: 50% 50%; background-position: 50% 50%;
background-repeat: no-repeat; background-repeat: no-repeat;
display: block; display: block;
} }
/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1, h2, h3, h4, h5, h6 {
margin-top: 0;
margin-bottom: 2rem;
font-weight: 300; }
h1 { font-size: 4.0rem; line-height: 1.2; letter-spacing: -.1rem;}
h2 { font-size: 3.6rem; line-height: 1.25; letter-spacing: -.1rem; }
h3 { font-size: 3.0rem; line-height: 1.3; letter-spacing: -.1rem; }
h4 { font-size: 2.4rem; line-height: 1.35; letter-spacing: -.08rem; }
h5 { font-size: 1.8rem; line-height: 1.5; letter-spacing: -.05rem; }
h6 { font-size: 1.5rem; line-height: 1.6; letter-spacing: 0; }
/* Larger than phablet */
@media (min-width: 550px) {
h1 { font-size: 5.0rem; }
h2 { font-size: 4.2rem; }
h3 { font-size: 3.6rem; }
h4 { font-size: 3.0rem; }
h5 { font-size: 2.4rem; }
h6 { font-size: 1.5rem; }
}
p {
margin-top: 0; }
/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
color: #1EAEDB; }
a:hover {
color: #0FA0CE; }
/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.container {
position: relative;
width: 100%;
max-width: 960px;
margin: 0 auto;
padding: 0 20px;
box-sizing: border-box; }
.column,
.columns {
width: 100%;
float: left;
box-sizing: border-box; }
/* For devices larger than 400px */
@media (min-width: 400px) {
.container {
width: 85%;
padding: 0; }
}
/* For devices larger than 550px */
@media (min-width: 550px) {
.container {
width: 80%; }
.column,
.columns {
margin-left: 4%; }
.column:first-child,
.columns:first-child {
margin-left: 0; }
.one.column,
.one.columns { width: 4.66666666667%; }
.two.columns { width: 13.3333333333%; }
.three.columns { width: 22%; }
.four.columns { width: 30.6666666667%; }
.five.columns { width: 39.3333333333%; }
.six.columns { width: 48%; }
.seven.columns { width: 56.6666666667%; }
.eight.columns { width: 65.3333333333%; }
.nine.columns { width: 74.0%; }
.ten.columns { width: 82.6666666667%; }
.eleven.columns { width: 91.3333333333%; }
.twelve.columns { width: 100%; margin-left: 0; }
.one-third.column { width: 30.6666666667%; }
.two-thirds.column { width: 65.3333333333%; }
.one-half.column { width: 48%; }
/* Offsets */
.offset-by-one.column,
.offset-by-one.columns { margin-left: 8.66666666667%; }
.offset-by-two.column,
.offset-by-two.columns { margin-left: 17.3333333333%; }
.offset-by-three.column,
.offset-by-three.columns { margin-left: 26%; }
.offset-by-four.column,
.offset-by-four.columns { margin-left: 34.6666666667%; }
.offset-by-five.column,
.offset-by-five.columns { margin-left: 43.3333333333%; }
.offset-by-six.column,
.offset-by-six.columns { margin-left: 52%; }
.offset-by-seven.column,
.offset-by-seven.columns { margin-left: 60.6666666667%; }
.offset-by-eight.column,
.offset-by-eight.columns { margin-left: 69.3333333333%; }
.offset-by-nine.column,
.offset-by-nine.columns { margin-left: 78.0%; }
.offset-by-ten.column,
.offset-by-ten.columns { margin-left: 86.6666666667%; }
.offset-by-eleven.column,
.offset-by-eleven.columns { margin-left: 95.3333333333%; }
.offset-by-one-third.column,
.offset-by-one-third.columns { margin-left: 34.6666666667%; }
.offset-by-two-thirds.column,
.offset-by-two-thirds.columns { margin-left: 69.3333333333%; }
.offset-by-one-half.column,
.offset-by-one-half.columns { margin-left: 52%; }
}
/* Clearing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Self Clearing Goodness */
.container:after,
.row:after,
.u-cf {
content: "";
display: table;
clear: both; }
/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
display: inline-block;
height: 38px;
padding: 0 30px;
color: #555;
text-align: center;
font-size: 11px;
font-weight: 600;
line-height: 38px;
letter-spacing: .1rem;
text-transform: uppercase;
text-decoration: none;
white-space: nowrap;
background-color: transparent;
border-radius: 4px;
border: 1px solid #bbb;
cursor: pointer;
box-sizing: border-box; }
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
color: #333;
border-color: #888;
outline: 0; }
.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
color: #FFF;
background-color: #33C3F0;
border-color: #33C3F0; }
.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
color: #FFF;
background-color: #1EAEDB;
border-color: #1EAEDB; }
/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
height: 38px;
padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
background-color: #fff;
border: 1px solid #D1D1D1;
border-radius: 4px;
box-shadow: none;
box-sizing: border-box; }
/* Removes awkward default styles on some inputs for iOS */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none; }
textarea {
min-height: 65px;
padding-top: 6px;
padding-bottom: 6px; }
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
border: 1px solid #33C3F0;
outline: 0; }
label,
legend {
display: block;
margin-bottom: .5rem;
font-weight: 600; }
fieldset {
padding: 0;
border-width: 0; }
input[type="checkbox"],
input[type="radio"] {
display: inline; }
label > .label-body {
display: inline-block;
margin-left: .5rem;
font-weight: normal; }
/* =Navigation
-------- */
/* .header {
background-color: #fff;
box-shadow: 1px 1px 4px 0 rgba(0,0,0,.1);
position: fixed;
width: 100%;
z-index: 3;
} */
/* .header .menu {
clear: both;
max-height: 0;
transition: max-height .2s ease-out;
} */
.header .menu-icon {
color: white;
font-size: 30px;
line-height: 1em;
position: absolute;
left: 100%;
padding: 20px;
-webkit-transition: all .15s ease-in-out;
-moz-transition: all .15s ease-in-out;
-ms-transition: all .15s ease-in-out;
-o-transition: all .15s ease-in-out;
transition: all .15s ease-in-out;
user-select: none;
}
.header .menu-icon.active {
background-color: rgba(0,0,0, .3);
}
.header .menu-icon:hover {
color: #222;
background-color: transparent;
}
.header .logo {
line-height: 1em;
/* position: absolute;
padding: 22px;
color: black; */
-webkit-transition: all .15s ease-in-out;
-moz-transition: all .15s ease-in-out;
-ms-transition: all .15s ease-in-out;
-o-transition: all .15s ease-in-out;
transition: all .15s ease-in-out;
user-select: none;
}
.navigation.active {
/* make visible visible */
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
.navigation {
position: fixed;
top: 0; left: 0; bottom: none;
z-index: 3;
width: 100%;
-webkit-transform: translateX(-100%);
-moz-transform: translateX(-100%);
-ms-transform: translateX(-100%);
-o-transform: translateX(-100%);
transform: translateX(-100%);
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-ms-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
/* background:#3ad29f; */
color: #757575;
background-color: white;
border-bottom: 1px solid #dcdcdc;
/* border-bottom: 1px solid #dcdcdc; */
}
.navigation ul {
/* display:none; */
width:100%;
list-style:none;
margin: 0;
padding:0;
/* background-color: #fff; */
}
.header ul li {
display: block;
float: left;
text-align: center;
margin: 0;
}
.navigation ul li a {
color: #757575;
background-color: white;
}
.navigation ul li a {
display: block;
padding:1em;
text-decoration: none;
}
nav ul li a.current,
nav ul li a:hover {
background-color: #eee;
color: #757575;
}
/* nav ul li a.current,
nav ul li a:hover {
background: #2dc592;
} */
/* Float right the list item that should be right aligned */
.navigation ul li.right { float: right; }
/* Code
–––––––––––––––––––––––––––––––––––––––––––––––––– */
code {
padding: .2rem .5rem;
margin: 0 .2rem;
font-size: 90%;
white-space: nowrap;
background: #F1F1F1;
border: 1px solid #E1E1E1;
border-radius: 4px; }
pre > code {
display: block;
padding: 1rem 1.5rem;
white-space: pre; }
/* Tables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
th,
td {
padding: 12px 15px;
text-align: left;
border-bottom: 1px solid #E1E1E1; }
th:first-child,
td:first-child {
padding-left: 0; }
th:last-child,
td:last-child {
padding-right: 0; }
/* Spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
button,
.button {
margin-bottom: 1rem; }
input,
textarea,
select,
fieldset {
margin-bottom: 1.5rem; }
pre,
blockquote,
dl,
figure,
table,
p,
ul,
ol,
form {
margin-bottom: 2.5rem; }
/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width {
width: 100%;
box-sizing: border-box; }
.u-max-full-width {
max-width: 100%;
box-sizing: border-box; }
.u-pull-right {
float: right; }
.u-pull-left {
float: left; }
/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/
/* Larger than mobile */
@media (min-width: 400px) {}
/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}
/* Larger than tablet */
@media (min-width: 750px) {
.header .navigation {
/* clear: none;
float: right;
max-height: none; */
/* always visible */
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
}
/* smaller than tablet */
@media (max-width: 750px) {
.header ul li {
display: list-item;
float: none;
text-align: left;
}
.header li a {
/* padding: 20px 30px; */
display: block;
text-align: left;
}
.header .logo {
/* display: inline; */
display: none;
position: unset;
}
.navigation a.menu-icon {
display: inline;
}
.header .navigation {
width: 320px;
height: 100%;
}
.navigation ul li:hover ul {
border: none;
}
.navigation ul li.right {
float: none;
}
}
/* Larger than desktop */
@media (min-width: 1000px) {}
/* Larger than Desktop HD */
@media (min-width: 1200px) {}
.tab-content {
min-height: 390px;
}
ul.tab-nav {
list-style: none;
border-bottom: 1px solid #bbb;
padding-left: 5px;
}
ul.tab-nav li {
display: inline;
}
ul.tab-nav li span.button {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
margin-bottom: -1px;
border-bottom: none;
}
ul.tab-nav li span.active.button {
border-bottom: 0.175em solid #fff;
border-bottom-color: #00bfffcc;
color: #00bfffcc;
/* background-color: #6c6e6b; */
}
.tab-nav {
z-index: 2;
}
.tab-content .tab-pane {
display: none;
/* visibility: hidden; */
}
.tab-content .tab-pane.active {
display: block;
/* visibility: visible; */
}

38
src/js/controls/LayerControl.css
View File

@ -39,6 +39,14 @@
background: #eaeaea; background: #eaeaea;
} }
.gba-controllayers-parent-expanded .gba-controllayers-container {
display: block;
position: relative;
}
.gba-controllayers-parent-expanded {
color: #333;
}
.gba-controllayers-selector { .gba-controllayers-selector {
margin-top: 2px; margin-top: 2px;
position: relative; position: relative;
@ -58,25 +66,20 @@
.gbaLegendServiceLabel {
font-weight: bold;
}
.gbaLegendLayerLabel {
padding-top: 5px;
}
.checkboxFive { .checkboxFive {
position: relative; position: relative;
width:35px; width:35px;
height: 31py;
vertical-align: super;
} }
input[type=checkbox] { input[type=checkbox] {
position: absolute; position: absolute;
overflow: hidden; overflow: hidden;
clip: rect(0 0 0 0); clip: rect(0 0 0 0);
height:1px; /* height:1px;
width:1px; width:1px; */
padding:0; padding:0;
border:0; border:0;
} }
@ -86,12 +89,15 @@ input[type=checkbox] {
.checkboxFive label { .checkboxFive label {
cursor: pointer; cursor: pointer;
position: absolute; position: absolute;
width: 16px; width: 20px;
height: 16px; height: 20px;
top: 0; margin-left: auto;
left: 0; margin-right: auto;
left: 0;
right: 0;
text-align: center;
background: #eee; background: #eee;
border: 1px solid #ddd; /* border: 1px solid #ddd; */
} }
/* Display the tick inside the checkbox */ /* Display the tick inside the checkbox */
.checkboxFive label:after { .checkboxFive label:after {
@ -101,7 +107,7 @@ input[type=checkbox] {
width: 8px; width: 8px;
height: 5px; height: 5px;
background: transparent; background: transparent;
top: 3px; top: 5px;
left: 3px; left: 3px;
border: 3px solid #333; border: 3px solid #333;
border-top: none; border-top: none;

48
src/js/controls/LayerControl.js
View File

@ -16,6 +16,7 @@ export class LayerControl extends Control {
}; };
//private class fileds: //private class fileds:
_container;
_mainMap; _mainMap;
_scene; _scene;
_objectGroup; _objectGroup;
@ -42,13 +43,28 @@ export class LayerControl extends Control {
onAdd(map) { onAdd(map) {
this._mainMap = map; this._mainMap = map;
let className = "gba-controllayers" let className = "gba-controllayers";
let container = this._container = dom.createDom("div", { "class": className }); let container;
let toggleable = false;
if (this.options.parentDiv) {
container = this._container = document.getElementById(this.options.parentDiv);
dom.addClass(container, className);
toggleable = false;
} else {
container = this._container = dom.createDom("div", { "class": className });
toggleable = true;
}
domEvent.on(container, 'click', domEvent.stopPropagation); domEvent.on(container, 'click', domEvent.stopPropagation);
let layerContainer = this._layerContainer = dom.createDom('div', { "class": className + '-container' }, container); let layerContainer = this._layerContainer = dom.createDom('div', { "class": className + '-container' }, container);
if (this.options.collapsed) { if (this.options.collapsed && toggleable == true) {
domEvent.on(container, 'mouseenter', this._expand, this); domEvent.on(container, 'mouseenter', this._expand, this);
domEvent.on(container, 'mouseleave', this._collapse, this); domEvent.on(container, 'mouseleave', this._collapse, this);
@ -58,18 +74,21 @@ export class LayerControl extends Control {
domEvent.on(this._layersLink, 'focus', this._expand, this); domEvent.on(this._layersLink, 'focus', this._expand, this);
} }
else { else {
this._expand(); // this._expand();
this._container.classList.add("gba-controllayers-parent-expanded");
} }
this._baseLayersList = dom.createDom('div', { "class": className + '-base' }, layerContainer); this._baseLayersList = dom.createDom('div', { "class": className + '-base' }, layerContainer);
this._separator = dom.createDom('div', { "class": className + '-separator' }, layerContainer); this._separator = dom.createDom('div', { "class": className + '-separator' }, layerContainer);
//this._overlaysList = dom.createDom('div', { "class": className + '-overlays' }, layerContainer); //this._overlaysList = dom.createDom('div', { "class": className + '-overlays' }, layerContainer);
var overlayTable = dom.createDom("table", { cellpadding: 0, cellspacing: 0, width: "95%", "class": className + '-overlays' }, layerContainer); var overlayTable = dom.createDom("table", { cellpadding: 0, cellspacing: 0, width: "95%", "class": className + '-overlays u-full-width' }, layerContainer);
this._overlaysList = dom.createDom("tbody", {}, overlayTable); this._overlaysList = dom.createDom("tbody", {}, overlayTable);
this._updateLayerList(); this._updateLayerList();
if (toggleable == true) {
return container; return container;
} }
}
_addLayer(layer, name, overlay) { _addLayer(layer, name, overlay) {
let id = util.stamp(layer); let id = util.stamp(layer);
@ -112,21 +131,26 @@ export class LayerControl extends Control {
var legendEntryRow = dom.createDom("tr", { style: "display: row-table; height: 20px;" }, container); var legendEntryRow = dom.createDom("tr", { style: "display: row-table; height: 20px;" }, container);
//domStyle.set(legendEntryRow, 'display', rowVisibility); //domStyle.set(legendEntryRow, 'display', rowVisibility);
//dom.setProperties(legendEntryRow, { style: "display: row-table;" }); //dom.setProperties(legendEntryRow, { style: "display: row-table;" });
var legendDataCell = dom.createDom("td", { "style": "width:25px;vertical-align: top;"}, legendEntryRow);
let legendDiv = dom.createDom("div", { "style": "width:20px; height:20px;"}, legendDataCell);
legendDiv.style.backgroundColor = "#" + obj.layer.color;
var chkDataCell = dom.createDom("td", { "class": "checkboxFive" }, legendEntryRow); var chkDataCell = dom.createDom("td", { "class": "checkboxFive" }, legendEntryRow);
var lblDataCell = dom.createDom("td", {}, legendEntryRow); var lblDataCell = dom.createDom("td", {"style": "vertical-align: top;"}, legendEntryRow);
var input = dom.createDom("input", { type: 'checkbox', checked: checked, id: util.stamp(obj.layer) }, chkDataCell); var input = dom.createDom("input", { type: 'checkbox', checked: checked, id: util.stamp(obj.layer) }, chkDataCell);
input.layerId = util.stamp(obj.layer); input.layerId = util.stamp(obj.layer);
domEvent.on(input, 'click', function () { this._onInputClick(util.stamp(obj.layer)); }, this); domEvent.on(input, 'click', function () { this._onInputClick(util.stamp(obj.layer)); }, this);
var chkLabel = dom.createDom("label", { for: util.stamp(obj.layer) }, chkDataCell); dom.createDom("label", { for: util.stamp(obj.layer) }, chkDataCell);
//var span = dom.createDom("span", { innerHTML: " " + obj.name }, lblDataCell); dom.createDom("span", { innerHTML: " " + obj.name }, lblDataCell);
//legend entry label //legend entry label
var _table = dom.createDom("table", { width: "95%", dir: "ltr" }, lblDataCell); // var _table = dom.createDom("table", { width: "95%", dir: "ltr" }, lblDataCell);
var _tbody = dom.createDom("tbody", {}, _table); // var _tbody = dom.createDom("tbody", {}, _table);
var _tr = dom.createDom("tr", {}, _tbody); // var _tr = dom.createDom("tr", {}, _tbody);
var _td = dom.createDom("td", { innerHTML: obj.name, align: this.alignRight ? "right" : "left" }, _tr); // var _td = dom.createDom("td", { innerHTML: obj.name, align: this.alignRight ? "right" : "left" }, _tr);

37
src/js/core/domUtil.js
View File

@ -86,6 +86,43 @@ export function setProperties(element, properties) {
} }
} }
// @function addClass(el: HTMLElement, name: String)
// Adds `name` to the element's class attribute.
export function addClass(el, name) {
if (el.classList !== undefined) {
var classes = util.trim(name).split(/\s+/);
for (var i = 0, len = classes.length; i < len; i++) {
el.classList.add(classes[i]);
}
} else if (!hasClass(el, name)) {
var className = getClass(el);
setClass(el, (className ? className + ' ' : '') + name);
}
}
// @function setClass(el: HTMLElement, name: String)
// Sets the element's class.
export function setClass(el, name) {
if (el.className.baseVal === undefined) {
el.className = name;
} else {
// in case of SVG element
el.className.baseVal = name;
}
}
// @function getClass(el: HTMLElement): String
// Returns the element's class.
export function getClass(el) {
// Check if the element is an SVGElementInstance and use the correspondingElement instead
// (Required for linked SVG elements in IE11.)
if (el.correspondingElement) {
el = el.correspondingElement;
}
return el.className.baseVal === undefined ? el.className : el.className.baseVal;
}
let ATTRIBUTE_MAP = { let ATTRIBUTE_MAP = {
'cellpadding': 'cellPadding', 'cellpadding': 'cellPadding',
'cellspacing': 'cellSpacing', 'cellspacing': 'cellSpacing',

6
src/js/core/utilities.js
View File

@ -166,3 +166,9 @@ export function hasTouch () {
|| window.navigator.msMaxTouchPoints; || window.navigator.msMaxTouchPoints;
return isTouchDevice; return isTouchDevice;
} }
// @function trim(str: String): String
// Compatibility polyfill for [String.prototype.trim](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String/Trim)
export function trim(str) {
return str.trim ? str.trim() : str.replace(/^\s+|\s+$/g, '');
}

149
src/js/main.js
View File

@ -13,6 +13,7 @@ import { LayerControl } from './controls/LayerControl';
import { Mesh } from 'three/src/objects/Mesh'; import { Mesh } from 'three/src/objects/Mesh';
import { SphereGeometry } from 'three/src/geometries/SphereGeometry'; import { SphereGeometry } from 'three/src/geometries/SphereGeometry';
import { MeshLambertMaterial } from 'three/src/materials/MeshLambertMaterial'; import { MeshLambertMaterial } from 'three/src/materials/MeshLambertMaterial';
import * as util from './core/utilities';
import '../css/page.css'; /* style loader will import it */ import '../css/page.css'; /* style loader will import it */
@ -22,6 +23,9 @@ class Application {
this.container = container; this.container = container;
this.running = false; this.running = false;
this.wireframeMode = false; this.wireframeMode = false;
this.canvas;
this._canvasImageUrl;
this.downloadButton
this.objects = []; this.objects = [];
@ -35,7 +39,17 @@ class Application {
this._fullWindow = true; this._fullWindow = true;
} }
// this.canvas = document.querySelector('#imgCanvas');
// this.$topTextInput = document.querySelector('#topText');
// this.$bottomTextInput = document.querySelector('#bottomText');
// this.$imageInput = document.querySelector('#image');
this.downloadButton = document.querySelector('#btnDownloadCanvasImage');
this.menuIcon = document.querySelector('#menu-icon');
this.navigation = document.getElementsByClassName('navigation')[0];
// this.addEventListeners();
this.createScene(); this.createScene();
this.addEventListeners();
} }
createScene() { createScene() {
@ -49,7 +63,7 @@ class Application {
/* Renderer */ /* Renderer */
// var bgcolor = 0xfdfdfd; // var bgcolor = 0xfdfdfd;
let bgcolor = 0xfdfdfd; let bgcolor = 0xfdfdfd;
this.renderer = new WebGLRenderer({ alpha: true, antialias: true }); this.renderer = new WebGLRenderer({ alpha: true, antialias: true, preserveDrawingBuffer: true });
this.renderer.setPixelRatio(window.devicePixelRatio); this.renderer.setPixelRatio(window.devicePixelRatio);
// this.renderer.setSize(window.innerWidth, window.innerHeight); // this.renderer.setSize(window.innerWidth, window.innerHeight);
// document.body.appendChild(this.renderer.domElement); // document.body.appendChild(this.renderer.domElement);
@ -106,12 +120,14 @@ class Application {
// this.map.maxDistance = size*15; // this.map.maxDistance = size*15;
//add map controls: //add map controls:
if (!util.hasTouch) {
let coordinates = new Coordinates({ camera: this.camera, crs: "EPSG:3034" }).addTo(this.map); let coordinates = new Coordinates({ camera: this.camera, crs: "EPSG:3034" }).addTo(this.map);
// coordinates.addListener('onPoint', (vector) => { // coordinates.addListener('onPoint', (vector) => {
// this.queryMarker.position.set(vector.x, vector.y, vector.z); // this.queryMarker.position.set(vector.x, vector.y, vector.z);
// // this.queryMarker.updateMatrixWorld(); // // this.queryMarker.updateMatrixWorld();
// this.animate(); // this.animate();
// }, this); // }, this);
}
this.northArrow = new NortArrow({ headLength: 1, headWidth: 1 }).addTo(this.map); this.northArrow = new NortArrow({ headLength: 1, headWidth: 1 }).addTo(this.map);
let dxf134Layer = new TinLayer({ let dxf134Layer = new TinLayer({
@ -145,12 +161,13 @@ class Application {
this.map.addLayer(dxf140Layer); this.map.addLayer(dxf140Layer);
new LayerControl(this.map.layers, { new LayerControl(this.map.layers, {
collapsed: true collapsed: true,
parentDiv: 'layer-control-parent-id'
}).addTo(this.map); }).addTo(this.map);
domEvent.on(window, 'resize', this.onWindowResize, this); // domEvent.on(window, 'resize', this.onWindowResize, this);
domEvent.on(window, 'keydown', this.keydown, this); // domEvent.on(window, 'keydown', this.keydown, this);
this.start(); this.start();
} }
@ -237,6 +254,130 @@ class Application {
this.renderer.render(this.scene, this.camera); this.renderer.render(this.scene, this.camera);
this.northArrow.animate(); this.northArrow.animate();
} }
addEventListeners() {
domEvent.on(window, 'resize', this.onWindowResize, this);
domEvent.on(window, 'keydown', this.keydown, this);
// let inputNodes = [this.$topTextInput, this.$bottomTextInput, this.$imageInput];
// inputNodes.forEach(element => domEvent.on(element, 'keyup', this.createMeme, this));
// //if image is changed
// inputNodes.forEach(element => domEvent.on(element, 'change', this.createMeme, this));
domEvent.on(this.downloadButton, 'click', this.downloadMapImage, this);
domEvent.on(this.menuIcon, 'click', function (e) {
e.preventDefault();
this.navigation.classList.toggle("active");
}, this);
var tabButtons = [].slice.call(document.querySelectorAll('ul.tab-nav li span.button'));
tabButtons.map(function (button) {
button.addEventListener('click', function () {
document.querySelector('li span.active.button').classList.remove('active');
button.classList.add('active');
document.querySelector('.tab-pane.active').classList.remove('active');
document.querySelector(button.getAttribute('name')).classList.add('active');
})
})
}
downloadMapImage() {
// if(!this.$imageInput.files[0]) {
// this.$imageInput.parentElement.classList.add('has-error');
// return;
// }
// if(this.$bottomTextInput.value === '') {
// this.$imageInput.parentElement.classList.remove('has-error');
// this.$bottomTextInput.parentElement.classList.add('has-error');
// return;
// }
// this.$imageInput.parentElement.classList.remove('has-error');
// this.$bottomTextInput.parentElement.classList.remove('has-error');
// const imageSource = this.renderer.domElement.toDataURL('image/png');
// const att = document.createAttribute('href');
// att.value = imageSource.replace(/^data:image\/[^;]/, 'data:application/octet-stream');
// this.downloadButton.setAttributeNode(att);
// this.renderer.preserveDrawingBuffer = true;
// this.renderer.render(this.scene, this.camera);
this.saveCanvasImage(this.renderer.domElement);
}
saveCanvasImage(canvas) {
// !HTMLCanvasElement.prototype.toBlob
// https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement.toBlob
// decode the String
var binStr = atob(canvas.toDataURL("image/png").split(',')[1]);
var len = binStr.length;
var arr = new Uint8Array(len);
for (var i = 0; i < len; i++) {
arr[i] = binStr.charCodeAt(i);
}
this.saveBlob(new Blob([arr], { type: "image/png" }));
}
saveBlob(blob) {
// ie
if (window.navigator.msSaveBlob !== undefined) {
window.navigator.msSaveBlob(blob, filename);
//app.popup.hide();
}
else {
// create object url
if (this._canvasImageUrl) {
URL.revokeObjectURL(this._canvasImageUrl);
}
this._canvasImageUrl = URL.createObjectURL(blob);
// display a link to save the image
var e = this.downloadButton;//document.createElement("a");
e.href = this._canvasImageUrl;
}
}
createMeme() {
let context = this.$canvas.getContext('2d');
// font size of top and bottom text
let fontSize = ((this.canvas.width + this.canvas.height) / 2) * 4 / 100;
context.font = `${fontSize}pt sans-serif`;
context.textAlign = 'center';
context.textBaseline = 'top';
/**
* Stroke Text Style
*/
context.lineWidth = fontSize / 5;
context.strokeStyle = 'black';
/**
* Fill Text Style
*/
context.fillStyle = 'white';
// Fix lines over M
context.lineJoin = 'round';
// get he value of the top text an dbottom text from the input fields
let topText = this.$topTextInput.value.toUpperCase();
let bottomText = this.$bottomTextInput.value.toUpperCase();
// Top Text: first parameter text, second and thir parameters contain location where the text should start rendering
context.strokeText(topText, this.canvas.width / 2, this.canvas.height * (5 / 100));
context.fillText(topText, this.canvas.width / 2, this.canvas.height * (5 / 100));
// Bottom Text
context.strokeText(bottomText, this.canvas.width / 2, this.canvas.height * (90 / 100));
context.fillText(bottomText, this.canvas.width / 2, this.canvas.height * (90 / 100));
}
} }
var container = document.getElementById("webgl"); var container = document.getElementById("webgl");