@eeacms/volto-eea-map 0.1.1

package/src/components/Blocks/EEAMap/components/widgets/panelsSchema.js

@@ -0,0 +1,190 @@
+import { base_layers } from '../../constants';
+
+const BaseLayerSchema = {
+  title: 'Base Layer',
+  fieldsets: [
+    {
+      id: 'base',
+      title: 'Base Layer',
+      fields: ['base_layer'],
+    },
+  ],
+  properties: {
+    base_layer: {
+      title: 'Base Layer',
+      choices: base_layers,
+    },
+  },
+  required: [],
+};
+
+const LayerSchema = {
+  title: 'Layer',
+  fieldsets: [
+    {
+      id: 'default',
+      title: 'Layer',
+      fields: ['map_layer'],
+    },
+  ],
+  properties: {
+    map_layer: {
+      title: 'Map layer configuration',
+      widget: 'map_layers_widget',
+    },
+  },
+  required: [],
+};
+
+const MapLayersSchema = {
+  title: 'Map Layers',
+  fieldsets: [
+    {
+      id: 'default',
+      title: 'Map Data',
+      fields: ['map_layers'],
+    },
+  ],
+  properties: {
+    map_layers: {
+      title: 'Map Layers',
+      description: 'Add/Edit Map Layers',
+      widget: 'object_list',
+      schema: LayerSchema,
+    },
+  },
+  required: [],
+};
+const PrintSchema = {
+  title: 'Print',
+  fieldsets: [
+    {
+      id: 'default',
+      title: 'Print',
+      fields: ['show_print', 'position'],
+    },
+  ],
+  properties: {
+    show_print: {
+      title: 'Show print',
+      type: 'boolean',
+    },
+    position: {
+      title: 'Print position',
+      choices: ['bottom-right', 'bottom-left', 'top-right', 'top-left'].map(
+        (n) => {
+          return [n, n];
+        },
+      ),
+    },
+  },
+  required: [],
+};
+
+const ZoomSchema = {
+  title: 'Zoom',
+  fieldsets: [
+    {
+      id: 'default',
+      title: 'Zoom',
+      fields: ['show_zoom', 'position', 'zoom_level', 'long', 'lat'],
+    },
+  ],
+  properties: {
+    show_zoom: {
+      title: 'Show zoom',
+      type: 'boolean',
+    },
+    position: {
+      title: 'Zoom position',
+      choices: ['bottom-right', 'bottom-left', 'top-right', 'top-left'].map(
+        (n) => {
+          return [n, n];
+        },
+      ),
+    },
+    zoom_level: {
+      title: 'Zoom level',
+      type: 'number',
+    },
+    long: {
+      title: 'Longitude',
+      type: 'number',
+    },
+    lat: {
+      title: 'Latitude',
+      type: 'number',
+    },
+  },
+  required: [],
+};
+
+const GeneralSchema = {
+  title: 'General',
+  fieldsets: [
+    {
+      id: 'default',
+      title: 'General',
+      fields: ['show_sources', 'show_legend', 'show_download', 'show_viewer'],
+    },
+  ],
+  properties: {
+    show_sources: {
+      title: 'Show sources',
+      type: 'boolean',
+    },
+    show_legend: {
+      title: 'Show legend',
+      type: 'boolean',
+    },
+    show_download: {
+      title: 'Show download',
+      type: 'boolean',
+    },
+    show_viewer: {
+      title: 'Show web viewer',
+      type: 'boolean',
+    },
+  },
+  required: [],
+};
+
+export const panelsSchema = {
+  title: 'Map Editor',
+  fieldsets: [
+    {
+      id: 'default',
+      title: 'Map Editor Sections',
+      fields: ['map_data'],
+    },
+  ],
+  properties: {
+    map_data: {
+      title: 'Panels',
+      widget: 'object_types_widget',
+      schemas: [
+        {
+          id: 'general',
+          schema: GeneralSchema,
+        },
+        {
+          id: 'base',
+          schema: BaseLayerSchema,
+        },
+        {
+          id: 'layers',
+          schema: MapLayersSchema,
+        },
+        {
+          id: 'print',
+          schema: PrintSchema,
+        },
+        {
+          id: 'zoom',
+          schema: ZoomSchema,
+        },
+      ],
+    },
+  },
+  required: [],
+};

package/src/components/Blocks/EEAMap/constants.js

@@ -0,0 +1,29 @@
+const positions = ['bottom-right', 'bottom-left', 'top-right', 'top-left'].map(
+  (n) => {
+    return { key: n, value: n, text: n };
+  },
+);
+
+const base_layers = [
+  'dark-gray',
+  'dark-gray-vector',
+  'gray',
+  'gray-vector',
+  'hybrid',
+  'national-geographic',
+  'oceans',
+  'osm',
+  'satellite',
+  'streets',
+  'streets-navigation-vector',
+  'streets-night-vector',
+  'streets-relief-vector',
+  'streets-vector',
+  'terrain',
+  'topo',
+  'topo-vector',
+].map((n) => {
+  return [n, n];
+});
+
+export { positions, base_layers };

package/src/components/Blocks/EEAMap/styles/map.css

@@ -0,0 +1,22 @@
+.map-edit-container {
+  display: flex;
+}
+
+.map-modal-trigger-button {
+  margin-bottom: 10px !important;
+}
+
+#map-editor-modal {
+  top: auto;
+  left: auto !important;
+  width: 95% !important;
+}
+
+#map-widget-toggle {
+  color: blue !important;
+}
+
+.map-text-view {
+  display: flex;
+  padding: 1rem 0;
+}

package/src/components/Blocks/EEAMap/utils.js

@@ -0,0 +1,17 @@
+/* eslint-disable no-throw-literal */
+import { getBaseUrl } from '@plone/volto/helpers';
+
+const fetchArcgisData = async (url) => {
+  const res = await fetch(`${getBaseUrl('')}/cors-proxy/${url}?f=json`);
+  if (res.status !== 200) {
+    const error = await res.json();
+    throw { message: error.message, status: error.cod };
+  }
+  const data = await res.json();
+  if (data.error && data.error.code === 400) {
+    throw { message: data.error.message.message, status: data.status };
+  }
+  return data;
+};
+
+export { fetchArcgisData };

package/src/components/index.js

@@ -0,0 +1,4 @@
+import EEAMapView from './Blocks/EEAMap/View';
+import EEAMapEdit from './Blocks/EEAMap/Edit';
+
+export { EEAMapEdit, EEAMapView };

package/src/index.js

@@ -0,0 +1,41 @@
+import { EEAMapEdit, EEAMapView } from '@eeacms/volto-eea-map/components';
+import world from '@plone/volto/icons/world.svg';
+import LayerSelectWidget from './components/Blocks/EEAMap/components/widgets/LayerSelectWidget';
+import MapEditorWidget from './components/Blocks/EEAMap/components/widgets/MapEditorWidget';
+import ObjectTypesWidget from './components/Blocks/EEAMap/components/widgets/ObjectTypesWidget';
+
+export default (config) => {
+  config.blocks.blocksConfig.eea_map_block = {
+    id: 'eea_map_block', // The name (id) of the block
+    title: 'EEA Map', // The display name of the block
+    icon: world, // The icon used in the block chooser
+    group: 'common', // The group (blocks can be grouped, displayed in the chooser)
+    view: EEAMapView, // The view mode component
+    edit: EEAMapEdit, // The edit mode component
+    sidebarTab: 1, // The sidebar tab you want to be selected when selecting the block
+    security: {
+      addPermission: [], // Future proof (not implemented yet) add user permission role(s)
+      view: [], // Future proof (not implemented yet) view user role(s)
+    },
+    variations: [
+      {
+        id: 'default',
+        title: 'EEA Map (default)',
+        isDefault: true,
+        view: EEAMapView,
+      },
+      {
+        id: 'extra',
+        title: 'Extra variation (expand if needed)',
+        isDefault: true,
+        view: EEAMapView,
+      },
+    ],
+  };
+
+  config.widgets.widget.map_edit_widget = MapEditorWidget;
+  config.widgets.widget.map_layers_widget = LayerSelectWidget;
+  config.widgets.widget.object_types_widget = ObjectTypesWidget;
+
+  return config;
+};