decidim-decidim_geo 0.2.1

data/app/packs/src/decidim/geo/ui/createGeoScopeMenuItem.js

@@ -0,0 +1,8 @@
+const createGeoScopeMenuItem = ({ label, onClick }) => {
+  const menuItem = L.DomUtil.create("li", "decidimGeo__scopesDropdown__listItem");
+  menuItem.onclick = onClick;
+  menuItem.textContent += label;
+  return menuItem;
+};
+
+export default createGeoScopeMenuItem;

data/app/packs/src/decidim/geo/ui/createNodeMarker.js

@@ -0,0 +1,9 @@
+import { createCustomMarker } from ".";
+
+const createNodeMarker = (node) => {
+  if(!node.coordinates?.latitude || !node.coordinates?.longitude) return null;
+  const location = [node.coordinates.latitude, node.coordinates.longitude];
+  return createCustomMarker(location);
+};
+
+export default createNodeMarker;

data/app/packs/src/decidim/geo/ui/createNodeMenuItem.js

@@ -0,0 +1,13 @@
+import _ from "lodash";
+import { fallback, meetings } from "./DrawerMenuItem";
+
+const createNodeMenuItem = (node) => {
+  switch (node.type) {
+    case "Decidim::Meetings::Meeting":
+      return meetings(node);
+    default:
+      return fallback(node);
+  }
+};
+
+export default createNodeMenuItem;

data/app/packs/src/decidim/geo/ui/index.js

@@ -0,0 +1,8 @@
+export { default as initMap } from "./initMap.js";
+export { default as createCustomMarker } from "./createCustomMarker.js";
+export { default as createNodeMarker } from "./createNodeMarker.js";
+export { default as createGeoScopeLayer } from "./createGeoScopeLayer.js";
+export { default as createGeoScopeMenuItem } from "./createGeoScopeMenuItem.js";
+export { default as createNodeMenuItem } from "./createNodeMenuItem.js";
+export { default as createDrawerActions } from "./createDrawerActions.js";
+export { default as createDrawer } from "./createDrawer.js";

data/app/packs/src/decidim/geo/ui/initMap.js

@@ -0,0 +1,22 @@
+import configStore from "../models/configStore";
+const initMap = async () => {
+  const {
+    mapID,
+    map_config: { lat, lng, zoom, tile_layer }
+  } = configStore.getState();
+  const map = L.map(mapID, {
+    center: [lat, lng],
+    zoom,
+    scrollWheelZoom: false
+  });
+  map.zoomControl.setPosition("topright");
+
+  L.tileLayer(tile_layer, {
+    maxZoom: 19,
+    attribution:
+      '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
+  }).addTo(map);
+
+  return map;
+};
+export default initMap;

data/app/packs/src/decidim/geo/utils/index.js

@@ -0,0 +1,30 @@
+export { default as saveConfig } from "./saveConfig";
+export async function getDecidimData(query, params) {
+  const body = {
+    query,
+    ...params
+  };
+  var result = await window
+    .fetch("/api", {
+      method: "POST", 
+      headers: {
+        "Content-Type": "application/json"
+      },
+      body: JSON.stringify(body)
+    })
+    .then(async (response) => {
+      const res = await response.json();
+      if (res.errors) {
+        throw new Error(JSON.stringify(res.errors));
+      }
+      return res;
+    }).catch((e) => {
+      console.error(e);
+      return null;
+    });
+
+  if (result) {
+    return result;
+  }
+  return [];
+}

data/app/packs/src/decidim/geo/utils/saveConfig.js

@@ -0,0 +1,15 @@
+import configStore from "../models/configStore";
+export default function saveConfig() {
+  const mapElements = document.getElementsByClassName("js-decidimgeo");
+  if (mapElements.length < 1) {
+    console.warn("no map config for this page");
+    return undefined;
+  }
+  const mapElement = mapElements[0];
+  const configString = mapElement.getAttribute("data-config");
+  const i18nConfigString = mapElement.getAttribute("data-i18n");
+  const config = JSON.parse(configString);
+  const i18nConfig = JSON.parse(i18nConfigString);
+  const { setConfig } = configStore.getState();
+  return setConfig({ ...config, mapID: mapElement.id, i18n: i18nConfig });
+}

data/app/packs/stylesheets/decidim/geo/_geo.scss

@@ -0,0 +1,2 @@
+@import "stylesheets/decidim/geo/geo/decidim_geo_decidimGeo";
+@import "stylesheets/decidim/geo/geo/decidim_geo_override";

data/app/packs/stylesheets/decidim/geo/geo/_decidim_geo_decidimGeo.scss

@@ -0,0 +1,476 @@
+@mixin decidimGeo__customControl {
+  display: block;
+  background: #fff;
+  font-size: 16px;
+  line-height: 20px;
+  padding: 4px 8px 6px;
+  border-radius: 18px;
+  border: 1px solid grey;
+  color: grey;
+
+  label {
+    input {
+      vertical-align: middle;
+    }
+  }
+}
+
+@mixin decidimGeo__clickableText {
+  font-size: 13px;
+  line-height: 16px;
+  font-weight: bold;
+  color: var(--primary);
+  cursor: pointer;
+}
+
+@mixin decidimGeo__border {
+  border-radius: 4px;
+  overflow: auto;
+  box-shadow: 0px 2px 4px 0px #00000014;
+}
+
+@mixin decidimGeo__meetingDateItem {
+  text-align: center;
+  color: #726a70;
+  padding: 0.5em;
+  margin-right: -1px;
+  margin-top: -1px;
+  border-top: 1px solid #e8e8e8;
+}
+
+.decidimgeo__map {
+  @media (max-width: 640px) {
+    display: none;
+  }
+}
+
+.decidimGeo__customControl__parent {
+  @include decidimGeo__customControl;
+}
+
+.decidimGeo__customControl__child {
+  @include decidimGeo__customControl;
+  margin-left: 12px;
+}
+
+.decidimGeo__scopesDropdown,
+.decidimGeo__scopesDropdown.leaflet-control {
+  @include decidimGeo__border;
+  display: block;
+  width: 300px;
+  background: #fff;
+  position: absolute;
+  z-index: 9999;
+}
+
+.decidimGeo__scopesDropdown__heading {
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+}
+
+.decidimGeo__scopesDropdown__title {
+  @include decidimGeo__clickableText;
+  display: inline-block;
+  padding: 8px 32px 8px 16px;
+  margin: 0;
+  text-transform: uppercase;
+  letter-spacing: 0.2px;
+  position: relative;
+  overflow: hidden;
+  white-space: nowrap;
+
+  &:after {
+    display: inline-block;
+    content: "\25BE";
+    color: #0c0c0c;
+    transform: rotate(-180deg);
+    transition: 0.3s;
+    position: absolute;
+    right: 16px;
+    top: 7px;
+  }
+
+  &--button:after {
+    display: none;
+  }
+  &--closed {
+    &:after {
+      transform: rotate(0);
+    }
+  }
+  &--empty {
+    opacity: 0.6;
+  }
+}
+
+.decidimGeo__scopesDropdown__reset {
+  @include decidimGeo__clickableText;
+  padding: 8px 16px 8px 8px;
+  float: right;
+  text-transform: uppercase;
+  font-family: $header-font-family;
+  letter-spacing: 0.2px;
+
+  &.decidimGeo__scopesDropdown__reset--hidden {
+    display: none;
+  }
+}
+.decidimGeo__filterDropdown__container {
+  position: relative;
+}
+.decidimGeo__filterDropdown__dropdown {
+  width: 300px;
+  height: auto;
+  max-height: 400px;
+  border-top: #cccccc 1px solid;
+  overflow: auto;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  padding-bottom: 20px;
+
+  transition: 0.3s;
+
+  &--closed {
+    width: 300px;
+    height: 0;
+    overflow: hidden;
+    margin: 0;
+    padding: 0;
+    border-top: unset;
+  }
+}
+
+.decidimGeo__filterDropdown__dropdown--open {
+  display: block;
+}
+.decidimGeo__filterDropdown__counter {
+  border-radius: 50%;
+  float: right;
+  display: flex;
+  width: 20px;
+  height: 20px;
+  padding: 10px;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: 10px;
+  flex-shrink: 0;
+  background: rgba(var(--primary-rgb), 0.25);
+  &--hidden {
+    display: none;
+  }
+}
+.decidimGeo__filterDropdown__titleContainer {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding-right: 16px;
+  &--disabled {
+    opacity: 0.25;
+  }
+}
+.decidimGeo__filterDropdown__title {
+  @include decidimGeo__clickableText;
+  padding: 8px 10px 8px 8px;
+  float: right;
+  text-transform: uppercase;
+  font-family: $header-font-family;
+  letter-spacing: 0.2px;
+  margin-bottom: 0;
+  color: #3d393c;
+  &:not(.decidimGeo__filterDropdown__title):hover,
+  &.decidimGeo__filterDropdown__title--active {
+    color: var(--primary);
+  }
+}
+
+.decidimGeo__filterDropdown__list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  list-style: none;
+  margin: 0;
+  padding: 18px 8px;
+}
+.decidimGeo__filterDropdown__field {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.decidimGeo__filterDropdown__label {
+  @include decidimGeo__clickableText;
+  color: #1a181d;
+  padding: 8px 16px 8px 8px;
+  font-size: 14px;
+  text-wrap: nowrap;
+}
+
+.decidimGeo__filterDropdown__select,
+.decidimGeo__filterDropdown__select:focus {
+  margin-bottom: 0;
+  max-width: 100%;
+  border: 0;
+  text-align: right;
+  box-shadow: none;
+  color: #1a181d;
+}
+.decidimGeo__filterDropdown__resetBtn,
+.decidimGeo__filterDropdown__applyBtn {
+  @include decidimGeo__clickableText;
+  padding: 8px 16px;
+  letter-spacing: 0.2px;
+  color: #3d393c;
+  text-transform: uppercase;
+}
+.decidimGeo__filterDropdown__applyBtn {
+  color: var(--primary);
+  float: right;
+}
+
+.decidimGeo__scopesDropdown__list,
+.decidimGeo__drawer__list {
+  width: 300px;
+  height: auto;
+  max-height: 400px;
+  border-top: #cccccc 1px solid;
+  overflow: auto;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+
+  transition: 0.3s;
+
+  &--closed {
+    width: 300px;
+    height: 0;
+    overflow: hidden;
+    margin: 0;
+    padding: 0;
+  }
+  &--hidden {
+    display: none;
+  }
+}
+.decidimGeo__scopesDropdown__listItem {
+  @include decidimGeo__clickableText;
+  display: block;
+  margin: 8px;
+  padding-left: 16px;
+  padding-right: 16px;
+}
+.decidimGeo__drawer__list {
+  transform: translateY(31px);
+  padding: 4px 16px;
+  background: #f0f0f0;
+  box-shadow: 0px -1px 0px 0px #e0e0e0 inset;
+  border-radius: 0px 0px 4px 4px;
+  margin-top: -2px;
+
+  &:empty {
+    transform: translateY(0);
+  }
+}
+
+.decidimGeo__drawer__listItem {
+  @include decidimGeo__clickableText;
+  display: block;
+  margin: 6px 8px;
+  padding-left: 16px;
+  padding-right: 16px;
+}
+.decidimGeo__emptyDrawer__container {
+  text-align: center;
+}
+.decidimGeo__emptyDrawer__paragraph {
+  padding: 24px 0;
+  font-size: 17px;
+  font-weight: 400;
+  line-height: 21.37px;
+}
+.decidimGeo__emptyDrawer__button {
+  @include decidimGeo__clickableText;
+  display: inline-block;
+  margin: 0 8px;
+  margin-bottom: 24px;
+  padding-left: 16px;
+  padding-right: 16px;
+}
+.decidimGeo__drawer__listCardLoader {
+  content: "";
+  width: 100%;
+  padding: 0 12px;
+  background: #eee;
+}
+
+.decidimGeo__drawer__listCard {
+  @include decidimGeo__border;
+  display: block;
+  background: #ffffff;
+  width: 100%;
+  overflow: hidden;
+  margin: 12px 0;
+  cursor: pointer;
+
+  &:empty {
+    height: 50px;
+
+    background: #ffffff;
+    background: linear-gradient(110deg, #ffffff 8%, #ececec 18%, #ffffff 33%);
+    border-radius: 5px;
+    background-size: 200% 100%;
+    animation: 1.5s shine linear infinite;
+  }
+}
+.decidimGeo__drawer__listCardIcon {
+  padding-left: 2px;
+  max-height: 16px;
+  transform: translateY(-2px);
+  &--hidden {
+    display: none;
+  }
+}
+.decidimGeo__drawer__listCardImg {
+  display: inline-block;
+  vertical-align: bottom;
+  width: 69px;
+  height: 69px;
+  padding: 0;
+  object-fit: cover;
+  &.decidimGeo__drawer__listCardImg--large {
+    width: 100%;
+    height: 180px;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+  }
+}
+
+.decidimGeo__drawer__listCardInfo {
+  display: inline-block;
+  vertical-align: bottom;
+  max-height: 69px;
+  padding: 8px;
+  width: calc(100% - 69px);
+  &--image {
+    padding-top: calc(180px + 16px);
+  }
+  &--large {
+    max-height: none;
+    width: 100%;
+    position: relative;
+  }
+  &::after {
+    display: table;
+    content: "";
+    clear: both;
+    width: 100%;
+    height: 0;
+  }
+}
+
+.decidimGeo__drawer__listCardType {
+  color: #808080;
+  font-weight: bold;
+  font-size: 11px;
+  line-height: 13.83px;
+  text-transform: uppercase;
+  min-height: 16px;
+}
+
+.decidimGeo__drawer__listCardTitle {
+  color: var(--primary);
+  font-size: 17px;
+  font-weight: 400;
+  line-height: 21.37px;
+  max-width: 100%;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+.decidimGeo__drawer__listCardDate {
+  display: inline-flex;
+  justify-content: space-between;
+  gap: 6px;
+}
+.decidimGeo__drawer__listCardStartDateSep,
+.decidimGeo__drawer__listCardStartTime,
+.decidimGeo__drawer__listCardStartDate {
+  font-style: normal;
+  font-size: 13px;
+  letter-spacing: 0.05em;
+  color: #3d393c;
+  text-transform: uppercase;
+}
+.decidimGeo__drawer__listCardStartDate {
+  font-weight: 600;
+}
+.decidimGeo__drawer__listCardDescription {
+  color: #3d393c;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 17.6px;
+  max-width: 100%;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  &--large {
+    max-width: 100%;
+    overflow: hidden;
+    white-space: initial;
+    text-overflow: initial;
+  }
+  &--meetings {
+    margin-top: 8px;
+  }
+}
+a.decidimGeo__drawer__viewBtn {
+  @include decidimGeo__clickableText;
+  padding: 8px 16px;
+  letter-spacing: 0.2px;
+  color: #3d393c;
+  text-transform: uppercase;
+  text-decoration: none;
+  float: right;
+}
+.decidimGeo__scope__tooltip {
+  background-color: transparent !important;
+  border: transparent !important;
+  box-shadow: none !important;
+  font-weight: bold;
+}
+
+.decidimGeo__popup__container {
+  position: relative;
+  width: calc(100% + 44px);
+  left: -20px;
+}
+
+.decidimGeo__popup__content {
+  padding: 0 0.75rem;
+}
+
+.decidimGeo__paragraph__overflow {
+  width: 100%;
+  overflow: hidden;
+  text-wrap: nowrap;
+  text-overflow: ellipsis;
+}
+
+.leaflet-tooltip-top.decidimGeo__scope__tooltip::before {
+  border-top-color: transparent;
+}
+
+@keyframes shine {
+  to {
+    background-position-x: -200%;
+  }
+}
+
+.decidimGeo__marker {
+  filter: initial;
+  // filter: drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.35));
+}

data/app/packs/stylesheets/decidim/geo/geo/_decidim_geo_override.scss

@@ -0,0 +1,65 @@
+/* TODO: All these classes overrides may cause other parts of decidim's ui to break due to leaflet dependency.
+This module should therefore implement its own classes before being safely published, ideally by 
+implementing BEM (https://getbem.com/introduction/) and remove !important rules*/
+
+.leaflet-left > .leaflet-control-zoom {
+  display: none;
+}
+.leaflet-right > .leaflet-control-zoom {
+  border: 0;
+  margin-right: 0;
+}
+
+.leaflet-control-zoom-in,
+.leaflet-control-zoom-out {
+  box-sizing: content-box;
+  border: grey solid 1px;
+  border-bottom: grey solid 1px !important;
+  display: inline-block !important;
+  padding-inline: 2px;
+  padding-bottom: 4px !important;
+  border-radius: 2px;
+  margin-right: 10px;
+}
+.leaflet-container .leaflet-popup-tip {
+  border-color: transparent;
+}
+.leaflet-container a {
+  color: var(--primary) !important;
+  &:hover {
+    color: var(--primary);
+    opacity: 0.6;
+  }
+}
+
+.leaflet-top .leaflet-control-layers {
+  margin-top: 0;
+  padding-block: 0;
+}
+
+.leaflet-touch .leaflet-control-layers,
+.leaflet-touch .leaflet-bar {
+  border: 0 !important;
+}
+
+.leaflet-control-layers {
+  border: 0 !important;
+  background: transparent !important;
+}
+
+.leaflet-control-layers-selector {
+  margin-bottom: 0 !important;
+}
+
+.leaflet-control-layers-overlays > label {
+  display: block;
+  background: #fff;
+  margin-top: 6px;
+  margin-left: 20px;
+  font-size: 16px;
+  line-height: 20px;
+  padding: 4px 8px;
+  border-radius: 18px;
+  border: 1px solid grey;
+  color: grey;
+}

data/app/permissions/decidim/geo/admin/permissions.rb

@@ -0,0 +1,24 @@
+# frozen_string_literal: true
+
+module Decidim
+  module Geo
+    module Admin
+      class Permissions < Decidim::DefaultPermissions
+        def permissions
+          return permission_action if permission_action.scope != :admin
+
+          return permission_action unless user
+
+          return permission_action if user.read_attribute("admin").blank?
+
+          case permission_action.action
+          when :create, :new, :update
+            permission_action.allow!
+          end
+
+          permission_action
+        end
+      end
+    end
+  end
+end

data/app/permissions/decidim/geo/permissions.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+module Decidim
+  module Geo
+    class Permissions < Decidim::DefaultPermissions
+      def permissions
+        return permission_action unless user
+
+        return Decidim::Geo::Admin::Permissions.new(user, permission_action, context).permissions if permission_action.scope == :admin
+
+        permission_action
+      end
+    end
+  end
+end

data/app/uploaders/decidim/geo/shapefile_uploader.rb

@@ -0,0 +1,14 @@
+module Decidim
+  module Geo
+    class ShapefileUploader < ::Decidim::ApplicationUploader
+
+      def extension_allowlist
+        %w(zip)
+      end
+
+      def size_range
+        0..10.megabytes
+      end
+    end
+  end
+end