Fix/interactive map 0.26

README.md

@@ -21,7 +21,7 @@ And then execute:
 bundle
 bundle exec rake decidim_homepage_interactive_map:install:migrations
 bundle exec rake db:migrate
-bundle exec rake decidim_homepage_interactive_map:initialize
+bundle exec rake decidim_homepage_interactive_map:webpacker:install
 ```
 
 ## Contributing

app/cells/decidim/homepage_interactive_map/content_blocks/interactive_map/show.erb

@@ -3,25 +3,9 @@
     <section class="extended home-section" id="homepage_map">
       <div class="wrapper-home">
         <%= interactive_map_for(assemblies_data_for_map(@geolocalized_assemblies)) do %>
-          <template id="marker-popup-interactive_map">
-            <div class="map-info__content homepage_interactive_map">
-              <h3>${title}</h3>
-              <div id="bodyContent">
-                <div class="card__datetime">
-                  <div class="card__datetime__date">
-                    ${start_date} - ${end_date}
-                  </div>
-                </div>
-                <div class="map-info__button">
-                  <a href="${link}" class="button button--sc">
-                    <%= t("decidim.components.homepage_interactive_map.map.view_participatory_processes") %>
-                  </a>
-                </div>
-              </div>
-            </div>
-          </template>
-          <%= stylesheet_link_tag "decidim/map" %>
-          <%= stylesheet_link_tag "decidim/homepage_interactive_map/map" %>
+          <input type="hidden" value="<%= t("decidim.components.homepage_interactive_map.map.view_participatory_processes") %>" id="view-participatory-process">
+          <%= stylesheet_pack_tag "decidim_map" %>
+          <%= stylesheet_pack_tag "decidim_homepage_interactive_map_css" %>
         <% end %>
       </div>
     </section>

app/packs/entrypoints/decidim_homepage_interactive_map.scss

@@ -0,0 +1 @@
+@import "stylesheets/decidim/homepage_interactive_map/map";

app/packs/src/decidim/homepage_interactive_map/interactive_map.js

@@ -23,12 +23,10 @@ L.DivIcon.SVGIcon.DecidimIcon = L.DivIcon.SVGIcon.extend({
 });
 
 (() => {
-
   $(document).ready(() => {
     const here_api_key = $("#interactive_map").data("here-api-key");
     const geoJson = $("#interactive_map").data("geojson-data");
-    const popupInteractiveTemplateId = "marker-popup-interactive_map";
-    $.template(popupInteractiveTemplateId, $(`#${popupInteractiveTemplateId}`).html());
+    const $viewParticipatoryProcess = $("#view-participatory-process");
 
     // Used to prevent click event when double click navigating
     const clickDelay = 500;
@@ -115,6 +113,27 @@ L.DivIcon.SVGIcon.DecidimIcon = L.DivIcon.SVGIcon.extend({
       return (delta + 2) * 2;
     }
 
+    function tmpl(participatoryProcess, linkTxt) {
+      return `
+            <div class="map-info__content homepage_interactive_map">
+              <h3>${participatoryProcess.title}</h3>
+              <div id="bodyContent">
+                <div class="card__datetime">
+                  <div class="card__datetime__date">
+                    ${participatoryProcess.start_date} - ${participatoryProcess.end_date}
+                  </div>
+                </div>
+                <div class="map-info__button">
+                  <a href="${participatoryProcess.link}" class="button button--sc">
+                    ${linkTxt}
+                  </a>
+                </div>
+              </div>
+            </div>
+      `
+    }
+
+
     L.tileLayer.here({
       apiKey: here_api_key,
       scheme: "normal.day.grey"
@@ -251,7 +270,8 @@ L.DivIcon.SVGIcon.DecidimIcon = L.DivIcon.SVGIcon.extend({
         );
 
         let node = document.createElement("div");
-        $.tmpl(popupInteractiveTemplateId, participatory_process).appendTo(node);
+        $(node).html((tmpl(participatory_process, $viewParticipatoryProcess.val())));
+
         marker.bindPopup(node, {
           maxwidth: popupMaxwidth(),
           minWidth: popupMinwidth(),

config/assets.rb

@@ -19,10 +19,11 @@
 # SCSS files within the entrypoints, they become available for inclusion using
 # `stylesheet_pack_tag`.
 Decidim::Webpacker.register_entrypoints(
-  decidim_homepage_interactive_map: "#{base_path}/app/packs/entrypoints/decidim_homepage_interactive_map.js"
+  decidim_homepage_interactive_map: "#{base_path}/app/packs/entrypoints/decidim_homepage_interactive_map.js",
+  decidim_homepage_interactive_map_css: "#{base_path}/app/packs/entrypoints/decidim_homepage_interactive_map.scss"
 )
 
 # If you want to import some extra SCSS files in the Decidim main SCSS file
 # without adding any extra stylesheet inclusion tags, you can use the following
 # method to register the stylesheet import for the main application.
-Decidim::Webpacker.register_stylesheet_import("stylesheets/decidim/homepage_interactive_map/map.scss")
+# Decidim::Webpacker.register_stylesheet_import("stylesheets/decidim/homepage_interactive_map/map.scss")

decidim-homepage_interactive_map.gemspec

@@ -16,7 +16,7 @@ Gem::Specification.new do |s|
   s.summary = "A decidim homepage_interactive_map module"
   s.description = "Displays an interactive map on homepage."
 
-  s.files = Dir["{app,config,lib,vendor}/**/*", "LICENSE-AGPLv3.txt", "Rakefile", "README.md"]
+  s.files = Dir["{app,config,lib,vendor}/**/*", "LICENSE-AGPLv3.txt", "Rakefile", "README.md", "package.json"]
 
   s.add_dependency "decidim-admin", Decidim::HomepageInteractiveMap::COMPAT_DECIDIM_VERSION
   s.add_dependency "decidim-core", Decidim::HomepageInteractiveMap::COMPAT_DECIDIM_VERSION

lib/tasks/webpacker_tasks.rake

@@ -0,0 +1,61 @@
+# frozen_string_literal: true
+
+require "decidim/gem_manager"
+
+# Copied from : https://github.com/Platoniq/decidim-module-decidim_awesome/blob/main/lib/tasks/decidim_awesome_webpacker_tasks.rake
+
+namespace :decidim_homepage_interactive_map do
+  namespace :webpacker do
+    desc "Installs module's webpacker files in Rails instance application"
+    task install: :environment do
+      raise "Decidim gem is not installed" if decidim_path.nil?
+
+      install_npm
+    end
+
+    desc "Adds JS dependencies in package.json"
+    task upgrade: :environment do
+      raise "Decidim gem is not installed" if decidim_path.nil?
+
+      install_npm
+    end
+
+    def install_npm
+      npm_dependencies.each do |type, packages|
+        puts "install NPM packages. You can also do this manually with this command:"
+        puts "npm i --save-#{type} #{packages.join(" ")}"
+        system! "npm i --save-#{type} #{packages.join(" ")}"
+      end
+    end
+
+    def npm_dependencies
+      @npm_dependencies ||= begin
+        package_json = JSON.parse(File.read(module_path.join("package.json")))
+
+        {
+          prod: package_json["dependencies"].map { |package, version| "#{package}@#{version}" }
+        }.freeze
+      end
+    end
+
+    def module_path
+      @module_path ||= Pathname.new(module_gemspec.full_gem_path) if Gem.loaded_specs.has_key?(gem_name)
+    end
+
+    def module_gemspec
+      @module_gemspec ||= Gem.loaded_specs[gem_name]
+    end
+
+    def rails_app_path
+      @rails_app_path ||= Rails.root
+    end
+
+    def system!(command)
+      system("cd #{rails_app_path} && #{command}") || abort("\n== Command #{command} failed ==")
+    end
+
+    def gem_name
+      "decidim-homepage_interactive_map"
+    end
+  end
+end