diff --git a/examples/algorithms.ts b/examples/algorithms.ts index de2bbeec..9a74a1e8 100644 --- a/examples/algorithms.ts +++ b/examples/algorithms.ts @@ -21,7 +21,7 @@ import { NoopAlgorithm, SuperClusterAlgorithm, } from "../src"; -import { LOADER_OPTIONS, sync } from "./config"; +import { getLoaderOptions, sync } from "./config"; import { Loader } from "@googlemaps/js-api-loader"; import trees from "./trees.json"; @@ -31,7 +31,7 @@ const mapOptions = { zoom: 10, }; -new Loader(LOADER_OPTIONS).load().then(() => { +new Loader(getLoaderOptions()).load().then(() => { const maps: google.maps.Map[] = []; const panels: [HTMLElement, AbstractAlgorithm, string][] = [ diff --git a/examples/config.ts b/examples/config.ts index 187ee24d..224a0cdf 100644 --- a/examples/config.ts +++ b/examples/config.ts @@ -18,11 +18,13 @@ import { LoaderOptions } from "@googlemaps/js-api-loader"; export const MAP_ID = "7b9a897acd0a63a4"; -export const LOADER_OPTIONS: LoaderOptions = { - apiKey: "AIzaSyDhRjl83cPVWeaEer-SnKIw7GTjBuqWxXI", +const DEFAULT_KEY = "AIzaSyDhRjl83cPVWeaEer-SnKIw7GTjBuqWxXI"; + +export const getLoaderOptions = (): LoaderOptions => ({ + apiKey: localStorage.getItem("gmaps-key") ?? DEFAULT_KEY, version: "weekly", libraries: [], -}; +}); // helper function to keep maps in sync export const sync = (...maps: google.maps.Map[]): void => { diff --git a/examples/defaults.ts b/examples/defaults.ts index 78dd8b18..8a916e1f 100644 --- a/examples/defaults.ts +++ b/examples/defaults.ts @@ -14,7 +14,7 @@ * limitations under the License. */ -import { LOADER_OPTIONS } from "./config"; +import { getLoaderOptions } from "./config"; import { Loader } from "@googlemaps/js-api-loader"; import { MarkerClusterer } from "../src"; import trees from "./trees.json"; @@ -24,7 +24,7 @@ const mapOptions = { zoom: 12, }; -new Loader(LOADER_OPTIONS).load().then(() => { +new Loader(getLoaderOptions()).load().then(() => { const element = document.getElementById("map"); const map = new google.maps.Map(element, mapOptions); diff --git a/examples/index.html b/examples/index.html new file mode 100644 index 00000000..85dae1ce --- /dev/null +++ b/examples/index.html @@ -0,0 +1,54 @@ + + + + + + + + +

Google Maps JavaScript MarkerClusterer

+ + + + + + diff --git a/examples/renderers.ts b/examples/renderers.ts index 849ef9c1..1e21a0de 100644 --- a/examples/renderers.ts +++ b/examples/renderers.ts @@ -21,7 +21,7 @@ import { MarkerClusterer, Renderer, } from "../src"; -import { LOADER_OPTIONS, sync } from "./config"; +import { getLoaderOptions, sync } from "./config"; import { Loader } from "@googlemaps/js-api-loader"; import { interpolateRgb } from "d3-interpolate"; @@ -65,7 +65,7 @@ const interpolatedRenderer = { }, }; -new Loader(LOADER_OPTIONS).load().then(() => { +new Loader(getLoaderOptions()).load().then(() => { const maps: google.maps.Map[] = []; const panels: [HTMLElement, Renderer, string][] = [ diff --git a/examples/updates.ts b/examples/updates.ts index a4774933..9ebc02ad 100644 --- a/examples/updates.ts +++ b/examples/updates.ts @@ -14,7 +14,7 @@ * limitations under the License. */ -import { LOADER_OPTIONS } from "./config"; +import { getLoaderOptions } from "./config"; import { Loader } from "@googlemaps/js-api-loader"; import { MarkerClusterer } from "../src"; import trees from "./trees.json"; @@ -24,7 +24,7 @@ const mapOptions = { zoom: 12, }; -new Loader(LOADER_OPTIONS).load().then(async () => { +new Loader(getLoaderOptions()).load().then(async () => { const element = document.getElementById("map"); const map = new google.maps.Map(element, mapOptions); diff --git a/package-lock.json b/package-lock.json index 1ce6fd3a..b0b6087b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -41,6 +41,8 @@ "jest": "^26.4.2", "prettier": "^2.1.1", "rollup": "^2.26.11", + "rollup-plugin-copy": "^3.4.0", + "rollup-plugin-serve": "^2.0.2", "rollup-plugin-terser": "^7.0.2", "selenium-webdriver": "^4.0.0-alpha.7", "ts-jest": "^26.3.0", @@ -2964,12 +2966,31 @@ "integrity": "sha512-LG4opVs2ANWZ1TJoKc937iMmNstM/d0ae1vNbnBvBhqCSezgVUOzcLCqbI5elV8Vy6WKwKjaqR+zO9VKirBBCA==", "dev": true }, + "node_modules/@types/fs-extra": { + "version": "8.1.2", + "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-8.1.2.tgz", + "integrity": "sha512-SvSrYXfWSc7R4eqnOzbQF4TZmfpNSM9FrSWLU3EUnWBuyZqNBOrv1B1JA3byUDPUl9z4Ab3jeZG2eDdySlgNMg==", + "dev": true, + "dependencies": { + "@types/node": "*" + } + }, "node_modules/@types/geojson": { "version": "7946.0.10", "resolved": "https://registry.npmjs.org/@types/geojson/-/geojson-7946.0.10.tgz", "integrity": "sha512-Nmh0K3iWQJzniTuPRcJn5hxXkfB1T1pgB89SBig5PlJQU5yocazeu4jATJlaA0GYFKWMqDdvYemoSnF2pXgLVA==", "dev": true }, + "node_modules/@types/glob": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/@types/glob/-/glob-7.2.0.tgz", + "integrity": "sha512-ZUxbzKl0IfJILTS6t7ip5fQQM/J3TJYubDm3nMbgubNNYS62eXeUpoLUC8/7fJNiFYHTrGPQn7hspDUzIHX3UA==", + "dev": true, + "dependencies": { + "@types/minimatch": "*", + "@types/node": "*" + } + }, "node_modules/@types/google.maps": { "version": "3.53.1", "resolved": "https://registry.npmjs.org/@types/google.maps/-/google.maps-3.53.1.tgz", @@ -3025,6 +3046,12 @@ "integrity": "sha512-wOuvG1SN4Us4rez+tylwwwCV1psiNVOkJeM3AUWUNWg/jDQY2+HE/444y5gc+jBmRqASOm2Oeh5c1axHobwRKQ==", "dev": true }, + "node_modules/@types/minimatch": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-5.1.2.tgz", + "integrity": "sha512-K0VQKziLUWkVKiRVrx4a40iPaxTUefQmjtkQofBkYRcoaaL/8rhwDWww9qWbrgicNOgnpIsMxyNIUM4+n6dUIA==", + "dev": true + }, "node_modules/@types/node": { "version": "20.2.1", "resolved": "https://registry.npmjs.org/@types/node/-/node-20.2.1.tgz", @@ -4503,6 +4530,12 @@ "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==", "dev": true }, + "node_modules/colorette": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.4.0.tgz", + "integrity": "sha512-Y2oEozpomLn7Q3HFP7dpww7AtMJplbM9lGZP6RDfHqmbeRjiwRg4n6VM6j4KLmRke85uWEI7JqF17f3pqdRA0g==", + "dev": true + }, "node_modules/combined-stream": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz", @@ -6157,6 +6190,29 @@ "integrity": "sha512-y6OAwoSIf7FyjMIv94u+b5rdheZEjzR63GTyZJm5qh4Bi+2YgwLCcI/fPFZkL5PSixOt6ZNKm+w+Hfp/Bciwow==", "dev": true }, + "node_modules/fs-extra": { + "version": "8.1.0", + "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-8.1.0.tgz", + "integrity": "sha512-yhlQgA6mnOJUKOsRUFsgJdQCvkKhcz8tlZG5HBQfReYZy46OwLcY+Zia0mtdHsOo9y/hP+CxMN0TU9QxoOtG4g==", + "dev": true, + "dependencies": { + "graceful-fs": "^4.2.0", + "jsonfile": "^4.0.0", + "universalify": "^0.1.0" + }, + "engines": { + "node": ">=6 <7 || >=8" + } + }, + "node_modules/fs-extra/node_modules/universalify": { + "version": "0.1.2", + "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz", + "integrity": "sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==", + "dev": true, + "engines": { + "node": ">= 4.0.0" + } + }, "node_modules/fs.realpath": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", @@ -9271,6 +9327,15 @@ "integrity": "sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w==", "dev": true }, + "node_modules/jsonfile": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz", + "integrity": "sha512-m6F1R3z8jjlf2imQHS2Qez5sjKWQzbuuhuJ/FKYFRZvPE3PuHcSMVZzfsLhGVOkfd20obL5SWEBew5ShlquNxg==", + "dev": true, + "optionalDependencies": { + "graceful-fs": "^4.1.6" + } + }, "node_modules/jszip": { "version": "3.10.1", "resolved": "https://registry.npmjs.org/jszip/-/jszip-3.10.1.tgz", @@ -9516,6 +9581,18 @@ "node": ">=8.6" } }, + "node_modules/mime": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/mime/-/mime-3.0.0.tgz", + "integrity": "sha512-jSCU7/VB1loIWBZe14aEYHU/+1UMEHoaO7qxCOVJOw9GgH72VAWppxNcjU+x9a2k3GSIBXNKxXQFqRvvZ7vr3A==", + "dev": true, + "bin": { + "mime": "cli.js" + }, + "engines": { + "node": ">=10.0.0" + } + }, "node_modules/mime-db": { "version": "1.52.0", "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz", @@ -9899,6 +9976,15 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/opener": { + "version": "1.5.2", + "resolved": "https://registry.npmjs.org/opener/-/opener-1.5.2.tgz", + "integrity": "sha512-ur5UIdyw5Y7yEj9wLzhqXiy6GZ3Mwx0yGI+5sMn2r0N0v3cKJvUmFH5yPP+WXh9e0xfyzyJX95D8l088DNFj7A==", + "dev": true, + "bin": { + "opener": "bin/opener-bin.js" + } + }, "node_modules/optionator": { "version": "0.9.1", "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.1.tgz", @@ -10618,6 +10704,102 @@ "fsevents": "~2.3.2" } }, + "node_modules/rollup-plugin-copy": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/rollup-plugin-copy/-/rollup-plugin-copy-3.4.0.tgz", + "integrity": "sha512-rGUmYYsYsceRJRqLVlE9FivJMxJ7X6jDlP79fmFkL8sJs7VVMSVyA2yfyL+PGyO/vJs4A87hwhgVfz61njI+uQ==", + "dev": true, + "dependencies": { + "@types/fs-extra": "^8.0.1", + "colorette": "^1.1.0", + "fs-extra": "^8.1.0", + "globby": "10.0.1", + "is-plain-object": "^3.0.0" + }, + "engines": { + "node": ">=8.3" + } + }, + "node_modules/rollup-plugin-copy/node_modules/brace-expansion": { + "version": "1.1.11", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", + "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", + "dev": true, + "dependencies": { + "balanced-match": "^1.0.0", + "concat-map": "0.0.1" + } + }, + "node_modules/rollup-plugin-copy/node_modules/glob": { + "version": "7.2.3", + "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz", + "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==", + "dev": true, + "dependencies": { + "fs.realpath": "^1.0.0", + "inflight": "^1.0.4", + "inherits": "2", + "minimatch": "^3.1.1", + "once": "^1.3.0", + "path-is-absolute": "^1.0.0" + }, + "engines": { + "node": "*" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/rollup-plugin-copy/node_modules/globby": { + "version": "10.0.1", + "resolved": "https://registry.npmjs.org/globby/-/globby-10.0.1.tgz", + "integrity": "sha512-sSs4inE1FB2YQiymcmTv6NWENryABjUNPeWhOvmn4SjtKybglsyPZxFB3U1/+L1bYi0rNZDqCLlHyLYDl1Pq5A==", + "dev": true, + "dependencies": { + "@types/glob": "^7.1.1", + "array-union": "^2.1.0", + "dir-glob": "^3.0.1", + "fast-glob": "^3.0.3", + "glob": "^7.1.3", + "ignore": "^5.1.1", + "merge2": "^1.2.3", + "slash": "^3.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/rollup-plugin-copy/node_modules/is-plain-object": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-3.0.1.tgz", + "integrity": "sha512-Xnpx182SBMrr/aBik8y+GuR4U1L9FqMSojwDQwPMmxyC6bvEqly9UBCxhauBF5vNh2gwWJNX6oDV7O+OM4z34g==", + "dev": true, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/rollup-plugin-copy/node_modules/minimatch": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz", + "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==", + "dev": true, + "dependencies": { + "brace-expansion": "^1.1.7" + }, + "engines": { + "node": "*" + } + }, + "node_modules/rollup-plugin-serve": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/rollup-plugin-serve/-/rollup-plugin-serve-2.0.2.tgz", + "integrity": "sha512-ALqyTbPhlf7FZ5RzlbDvMYvbKuCHWginJkTo6dMsbgji/a78IbsXox+pC83HENdkTRz8OXrTj+aShp3+3ratpg==", + "dev": true, + "dependencies": { + "mime": ">=2.4.6", + "opener": "1" + } + }, "node_modules/rollup-plugin-terser": { "version": "7.0.2", "resolved": "https://registry.npmjs.org/rollup-plugin-terser/-/rollup-plugin-terser-7.0.2.tgz", diff --git a/package.json b/package.json index c1c04b4f..728841f6 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,7 @@ "scripts": { "docs": "typedoc src/index.ts && cp -r dist docs/dist && npm run examples && cp -r public docs/public", "examples": "rollup -c rollup.config.examples.js", + "dev": "rollup -c rollup.config.examples.js --watch", "format": "eslint . --fix", "lint": "eslint .", "prepare": "rm -rf dist && rollup -c", @@ -68,6 +69,8 @@ "jest": "^26.4.2", "prettier": "^2.1.1", "rollup": "^2.26.11", + "rollup-plugin-copy": "^3.4.0", + "rollup-plugin-serve": "^2.0.2", "rollup-plugin-terser": "^7.0.2", "selenium-webdriver": "^4.0.0-alpha.7", "ts-jest": "^26.3.0", diff --git a/rollup.config.examples.js b/rollup.config.examples.js index e86e1b0b..ffe41cb4 100644 --- a/rollup.config.examples.js +++ b/rollup.config.examples.js @@ -21,11 +21,15 @@ import jsonNodeResolve from "@rollup/plugin-json"; import { nodeResolve } from "@rollup/plugin-node-resolve"; import path from "path"; import typescript from "@rollup/plugin-typescript"; +import serve from "rollup-plugin-serve"; +import copy from "rollup-plugin-copy"; const typescriptOptions = { tsconfig: "tsconfig.examples.json", }; +const isWatchMode = process.argv.includes("--watch"); + const examples = fs .readdirSync(path.join(__dirname, "examples")) .filter((f) => f.endsWith(".ts") && f !== "config.ts") @@ -35,13 +39,24 @@ const getTemplate = (name) => { const templatePath = path.join(__dirname, "examples", `${name}.html`); return fs.readFileSync(templatePath, "utf-8"); }; -export default examples.map((name) => ({ + +export default examples.map((name, index) => ({ input: `examples/${name}.ts`, plugins: [ typescript(typescriptOptions), commonjs(), nodeResolve(), jsonNodeResolve(), + copy({ + targets: [{ src: "examples/index.html", dest: "public/" }], + }), + isWatchMode && + index == 0 && + serve({ + contentBase: "public", + port: 8080, + verbose: true, + }), ], output: { dir: `public/${name}`,