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

- ShowModal.js component

Browse Source 
- question icon in LayerControl.js
- other includes in main.js
- support for decorators (.babelrc)
- package updates (package.json)
- trials with vuejs (webpack.config.js)
This commit is contained in:
Arno Kaimbacher 2021-03-17 09:22:12 +01:00
parent 78ae3e2a63
commit fef72d5402
9 changed files with 452 additions and 103 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.babelrc
View File

@ -1,5 +1,6 @@
{
"plugins": [
"plugins": [
["@babel/plugin-proposal-decorators", { "legacy": true }],
["@babel/plugin-proposal-class-properties", { "loose": true }],
["@babel/plugin-transform-runtime", { "regenerator": true }]
]

21
index.html
View File

@ -78,9 +78,25 @@
</header>
<section class='main u-full-width'>
<section id="app" class='main u-full-width'>
<!-- <Modal v-if="isModalVisible" @close="closeModal">
<template slot="header">
Test
</template>
<template slot="body">
Mit dem Setzen des Hakens bestätige ich hiermit
<ol type="1">
<li>
die Data Policy von Tethys RDR sowie die Terms & Conditions von Tethys
gelesen und verstanden zu haben
</li>
<li>das Einverständnis aller Co-Autoren über die bevorstehende Datenpublikation schriftlich
eingeholt zu haben</li>
<li>sowohl mit der Data Policy als auch mit den Terms & Conditions einverstanden zu sein</li>
</ol>
</template>
</Modal> -->
<div class="canvas-area eight columns">
<div id="div-map">
@ -135,6 +151,7 @@
<input type="checkbox" id="chkGrid" autocomplete="off" checked>
<span class="label-body">set visibility of coordinate grid</span>
</label>
<i class="fas fa-info-circle" @click="showModal" style="font-size:24px"></i>
</div>
</div>

218
package-lock.json generated
View File

@ -18,6 +18,7 @@
"devDependencies": {
"@babel/core": "^7.12.9",
"@babel/plugin-proposal-class-properties": "^7.12.1",
"@babel/plugin-proposal-decorators": "^7.13.5",
"@babel/plugin-transform-runtime": "^7.12.1",
"@babel/preset-env": "^7.12.7",
"babel-loader": "^8.2.1",
@ -48,9 +49,9 @@
}
},
"node_modules/@babel/compat-data": {
"version": "7.13.8",
"resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.13.8.tgz",
"integrity": "sha512-EaI33z19T4qN3xLXsGf48M2cDqa6ei9tPZlfLdb2HC+e/cFtREiRd8hdSqDbwdLB0/+gLwqJmCYASH0z2bUdog==",
"version": "7.13.11",
"resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.13.11.tgz",
"integrity": "sha512-BwKEkO+2a67DcFeS3RLl0Z3Gs2OvdXewuWjc1Hfokhb5eQWP9YRYH1/+VrVZvql2CfjOiNGqSAFOYt4lsqTHzg==",
"dev": true
},
"node_modules/@babel/core": {
@ -130,9 +131,9 @@
}
},
"node_modules/@babel/helper-create-class-features-plugin": {
"version": "7.13.10",
"resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.13.10.tgz",
"integrity": "sha512-YV7r2YxdTUaw84EwNkyrRke/TJHR/UXGiyvACRqvdVJ2/syV2rQuJNnaRLSuYiop8cMRXOgseTGoJCWX0q2fFg==",
"version": "7.13.11",
"resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.13.11.tgz",
"integrity": "sha512-ays0I7XYq9xbjCSvT+EvysLgfc3tOkwCULHjrnscGT3A9qD4sk3wXnJ3of0MAWsWGjdinFvajHU2smYuqXKMrw==",
"dev": true,
"dependencies": {
"@babel/helper-function-name": "^7.12.13",
@ -363,9 +364,9 @@
}
},
"node_modules/@babel/parser": {
"version": "7.13.10",
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.13.10.tgz",
"integrity": "sha512-0s7Mlrw9uTWkYua7xWr99Wpk2bnGa0ANleKfksYAES8LpWH4gW1OUr42vqKNf0us5UQNfru2wPqMqRITzq/SIQ==",
"version": "7.13.11",
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.13.11.tgz",
"integrity": "sha512-PhuoqeHoO9fc4ffMEVk4qb/w/s2iOSWohvbHxLtxui0eBg3Lg5gN1U8wp1V1u61hOWkPQJJyJzGH6Y+grwkq8Q==",
"dev": true,
"bin": {
"parser": "bin/babel-parser.js"
@ -401,6 +402,20 @@
"@babel/core": "^7.0.0-0"
}
},
"node_modules/@babel/plugin-proposal-decorators": {
"version": "7.13.5",
"resolved": "https://registry.npmjs.org/@babel/plugin-proposal-decorators/-/plugin-proposal-decorators-7.13.5.tgz",
"integrity": "sha512-i0GDfVNuoapwiheevUOuSW67mInqJ8qw7uWfpjNVeHMn143kXblEy/bmL9AdZ/0yf/4BMQeWXezK0tQIvNPqag==",
"dev": true,
"dependencies": {
"@babel/helper-create-class-features-plugin": "^7.13.0",
"@babel/helper-plugin-utils": "^7.13.0",
"@babel/plugin-syntax-decorators": "^7.12.13"
},
"peerDependencies": {
"@babel/core": "^7.0.0-0"
}
},
"node_modules/@babel/plugin-proposal-dynamic-import": {
"version": "7.13.8",
"resolved": "https://registry.npmjs.org/@babel/plugin-proposal-dynamic-import/-/plugin-proposal-dynamic-import-7.13.8.tgz",
@ -575,6 +590,18 @@
"@babel/core": "^7.0.0-0"
}
},
"node_modules/@babel/plugin-syntax-decorators": {
"version": "7.12.13",
"resolved": "https://registry.npmjs.org/@babel/plugin-syntax-decorators/-/plugin-syntax-decorators-7.12.13.tgz",
"integrity": "sha512-Rw6aIXGuqDLr6/LoBBYE57nKOzQpz/aDkKlMqEwH+Vp0MXbG6H/TfRjaY343LKxzAKAMXIHsQ8JzaZKuDZ9MwA==",
"dev": true,
"dependencies": {
"@babel/helper-plugin-utils": "^7.12.13"
},
"peerDependencies": {
"@babel/core": "^7.0.0-0"
}
},
"node_modules/@babel/plugin-syntax-dynamic-import": {
"version": "7.8.3",
"resolved": "https://registry.npmjs.org/@babel/plugin-syntax-dynamic-import/-/plugin-syntax-dynamic-import-7.8.3.tgz",
@ -1370,9 +1397,9 @@
"peer": true
},
"node_modules/@types/node": {
"version": "14.14.33",
"resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.33.tgz",
"integrity": "sha512-oJqcTrgPUF29oUP8AsUqbXGJNuPutsetaa9kTQAQce5Lx5dTYWV02ScBiT/k1BX/Z7pKeqedmvp39Wu4zR7N7g==",
"version": "14.14.35",
"resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.35.tgz",
"integrity": "sha512-Lt+wj8NVPx0zUmUwumiVXapmaLUcAk3yPuHCFVXras9k5VT9TdhJqKqGVUQCD60OTMCl0qxJ57OiTL0Mic3Iag==",
"dev": true
},
"node_modules/@types/normalize-package-data": {
@ -1976,9 +2003,9 @@
}
},
"node_modules/caniuse-lite": {
"version": "1.0.30001198",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001198.tgz",
"integrity": "sha512-r5GGgESqOPZzwvdLVER374FpQu2WluCF1Z2DSiFJ89KSmGjT0LVKjgv4NcAqHmGWF9ihNpqRI9KXO9Ex4sKsgA==",
"version": "1.0.30001202",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001202.tgz",
"integrity": "sha512-ZcijQNqrcF8JNLjzvEiXqX4JUYxoZa7Pvcsd9UD8Kz4TvhTonOSNRsK+qtvpVL4l6+T1Rh4LFtLfnNWg6BGWCQ==",
"dev": true
},
"node_modules/caseless": {
@ -2339,9 +2366,9 @@
}
},
"node_modules/css-loader": {
"version": "5.1.2",
"resolved": "https://registry.npmjs.org/css-loader/-/css-loader-5.1.2.tgz",
"integrity": "sha512-T7vTXHSx0KrVEg/xjcl7G01RcVXpcw4OELwDPvkr7izQNny85A84dK3dqrczuEfBcu7Yg7mdTjJLSTibRUoRZg==",
"version": "5.1.3",
"resolved": "https://registry.npmjs.org/css-loader/-/css-loader-5.1.3.tgz",
"integrity": "sha512-CoPZvyh8sLiGARK3gqczpfdedbM74klGWurF2CsNZ2lhNaXdLIUks+3Mfax3WBeRuHoglU+m7KG/+7gY6G4aag==",
"dev": true,
"dependencies": {
"camelcase": "^6.2.0",
@ -2382,6 +2409,18 @@
"node": ">=8.9.0"
}
},
"node_modules/css-loader/node_modules/lru-cache": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
"integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
"dev": true,
"dependencies": {
"yallist": "^4.0.0"
},
"engines": {
"node": ">=10"
}
},
"node_modules/css-loader/node_modules/schema-utils": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.0.0.tgz",
@ -2578,9 +2617,9 @@
}
},
"node_modules/electron-to-chromium": {
"version": "1.3.685",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.685.tgz",
"integrity": "sha512-C3oFZNkJ8lz85ADqr3hzpjBc2ciejMRN2SCd/D0hwcqpr6MGxfdN/j89VN6l+ERTuCUvhg0VYsf40Q4qTz4bhQ==",
"version": "1.3.689",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.689.tgz",
"integrity": "sha512-WCn+ZaU3V8WttlLNSOGOAlR2XpxibGre7slwGrYBB6oTjYPgP29LNDGG6wLvLTMseLdE+G1vno7PfY7JyDV48g==",
"dev": true
},
"node_modules/emoji-regex": {
@ -3808,18 +3847,6 @@
"node": ">=0.10.0"
}
},
"node_modules/lru-cache": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
"integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
"dev": true,
"dependencies": {
"yallist": "^4.0.0"
},
"engines": {
"node": ">=10"
}
},
"node_modules/make-dir": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
@ -4051,9 +4078,9 @@
"dev": true
},
"node_modules/nanoid": {
"version": "3.1.20",
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.20.tgz",
"integrity": "sha512-a1cQNyczgKbLX9jwbS/+d7W8fX/RfgYR7lVWwWOGIPNgK2m0MWvrGF6/m4kk6U3QcFMnZf3RIhL0v2Jgh/0Uxw==",
"version": "3.1.22",
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.22.tgz",
"integrity": "sha512-/2ZUaJX2ANuLtTvqTlgqBQNJoQO398KyJgZloL0PZkC0dpysjncRUPsFe3DUPzz/y3h+u7C46np8RMuvF3jsSQ==",
"dev": true,
"bin": {
"nanoid": "bin/nanoid.cjs"
@ -4098,6 +4125,18 @@
"node": ">= 10.12.0"
}
},
"node_modules/node-gyp/node_modules/lru-cache": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
"integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
"dev": true,
"dependencies": {
"yallist": "^4.0.0"
},
"engines": {
"node": ">=10"
}
},
"node_modules/node-gyp/node_modules/semver": {
"version": "7.3.4",
"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.4.tgz",
@ -6178,9 +6217,9 @@
}
},
"node_modules/webpack": {
"version": "5.24.4",
"resolved": "https://registry.npmjs.org/webpack/-/webpack-5.24.4.tgz",
"integrity": "sha512-RXOdxF9hFFFhg47BryCgyFrEyyu7Y/75/uiI2DoUiTMqysK+WczVSTppvkR47oZcmI/DPaXCiCiaXBP8QjkNpA==",
"version": "5.26.0",
"resolved": "https://registry.npmjs.org/webpack/-/webpack-5.26.0.tgz",
"integrity": "sha512-9kQATUOGQBkqzNKFmFON4KXZDsXnE7xk58tBxca8aCi+6/QhAbmWIvtGqBL66XIsBFpomFH0/0KyCaySo0ta2g==",
"dev": true,
"dependencies": {
"@types/eslint-scope": "^3.7.0",
@ -6603,9 +6642,9 @@
}
},
"@babel/compat-data": {
"version": "7.13.8",
"resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.13.8.tgz",
"integrity": "sha512-EaI33z19T4qN3xLXsGf48M2cDqa6ei9tPZlfLdb2HC+e/cFtREiRd8hdSqDbwdLB0/+gLwqJmCYASH0z2bUdog==",
"version": "7.13.11",
"resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.13.11.tgz",
"integrity": "sha512-BwKEkO+2a67DcFeS3RLl0Z3Gs2OvdXewuWjc1Hfokhb5eQWP9YRYH1/+VrVZvql2CfjOiNGqSAFOYt4lsqTHzg==",
"dev": true
},
"@babel/core": {
@ -6675,9 +6714,9 @@
}
},
"@babel/helper-create-class-features-plugin": {
"version": "7.13.10",
"resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.13.10.tgz",
"integrity": "sha512-YV7r2YxdTUaw84EwNkyrRke/TJHR/UXGiyvACRqvdVJ2/syV2rQuJNnaRLSuYiop8cMRXOgseTGoJCWX0q2fFg==",
"version": "7.13.11",
"resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.13.11.tgz",
"integrity": "sha512-ays0I7XYq9xbjCSvT+EvysLgfc3tOkwCULHjrnscGT3A9qD4sk3wXnJ3of0MAWsWGjdinFvajHU2smYuqXKMrw==",
"dev": true,
"requires": {
"@babel/helper-function-name": "^7.12.13",
@ -6899,9 +6938,9 @@
}
},
"@babel/parser": {
"version": "7.13.10",
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.13.10.tgz",
"integrity": "sha512-0s7Mlrw9uTWkYua7xWr99Wpk2bnGa0ANleKfksYAES8LpWH4gW1OUr42vqKNf0us5UQNfru2wPqMqRITzq/SIQ==",
"version": "7.13.11",
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.13.11.tgz",
"integrity": "sha512-PhuoqeHoO9fc4ffMEVk4qb/w/s2iOSWohvbHxLtxui0eBg3Lg5gN1U8wp1V1u61hOWkPQJJyJzGH6Y+grwkq8Q==",
"dev": true
},
"@babel/plugin-proposal-async-generator-functions": {
@ -6925,6 +6964,17 @@
"@babel/helper-plugin-utils": "^7.13.0"
}
},
"@babel/plugin-proposal-decorators": {
"version": "7.13.5",
"resolved": "https://registry.npmjs.org/@babel/plugin-proposal-decorators/-/plugin-proposal-decorators-7.13.5.tgz",
"integrity": "sha512-i0GDfVNuoapwiheevUOuSW67mInqJ8qw7uWfpjNVeHMn143kXblEy/bmL9AdZ/0yf/4BMQeWXezK0tQIvNPqag==",
"dev": true,
"requires": {
"@babel/helper-create-class-features-plugin": "^7.13.0",
"@babel/helper-plugin-utils": "^7.13.0",
"@babel/plugin-syntax-decorators": "^7.12.13"
}
},
"@babel/plugin-proposal-dynamic-import": {
"version": "7.13.8",
"resolved": "https://registry.npmjs.org/@babel/plugin-proposal-dynamic-import/-/plugin-proposal-dynamic-import-7.13.8.tgz",
@ -7057,6 +7107,15 @@
"@babel/helper-plugin-utils": "^7.12.13"
}
},
"@babel/plugin-syntax-decorators": {
"version": "7.12.13",
"resolved": "https://registry.npmjs.org/@babel/plugin-syntax-decorators/-/plugin-syntax-decorators-7.12.13.tgz",
"integrity": "sha512-Rw6aIXGuqDLr6/LoBBYE57nKOzQpz/aDkKlMqEwH+Vp0MXbG6H/TfRjaY343LKxzAKAMXIHsQ8JzaZKuDZ9MwA==",
"dev": true,
"requires": {
"@babel/helper-plugin-utils": "^7.12.13"
}
},
"@babel/plugin-syntax-dynamic-import": {
"version": "7.8.3",
"resolved": "https://registry.npmjs.org/@babel/plugin-syntax-dynamic-import/-/plugin-syntax-dynamic-import-7.8.3.tgz",
@ -7701,9 +7760,9 @@
"peer": true
},
"@types/node": {
"version": "14.14.33",
"resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.33.tgz",
"integrity": "sha512-oJqcTrgPUF29oUP8AsUqbXGJNuPutsetaa9kTQAQce5Lx5dTYWV02ScBiT/k1BX/Z7pKeqedmvp39Wu4zR7N7g==",
"version": "14.14.35",
"resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.35.tgz",
"integrity": "sha512-Lt+wj8NVPx0zUmUwumiVXapmaLUcAk3yPuHCFVXras9k5VT9TdhJqKqGVUQCD60OTMCl0qxJ57OiTL0Mic3Iag==",
"dev": true
},
"@types/normalize-package-data": {
@ -8200,9 +8259,9 @@
}
},
"caniuse-lite": {
"version": "1.0.30001198",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001198.tgz",
"integrity": "sha512-r5GGgESqOPZzwvdLVER374FpQu2WluCF1Z2DSiFJ89KSmGjT0LVKjgv4NcAqHmGWF9ihNpqRI9KXO9Ex4sKsgA==",
"version": "1.0.30001202",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001202.tgz",
"integrity": "sha512-ZcijQNqrcF8JNLjzvEiXqX4JUYxoZa7Pvcsd9UD8Kz4TvhTonOSNRsK+qtvpVL4l6+T1Rh4LFtLfnNWg6BGWCQ==",
"dev": true
},
"caseless": {
@ -8506,9 +8565,9 @@
}
},
"css-loader": {
"version": "5.1.2",
"resolved": "https://registry.npmjs.org/css-loader/-/css-loader-5.1.2.tgz",
"integrity": "sha512-T7vTXHSx0KrVEg/xjcl7G01RcVXpcw4OELwDPvkr7izQNny85A84dK3dqrczuEfBcu7Yg7mdTjJLSTibRUoRZg==",
"version": "5.1.3",
"resolved": "https://registry.npmjs.org/css-loader/-/css-loader-5.1.3.tgz",
"integrity": "sha512-CoPZvyh8sLiGARK3gqczpfdedbM74klGWurF2CsNZ2lhNaXdLIUks+3Mfax3WBeRuHoglU+m7KG/+7gY6G4aag==",
"dev": true,
"requires": {
"camelcase": "^6.2.0",
@ -8536,6 +8595,15 @@
"json5": "^2.1.2"
}
},
"lru-cache": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
"integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
"dev": true,
"requires": {
"yallist": "^4.0.0"
}
},
"schema-utils": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.0.0.tgz",
@ -8667,9 +8735,9 @@
}
},
"electron-to-chromium": {
"version": "1.3.685",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.685.tgz",
"integrity": "sha512-C3oFZNkJ8lz85ADqr3hzpjBc2ciejMRN2SCd/D0hwcqpr6MGxfdN/j89VN6l+ERTuCUvhg0VYsf40Q4qTz4bhQ==",
"version": "1.3.689",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.689.tgz",
"integrity": "sha512-WCn+ZaU3V8WttlLNSOGOAlR2XpxibGre7slwGrYBB6oTjYPgP29LNDGG6wLvLTMseLdE+G1vno7PfY7JyDV48g==",
"dev": true
},
"emoji-regex": {
@ -9633,15 +9701,6 @@
"signal-exit": "^3.0.0"
}
},
"lru-cache": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
"integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
"dev": true,
"requires": {
"yallist": "^4.0.0"
}
},
"make-dir": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
@ -9816,9 +9875,9 @@
"dev": true
},
"nanoid": {
"version": "3.1.20",
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.20.tgz",
"integrity": "sha512-a1cQNyczgKbLX9jwbS/+d7W8fX/RfgYR7lVWwWOGIPNgK2m0MWvrGF6/m4kk6U3QcFMnZf3RIhL0v2Jgh/0Uxw==",
"version": "3.1.22",
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.22.tgz",
"integrity": "sha512-/2ZUaJX2ANuLtTvqTlgqBQNJoQO398KyJgZloL0PZkC0dpysjncRUPsFe3DUPzz/y3h+u7C46np8RMuvF3jsSQ==",
"dev": true
},
"neo-async": {
@ -9851,6 +9910,15 @@
"which": "^2.0.2"
},
"dependencies": {
"lru-cache": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
"integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
"dev": true,
"requires": {
"yallist": "^4.0.0"
}
},
"semver": {
"version": "7.3.4",
"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.4.tgz",
@ -11440,9 +11508,9 @@
}
},
"webpack": {
"version": "5.24.4",
"resolved": "https://registry.npmjs.org/webpack/-/webpack-5.24.4.tgz",
"integrity": "sha512-RXOdxF9hFFFhg47BryCgyFrEyyu7Y/75/uiI2DoUiTMqysK+WczVSTppvkR47oZcmI/DPaXCiCiaXBP8QjkNpA==",
"version": "5.26.0",
"resolved": "https://registry.npmjs.org/webpack/-/webpack-5.26.0.tgz",
"integrity": "sha512-9kQATUOGQBkqzNKFmFON4KXZDsXnE7xk58tBxca8aCi+6/QhAbmWIvtGqBL66XIsBFpomFH0/0KyCaySo0ta2g==",
"dev": true,
"requires": {
"@types/eslint-scope": "^3.7.0",

1
package.json
View File

@ -15,6 +15,7 @@
"devDependencies": {
"@babel/core": "^7.12.9",
"@babel/plugin-proposal-class-properties": "^7.12.1",
"@babel/plugin-proposal-decorators": "^7.13.5",
"@babel/plugin-transform-runtime": "^7.12.1",
"@babel/preset-env": "^7.12.7",
"babel-loader": "^8.2.1",

60
src/js/components/ShowModal.css Normal file
View File

@ -0,0 +1,60 @@
.modal-backdrop {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.3);
display: flex;
justify-content: center;
align-items: center;
z-index: 1001;
}
.modal {
background: #ffffff;
box-shadow: 2px 2px 20px 1px;
overflow-x: auto;
display: flex;
flex-direction: column;
width: 80%;
}
.modal-header,
.modal-footer {
padding: 15px;
display: flex;
}
.modal-header {
border-bottom: 1px solid #eeeeee;
color: #4aae9b;
justify-content: space-between;
}
.modal-footer {
border-top: 1px solid #eeeeee;
justify-content: flex-end;
}
.modal-body {
position: relative;
padding: 20px 10px;
}
.btn-close {
border: none;
font-size: 20px;
padding: 20px;
cursor: pointer;
font-weight: bold;
color: #4aae9b;
background: transparent;
}
.btn-green {
color: white;
background: #4aae9b;
border: 1px solid #4aae9b;
border-radius: 2px;
}

154
src/js/components/ShowModal.js Normal file
View File

@ -0,0 +1,154 @@
// import { Component, Vue } from "vue-property-decorator";
import * as dom from "../core/domUtil";
import * as domEvent from "../core/domEvent";
import * as util from "../core/utilities";
import "./ShowModal.css";
// @Component({})
export default class Modal {
defaultTitle = "3DViewer";
declaredClass = "MobileDialog";
options = {};
constructor(title, parentContainer, options = {}) {
// super(options);
util.setOptions(this, options);
this.title = title ? title : this.defaultTitle;
this.options = options || this.default;
this.init(parentContainer);
}
init(parentContainer) {
let className = "gba-basemap-control";
let container;
let toggleable = false;
if (this.options.position) {
container = this._container = dom.createDom("div", { "class": className });
toggleable = true;
} else {
container = this._container = parentContainer;
// dom.addClass(container, className);
toggleable = false;
}
let dialogHtml = `
<div class="modal-backdrop">
<div
class="modal"
role="dialog"
aria-labelledby="modalTitle"
aria-describedby="modalDescription"
>
<header class="modal-header" id="modalTitle">
<slot name="header">
${this.title}
<button
type="button"
class="btn-close"
id="btn-close"
v-on:click="close"
aria-label="Close modal"
>
x
</button>
</slot>
</header>
<section class="modal-body" id="modalDescription">
<slot name="body">I'm the default body!</slot>
</section>
<section class="modal-body" id="additionalDescription">
</section>
<footer class="modal-footer">
<slot name="footer">
</slot>
</footer>
</div>
</div>
`;
this.domNode = dom.createDom("div", { class: "popup" }, container);
this.dialogDiv = dom.createDom("div", { class: this.options.klass + " fm_overlay hide", innerHTML: dialogHtml }, container);
this.popupcontent = dom.byId("modalDescription");
//additional info div
this.pageinfo = dom.byId("additionalDescription");
let popup_close = dom.byId("btn-close");
domEvent.on(popup_close, 'click', domEvent.preventDefault);
domEvent.on(popup_close, 'click', domEvent.stopPropagation);
domEvent.on(popup_close, 'click', this.hide, this);
}
hide(e) {
this.dialogDiv.classList.add('hide');
this.dialogDiv.classList.remove('show');
}
show(html) {
let isHelp = html === undefined ? true : false;
if (html === undefined) {
html = this._help();
}
if (html instanceof HTMLElement) {
this.popupcontent.innerHTML = "";
this.popupcontent.appendChild(html);
}
else {
this.popupcontent.innerHTML = html;
}
// this.domNode.getElementsByClassName("popuptitle")[0].innerHTML = title || this.title;
if (!isHelp) {
//document.getElementById("pageinfo").style.display = "none";
this.pageinfo.style.display = "none";
}
else {
this.pageinfo.innerHTML = `
<div id="about">
This project is using the following libraries, fonts & styles:
<ul>
<li>three.js + OrbitControls.js <a href="https://threejs.org/" target="_blank">threejs.org</a>
<a href="https://github.com/mrdoob/three.js/blob/dev/LICENSE" target="_blank" class="license">MIT LICENSE</a></li>
<li id="lib_proj4js">Proj4js <a href="https://github.com/proj4js/proj4js" target="_blank">github.com/proj4js/proj4js</a>
<a href="https://github.com/proj4js/proj4js/blob/master/LICENSE.md" target="_blank" class="license">Proj4js -- Javascript reprojection library</a></li>
<li id="lib_normalize">normalize.css <a href="https://github.com/necolas/normalize.css" target="_blank">github.com/necolas/normalize.css</a>
<a href="https://github.com/necolas/normalize.css/blob/master/LICENSE.md" target="_blank" class="license">MIT License</a></li>
<li id="lib_fontawesome">Font Awesome Free <a href="https://github.com/FortAwesome/Font-Awesome" target="_blank">github.com/FortAwesome/Font-Awesome</a>
<a href="https://github.com/FortAwesome/Font-Awesome/blob/master/LICENSE.txt" target="_blank" class="license">Font: SIL OFL 1.1, CSS: MIT License, Icons: CC BY 4.0 License</a></li>
</ul>
</div>`;
this.pageinfo.style.display = "block";
}
this.dialogDiv.classList.add('show');
this.dialogDiv.classList.remove('hide');
}
_help() {
let html = "";
//var imagePath = $UrlHelper.resolve('~') + "content/img/";
let imagePath = "images/map/";
let list = '<ul><li id="leftMouse"><img src=' + imagePath + 'leftMouse.png> Rotate 3D Model</li>' +
'<li id="middleMouse"><img src=' + imagePath + 'middleMouse.png> Zoom 3D Model</li>' +
'<li id="rightMouse"><img src=' + imagePath + 'rightMouse.png> Pan 3D Model</li></ul>';
html += list;
return html;
}
}

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

@ -54,19 +54,20 @@ export class LayerControl extends Control {
if (this.options.parentDiv) {
container = this._container = document.getElementById(this.options.parentDiv);
dom.addClass(container, className);
toggleable = false;
toggleable = false;
} else {
container = this._container = dom.createDom("div", { "class": className });
toggleable = true;
}
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 && toggleable == true) {
domEvent.on(container, 'mouseenter', this._expand, this);
@ -89,6 +90,8 @@ export class LayerControl extends Control {
this._updateLayerList();
if (toggleable == true) {
return container;
}
@ -102,7 +105,7 @@ export class LayerControl extends Control {
name: name,
overlay: overlay
};
layer.addListener('visibility-change', this._updateLayerList, this);
layer.addListener('visibility-change', this._updateLayerList, this);
}
_updateLayerList() {
@ -115,7 +118,7 @@ export class LayerControl extends Control {
let baseLayersPresent = false;
let overlaysPresent = false;
for (let i in this._layers) {
let obj = this._layers[i];
@ -127,7 +130,7 @@ export class LayerControl extends Control {
this._separator.style.display = overlaysPresent && baseLayersPresent ? '' : 'none';
}
_addLegendEntry (obj) {
_addLegendEntry(obj) {
var checked = obj.layer.visible;//this._map.hasLayer(obj.layer);
var container = obj.overlay ? this._overlaysList : this._baseLayersList;
//container.appendChild(legendEntryRow);
@ -135,13 +138,13 @@ export class LayerControl extends Control {
var legendEntryRow = dom.createDom("tr", { style: "display: row-table; height: 20px;" }, container);
//domStyle.set(legendEntryRow, 'display', rowVisibility);
//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);
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 lblDataCell = dom.createDom("td", {"style": "vertical-align: top;"}, 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);
@ -149,13 +152,17 @@ export class LayerControl extends Control {
domEvent.on(input, 'click', function () { this._onInputClick(util.stamp(obj.layer)); }, this);
dom.createDom("label", { for: util.stamp(obj.layer) }, chkDataCell);
dom.createDom("span", { innerHTML: " " + obj.name }, lblDataCell);
dom.createDom("span", { innerHTML: " " + obj.name + "&nbsp;" }, lblDataCell);
//legend entry label
// var _table = dom.createDom("table", { width: "95%", dir: "ltr" }, lblDataCell);
// var _tbody = dom.createDom("tbody", {}, _table);
// var _tr = dom.createDom("tr", {}, _tbody);
// var _td = dom.createDom("td", { innerHTML: obj.name, align: this.alignRight ? "right" : "left" }, _tr);
dom.createDom("i", { class: "fas fa-info-circle" }, lblDataCell);
@ -163,11 +170,11 @@ export class LayerControl extends Control {
}
_onInputClick (layerId) {
let inputs = this._layerContainer.getElementsByTagName('input');
_onInputClick(layerId) {
let inputs = this._layerContainer.getElementsByTagName('input');
this._handlingClick = true;
for (let i = 0; i < inputs.length; i++) {
for (let i = 0; i < inputs.length; i++) {
let input = inputs[i];
if (input.type == 'checkbox' && layerId === input.layerId) {
let obj = this._layers[input.layerId];

44
src/js/main.js
View File

@ -5,7 +5,6 @@ import { PerspectiveCamera } from 'three/src/cameras/PerspectiveCamera';
import { Scene } from 'three/src/scenes/Scene';
import { Vector3 } from 'three/src/math/Vector3';
import { GridLayer } from './layer/GridLayer';
// import { BoxLayer } from './layer/BoxLayer';
import { DemLayer } from './layer/DemLayer';
import { Map } from './core/Map';
import * as domEvent from './core/domEvent';
@ -21,8 +20,8 @@ import { MeshLambertMaterial } from 'three/src/materials/MeshLambertMaterial';
import * as util from './core/utilities';
import * as browser from './core/browser';
import * as domUtil from './core/domUtil';
import { MobileDialog } from "./controls/MobileDialog";
import { Picking } from './clip/Picking';
import Modal from './components/ShowModal';
import { Selection } from './clip/Selection';
import _ from "lodash";
@ -61,7 +60,9 @@ class Application {
this.navigation = document.getElementsByClassName('navigation')[0];
// this.addEventListeners();
this.dialog = new MobileDialog("Help", container, { klass: "fm_about" });
this.dialog = new Modal("Help", container, { klass: "fm_about" });
// this.dialog = new MobileDialog("Help", container, { klass: "fm_about" });
this.aboutIcon = document.querySelector('#menu-about-icon');
@ -181,21 +182,21 @@ class Application {
this.mapTitle = document.querySelector('#map-title');
this.mapTitle.innerHTML += map.title;
map.on('ready', () => {
this.selection.setUniforms();
this.animate();
this.selection.setUniforms();
this.animate();
}, this);
this.selection = new Selection(
// new Vector3(-7, -14, -14),
// new Vector3(14, 9, 3)
{ name: 'Slicing Box'},
{ name: 'Slicing Box' },
new Vector3(x.min, y.min, z.min),
new Vector3(x.max, y.max, z.max)
new Vector3(x.max, y.max, z.max)
);
this.map.addLayer(this.selection);
new Picking(size, center, this);
// let boxLayer = new BoxLayer({
// width: 10000, height: 10000, depth: 10000, name: 'center-box', color: 800080 , center: center
@ -259,7 +260,7 @@ class Application {
//slice on x and y axes:
// this.slicer = new SlicerControl({ parentDiv: 'slicer-control' }).addTo(this.map);
// this.capsScene.add(this.selection.boxMesh);
// this.scene.add(this.selection.displayMeshes);
// this.scene.add(this.selection.touchMeshes);
@ -418,7 +419,7 @@ class Application {
let chkGrid = document.getElementById("chkGrid");
domEvent.on(chkGrid, 'click', function (e) {
this.gridlayer.toggle();
}, app);
}, this);
}
@ -519,3 +520,26 @@ class Application {
let container = document.getElementById("webgl");
let app = new Application(container);
app.build();
// new Vue({
// el: '#app',
// components: { Modal },
// data() {
// return {
// isModalVisible: false,
// }
// },
// mounted() {
// let container = document.getElementById("webgl");
// let app = new Application(container);
// app.build();
// },
// methods: {
// showModal() {
// this.isModalVisible = true;
// },
// closeModal() {
// this.isModalVisible = false;
// },
// }
// });

19
webpack.config.js
View File

@ -4,6 +4,7 @@ const webpack = require('webpack'); //e.g. for iusing DefinePlugin
// const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const TerserPlugin = require('terser-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
// const { VueLoaderPlugin } = require('vue-loader');
/**
* flag Used to check if the environment is production or not
@ -26,6 +27,12 @@ module.exports = {
//filename: fileNamePrefix + '[name].js',
publicPath: '/dist/',
},
// resolve: {
// alias: {
// 'vue$': 'vue/dist/vue.esm.js'
// },
// extensions: ['*', '.js', '.vue', '.json']
// },
module: {
rules: [
{
@ -49,6 +56,10 @@ module.exports = {
// 'img-loader'
// ],
// },
// {
// test: /\.vue$/,
// loader: 'vue-loader'
// },
{
test: /\.js$/,
exclude: /(node_modules|bower_components)/,
@ -71,6 +82,12 @@ module.exports = {
// hmr: process.env.NODE_ENV === 'development',
// },
},
// {
// loader: "vue-style-loader",
// options: {
// sourceMap: true
// }
// },
// Translates CSS into CommonJS
{
loader: "css-loader",
@ -122,8 +139,8 @@ module.exports = {
},
plugins: [
// new VueLoaderPlugin(),
new webpack.DefinePlugin({ // Remove this plugin if you don't plan to define any global constants
ENVIRONMENT: JSON.stringify(process.env.NODE_ENV),
CONSTANT_VALUE: JSON.stringify(process.env.CONSTANT_VALUE),