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

1
.babelrc
View File

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

21
index.html
View File

@ -78,9 +78,25 @@
</header> </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 class="canvas-area eight columns">
<div id="div-map"> <div id="div-map">
@ -135,6 +151,7 @@
<input type="checkbox" id="chkGrid" autocomplete="off" checked> <input type="checkbox" id="chkGrid" autocomplete="off" checked>
<span class="label-body">set visibility of coordinate grid</span> <span class="label-body">set visibility of coordinate grid</span>
</label> </label>
<i class="fas fa-info-circle" @click="showModal" style="font-size:24px"></i>
</div> </div>
</div> </div>

218
package-lock.json generated
View File

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

1
package.json
View File

@ -15,6 +15,7 @@
"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",
"@babel/plugin-proposal-decorators": "^7.13.5",
"@babel/plugin-transform-runtime": "^7.12.1", "@babel/plugin-transform-runtime": "^7.12.1",
"@babel/preset-env": "^7.12.7", "@babel/preset-env": "^7.12.7",
"babel-loader": "^8.2.1", "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;
}
}

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

@ -66,6 +66,7 @@ export class LayerControl extends Control {
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 && toggleable == true) { if (this.options.collapsed && toggleable == true) {
@ -89,6 +90,8 @@ export class LayerControl extends Control {
this._updateLayerList(); this._updateLayerList();
if (toggleable == true) { if (toggleable == true) {
return container; return container;
} }
@ -149,13 +152,17 @@ export class LayerControl extends Control {
domEvent.on(input, 'click', function () { this._onInputClick(util.stamp(obj.layer)); }, this); domEvent.on(input, 'click', function () { this._onInputClick(util.stamp(obj.layer)); }, this);
dom.createDom("label", { for: util.stamp(obj.layer) }, chkDataCell); 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 //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);
dom.createDom("i", { class: "fas fa-info-circle" }, lblDataCell);

32
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 { Scene } from 'three/src/scenes/Scene';
import { Vector3 } from 'three/src/math/Vector3'; import { Vector3 } from 'three/src/math/Vector3';
import { GridLayer } from './layer/GridLayer'; import { GridLayer } from './layer/GridLayer';
// import { BoxLayer } from './layer/BoxLayer';
import { DemLayer } from './layer/DemLayer'; import { DemLayer } from './layer/DemLayer';
import { Map } from './core/Map'; import { Map } from './core/Map';
import * as domEvent from './core/domEvent'; 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 util from './core/utilities';
import * as browser from './core/browser'; import * as browser from './core/browser';
import * as domUtil from './core/domUtil'; import * as domUtil from './core/domUtil';
import { MobileDialog } from "./controls/MobileDialog";
import { Picking } from './clip/Picking'; import { Picking } from './clip/Picking';
import Modal from './components/ShowModal';
import { Selection } from './clip/Selection'; import { Selection } from './clip/Selection';
import _ from "lodash"; import _ from "lodash";
@ -61,7 +60,9 @@ class Application {
this.navigation = document.getElementsByClassName('navigation')[0]; this.navigation = document.getElementsByClassName('navigation')[0];
// this.addEventListeners(); // 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'); this.aboutIcon = document.querySelector('#menu-about-icon');
@ -418,7 +419,7 @@ class Application {
let chkGrid = document.getElementById("chkGrid"); let chkGrid = document.getElementById("chkGrid");
domEvent.on(chkGrid, 'click', function (e) { domEvent.on(chkGrid, 'click', function (e) {
this.gridlayer.toggle(); this.gridlayer.toggle();
}, app); }, this);
} }
@ -519,3 +520,26 @@ class Application {
let container = document.getElementById("webgl"); let container = document.getElementById("webgl");
let app = new Application(container); let app = new Application(container);
app.build(); 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 UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const TerserPlugin = require('terser-webpack-plugin'); const TerserPlugin = require('terser-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin"); const MiniCssExtractPlugin = require("mini-css-extract-plugin");
// const { VueLoaderPlugin } = require('vue-loader');
/** /**
* flag Used to check if the environment is production or not * flag Used to check if the environment is production or not
@ -26,6 +27,12 @@ module.exports = {
//filename: fileNamePrefix + '[name].js', //filename: fileNamePrefix + '[name].js',
publicPath: '/dist/', publicPath: '/dist/',
}, },
// resolve: {
// alias: {
// 'vue$': 'vue/dist/vue.esm.js'
// },
// extensions: ['*', '.js', '.vue', '.json']
// },
module: { module: {
rules: [ rules: [
{ {
@ -49,6 +56,10 @@ module.exports = {
// 'img-loader' // 'img-loader'
// ], // ],
// }, // },
// {
// test: /\.vue$/,
// loader: 'vue-loader'
// },
{ {
test: /\.js$/, test: /\.js$/,
exclude: /(node_modules|bower_components)/, exclude: /(node_modules|bower_components)/,
@ -71,6 +82,12 @@ module.exports = {
// hmr: process.env.NODE_ENV === 'development', // hmr: process.env.NODE_ENV === 'development',
// }, // },
}, },
// {
// loader: "vue-style-loader",
// options: {
// sourceMap: true
// }
// },
// Translates CSS into CommonJS // Translates CSS into CommonJS
{ {
loader: "css-loader", loader: "css-loader",
@ -122,7 +139,7 @@ module.exports = {
}, },
plugins: [ plugins: [
// new VueLoaderPlugin(),
new webpack.DefinePlugin({ // Remove this plugin if you don't plan to define any global constants new webpack.DefinePlugin({ // Remove this plugin if you don't plan to define any global constants
ENVIRONMENT: JSON.stringify(process.env.NODE_ENV), ENVIRONMENT: JSON.stringify(process.env.NODE_ENV),