diff options
Diffstat (limited to 'app/javascript/controllers')
-rw-r--r-- | app/javascript/controllers/map_controller.js | 49 | ||||
-rw-r--r-- | app/javascript/controllers/taxonomy_controller.js | 56 |
2 files changed, 105 insertions, 0 deletions
diff --git a/app/javascript/controllers/map_controller.js b/app/javascript/controllers/map_controller.js new file mode 100644 index 0000000..5363e5e --- /dev/null +++ b/app/javascript/controllers/map_controller.js @@ -0,0 +1,49 @@ +// SPDX-FileCopyrightText: 2020 IN COMMON Collective <collective@incommon.cc> +// +// SPDX-License-Identifier: AGPL-3.0-or-later + +// Visit The Stimulus Handbook for more details +// https://stimulusjs.org/handbook/introduction +// + +import { Controller } from "stimulus" +import L from "leaflet" +import "leaflet/dist/leaflet.css" + +export default class extends Controller { + static targets = [ "container" ] + + initialize() { + console.log("Map controller initialized.") + } + + connect() { + this.map = L.map(this.containerTarget, { + zoomDelta: 0.5, + zoomSnap: 0.5, + }).setView(this._coordinates(), this._zoom()); + + L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', { + attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery <a href="https://www.mapbox.com/">Mapbox</a>', + maxZoom: 18, + id: 'mapbox/streets-v11', + tileSize: 512, + zoomOffset: -1, + accessToken: 'pk.eyJ1IjoibmVtYWVsIiwiYSI6ImNrZzBrYjBudTB3bnMyenFmNWtrN3h3bmMifQ.Rkeyhm-9iIQOV7NAMA5LaA' + }).addTo(this.map); + } + + disconnect() { + this.map.remove(); + console.log('Map controller disconnected.') + } + + _coordinates() { + return [this.data.get('latitude'), this.data.get('longitude')]; + } + + _zoom() { + return this.data.get('zoom'); + } + +} diff --git a/app/javascript/controllers/taxonomy_controller.js b/app/javascript/controllers/taxonomy_controller.js new file mode 100644 index 0000000..16d57fa --- /dev/null +++ b/app/javascript/controllers/taxonomy_controller.js @@ -0,0 +1,56 @@ +// SPDX-FileCopyrightText: 2020 IN COMMON Collective <collective@incommon.cc> +// +// SPDX-License-Identifier: AGPL-3.0-or-later + +// Visit The Stimulus Handbook for more details +// https://stimulusjs.org/handbook/introduction +// + +import { Controller } from "stimulus" + +export default class extends Controller { + static targets = [ "category", "deploy", "filter", "section", "toggle" ] + + initialize() { + console.log("Taxonomy controller initialized.") + } + + connect() { + console.log("Taxonomy controller connected.") + + if (this.hasFilterTarget) { + let url = `/taxonomies/${this.data.get('uuid')}/filter.js` + console.log(`loading url = ${url}`) + fetch(url, { + headers: { accept: 'application/json'} + }) + .then(response => response.text()) + .then(html => this.filterTarget.innerHTML = html) + } else { + console.log("Taxonomy filter is missing") + } + } + + deploy() { + console.log(`deploying taxonomy ${this.data.get('uuid')}`); + fetch(`/taxonomies/${this.data.get('uuid')}.js`) + .then(response => response.text()) + .then(html => this.deployTarget.innerHTML = html); + } + + toggle() { + var cssClass = 'on'; + this.toggleTarget.classList.toggle(cssClass) + this.filterTarget.parentNode.classList.toggle(cssClass) + } + + category(event) { + let catId = event.target.dataset.taxonomyCategoryId + event.target.classList.toggle('active') + } + + section(event) { + let catId = event.target.dataset.taxonomySectionId + event.target.classList.toggle('active') + } +} |