decidim-decidim_awesome 0.7.2 → 0.8.0

data/app/packs/src/decidim/decidim_awesome/forms/custom_fields_renderer.js

@@ -0,0 +1,207 @@
+require("formBuilder/dist/form-render.min.js")
+import "src/decidim/decidim_awesome/forms/rich_text_plugin"
+
+export default class CustomFieldsRenderer { // eslint-disable-line no-unused-vars
+  constructor(container_selector) {
+    this.container_selector = container_selector || ".proposal_custom_field:last";
+    this.lang = this.getLang($("html").attr("lang"));
+  }
+
+  getLang(lang) {
+    const langs = {
+      // ar: 'ar-SA', // Not in decidim yet
+      "ar": "ar-TN",
+      "ca": "ca-ES",
+      "cs": "cs-CZ",
+      "da": "da-DK",
+      "de": "de-DE",
+      "el": "el-GR",
+      "en": "en-US",
+      "es": "es-ES",
+      "fa": "fa-IR",
+      "fi": "fi-FI",
+      "fr": "fr-FR",
+      "he": "he-IL",
+      "hu": "hu-HU",
+      "it": "it-IT",
+      "ja": "ja-JP",
+      "my": "my-MM",
+      "nb": "nb-NO",
+      "nl": "nl-NL",
+      "pl": "pl-PL",
+      "pt": "pt-BR",
+      "qz": "qz-MM",
+      "ro": "ro-RO",
+      "ru": "ru-RU",
+      "sl": "sl-SI",
+      "th": "th-TH",
+      "tr": "tr-TR",
+      "uk": "uk-UA",
+      "vi": "vi-VN",
+      "zh-TW": "zh-TW",
+      "zh": "zh-CN"
+    };
+    if (langs[lang]) {
+      return langs[lang];
+    }
+    if (langs[lang.substr(0, 2)]) {
+      return langs[lang.substr(0, 2)];
+    }
+    return "en-US";
+  }
+
+  /*
+  * Creates an XML document with a subset of html-compatible dl/dd/dt elements
+  * to store the custom fields answers
+  */
+  dataToXML(data) {
+    const $dl = $("<dl/>");
+    let $dd, $div, $dt, key, l, label, text, val;
+    $dl.attr("class", "decidim_awesome-custom_fields");
+    $dl.attr("data-generator", "decidim_awesome");
+    $dl.attr("data-version", window.DecidimAwesome.version);
+    for (key in data) {
+      // console.log("get the data!", key, data[key]);
+      // Richtext plugin does not saves userdata, so we get it from the hidden input
+      if (data[key].type == "textarea" && data[key].subtype == "richtext") {
+        data[key].userData = [$(`#${data[key].name}-input`).val()];
+      }
+      if (data[key].userData && data[key].userData.length) {
+        $dt = $("<dt/>");
+        $dt.text(data[key].label);
+        $dt.attr("name", data[key].name);
+        $dd = $("<dd/>");
+        // console.log("data for", key, data[key].name, data[key])
+        for (val in data[key].userData) {
+          $div = $("<div/>");
+          label = data[key].userData[val];
+          text = null;
+          if (data[key].values) {
+            l = data[key].values.find((v) => v.value == label);
+            if (l) {
+              text = label;
+              label = l.label;
+            }
+          } else if (data[key].type == "date" && label) {
+            l = new Date(label).toLocaleDateString();
+            if (l) {
+              text = label;
+              label = l;
+            }
+          }
+          // console.log("userData", text, "label", label, 'key', key, 'data', data)
+          if (data[key].type == "textarea" && data[key].subtype == "richtext") {
+            $div.html(label);
+          } else {
+            $div.text(label);
+          }
+          if (text) {
+            $div.attr("alt", text);
+          }
+          $dd.append($div);
+        }
+        $dd.attr("id", data[key].name);
+        $dd.attr("name", data[key].type);
+        $dl.append($dt);
+        $dl.append($dd);
+      }
+    }
+    return `<xml>${$dl[0].outerHTML}</xml>`;
+  }
+
+  fixBuggyFields() {
+    if (!this.$container) {
+      return false;
+    }
+
+    /**
+    * Hack to fix required checkboxes being reset
+    * Issue: https://github.com/Platoniq/decidim-module-decidim_awesome/issues/82
+    */
+    this.$container.find(".formbuilder-checkbox-group").each((_key, group) => {
+      const inputs = $(".formbuilder-checkbox input", group);
+      const data = this.spec.find((a) => a.type == "checkbox-group");
+      let values = data.userData;
+      if (!inputs.length || !data || !values) {
+        return;
+      }
+
+      inputs.each((_idx, input) => {
+        let index = values.indexOf(input.value);
+        if (index >= 0) {
+          values.splice(index, 1)
+          // setting checked=true do not makes the browser aware that the form is valid if the field is required
+          if (!input.checked)
+          {$(input).click();}
+        } else if (input.checked)
+        {$(input).click();}
+      });
+
+      // Fill "other" option
+      const other_option = $(".other-option", inputs.parent())[0];
+      const other_val = $(".other-val", inputs.parent())[0];
+      const other_text = values.join(" ");
+
+      if (other_option) {
+        if (other_text) {
+          other_option.checked = true;
+          other_option.value = other_text;
+          other_val.value = other_text;
+        } else {
+          other_option.checked = false;
+          other_option.value = "";
+          other_val.value = "";
+        }
+      }
+    });
+
+    /**
+    * Hack to fix required radio buttons "other" value
+    * Issue: https://github.com/Platoniq/decidim-module-decidim_awesome/issues/133
+    */
+    this.$container.find(".formbuilder-radio input.other-val").on("input", (input) => {
+      const $input = $(input.currentTarget);
+      const $group = $input.closest(".formbuilder-radio-group");
+      $group.find("input").each((_key, radio) => {
+        const name = $(radio).attr("name");
+        if (name && name.endsWith("[]")) {
+          $(radio).attr("name", name.slice(0, -2));
+        }
+      });
+    });
+  }
+
+  // Saves xml to the hidden input
+  storeData() {
+    if (!this.$container) {
+      return false;
+    }
+    const $form = this.$container.closest("form");
+    const $body = $form.find(`input[name="${this.$element.data("name")}"]`);
+    if ($body.length && this.instance) {
+      this.spec = this.instance.userData;
+      $body.val(this.dataToXML(this.spec));
+      this.$element.data("spec", this.spec);
+    }
+    // console.log("storeData spec", this.spec, "$body", $body,"$form",$form,"this",this);
+  }
+
+  init($element) {
+    this.$element = $element;
+    this.spec = $element.data("spec");
+    if (!this.$container) {
+      this.$container = $(this.container_selector);
+    }
+    // console.log("init", $element, "this", this)
+    // always use the last field (in case of multilang tabs we only render one form due a limitation of the library to handle several instances)
+    this.instance = this.$container.formRender({
+      i18n: {
+        locale: this.lang,
+        location: "https://cdn.jsdelivr.net/npm/formbuilder-languages@1.1.0/"
+      },
+      formData: this.spec,
+      render: true
+    });
+    this.fixBuggyFields();
+  }
+}

data/app/{assets/javascripts/decidim/decidim_awesome/forms/rich_text_plugin.js.es6 → packs/src/decidim/decidim_awesome/forms/rich_text_plugin.js}

@@ -1,19 +1,18 @@
 /**
- * 
- * NOTE: For some reason, this seems to throw an error while transpiling
- * For this reason a rich_text_plugin.js is provided using the online transpiler https://babeljs.io/repl
- * Hopefully, this situation will change when webpacker is updated in the v0.25 of Decidim
- * 
  * Decidim rich text editor control plugin
  * Renders standard Decidim WYSIWYG editor
  *
  * Registers Decidim Richtext as a subtype for the textarea control
  */
+import {createQuillEditor} from "src/decidim/decidim_awesome/editors/editor"
 
 // configure the class for runtime loading
-if (!window.fbControls) window.fbControls = []
+if (!window.fbControls) {
+  window.fbControls = []
+}
 window.fbControls.push(function(controlClass, allControlClasses) {
   const controlTextarea = allControlClasses.textarea
+
   /**
    * DecidimRichtext control class
    *
@@ -22,16 +21,17 @@ window.fbControls.push(function(controlClass, allControlClasses) {
    *       from the hidden input name same as the field with the suffix '-input'
    */
   class controlRichtext extends controlTextarea {
+
     /**
      * Class configuration - return the icons & label related to this control
      * @returndefinition object
      */
     static get definition() {
       return {
-        icon: '📝',
+        icon: "📝",
         i18n: {
-          default: 'Rich Text Editor'
-        },
+          default: "Rich Text Editor"
+        }
       }
     }
 
@@ -50,26 +50,27 @@ window.fbControls.push(function(controlClass, allControlClasses) {
       const { value, userData, ...attrs } = this.config;
 
       // hidden input for storing the current HTML value of the div
-      this.inputId = this.id + '-input'
-      this.input = this.markup('input', null, {
+      this.inputId = `${this.id}-input`;
+      // console.log("build plugin: this",this)
+      this.input = this.markup("input", null, {
         name: name,
         id: this.inputId,
-        type: 'hidden',
-        value: (userData && userData[0]) || value
+        type: "hidden",
+        value: (userData && userData[0]) || value || ""
       });
 
       const css = this.markup(
-        'style',
+        "style",
         `
-        #${attrs.id} { height: auto; padding-left: 0; padding-right: 0; }
+        #${attrs.id} { height: auto; min-height: 6rem; padding-left: 0; padding-right: 0; }
         #${attrs.id} div.ql-container { height: ${attrs.rows || 1}rem; }
         #${attrs.id} p.help-text { margin-top: .5rem; }
         `,
-        { type: 'text/css' }
+        { type: "text/css" }
       );
       // console.log("build value", value, "userData", userData, "attrs", attrs, attrs.id);
-      this.wrapper = this.markup('div', null, attrs);
-      return this.markup('div', [css, this.input, this.wrapper], attrs);
+      this.wrapper = this.markup("div", null, attrs);
+      return this.markup("div", [css, this.input, this.wrapper], attrs);
     }
 
     /**
@@ -86,7 +87,7 @@ window.fbControls.push(function(controlClass, allControlClasses) {
       window.fbEditors.quill[this.id] = {};
       const editor = window.fbEditors.quill[this.id];
       // createQuillEditor does all the job to update the hidden input wrapper
-      editor.instance = window.Decidim.createQuillEditor(this.wrapper);
+      editor.instance = createQuillEditor(this.wrapper);
       // editor.data = new Delta();
       // if (value) {
       //   editor.instance.setContents(window.JSON.parse(this.parsedHtml(value)));
@@ -102,5 +103,5 @@ window.fbControls.push(function(controlClass, allControlClasses) {
   }
 
   // register Decidim richtext as a richtext control
-  controlTextarea.register('richtext', controlRichtext, 'textarea');
+  controlTextarea.register("richtext", controlRichtext, "textarea");
 })

data/app/packs/src/decidim/decidim_awesome/proposals/custom_fields.js

@@ -0,0 +1,22 @@
+import CustomFieldsRenderer from "src/decidim/decidim_awesome/forms/custom_fields_renderer"
+
+window.DecidimAwesome.CustomFieldsRenderer = window.DecidimAwesome.CustomFieldsRenderer || new CustomFieldsRenderer();
+
+$(() => {
+  // use admin multilang specs if exists
+  let $el = $("proposal_custom_field:first", ".tabs-title.is-active");
+  $el = $el.length
+    ? $el
+    : $(".proposal_custom_field:first");
+  window.DecidimAwesome.CustomFieldsRenderer.init($el);
+
+  window.DecidimAwesome.CustomFieldsRenderer.$container.closest("form").on("submit", (e) => {
+    if (e.target.checkValidity()) {
+      // save current editor
+      window.DecidimAwesome.CustomFieldsRenderer.storeData();
+    } else {
+      e.preventDefault();
+      e.target.reportValidity();
+    }
+  });
+});

data/app/packs/src/decidim/decidim_awesome/proposals/images.js

@@ -0,0 +1,25 @@
+$(() => {
+  window.DecidimAwesome = window.DecidimAwesome || {};
+
+  const token = $('meta[name="csrf-token"]').attr("content");
+  const $textarea = $("textarea#proposal_body");
+  const t = window.DecidimAwesome.texts.drag_and_drop_image;
+
+  if (!$textarea.length) {
+    return;
+  }
+
+  if (window.DecidimAwesome.allow_images_in_proposals) {
+    // Add the capability to upload images only (they will be presented as links)
+
+    $textarea.after(`<p class="help-text">${t}</p>`);
+    $textarea.inlineattachment({
+      uploadUrl: window.DecidimAwesome.editor_uploader_path,
+      uploadFieldName: "image",
+      jsonFieldName: "url",
+      progressText: "[Uploading file...]",
+      urlText: "{filename}",
+      extraHeaders: { "X-CSRF-Token": token }
+    });
+  }
+});

data/app/packs/src/vendor/leaflet.featuregroup.subgroup.js

@@ -0,0 +1,184 @@
+L.FeatureGroup.SubGroup = L.FeatureGroup.extend({
+
+    /**
+     * Instantiates a SubGroup.
+     * @param parentGroup (L.LayerGroup) (optional)
+     * @param layersArray (L.Layer[]) (optional)
+     */
+    initialize: function (parentGroup, layersArray) {
+        L.FeatureGroup.prototype.initialize.call(this, layersArray);
+
+        this.setParentGroup(parentGroup);
+    },
+
+    /**
+     * Changes the parent group into which child markers are added to /
+     * removed from.
+     * @param parentGroup (L.LayerGroup)
+     * @returns {SubGroup} this
+     */
+    setParentGroup: function (parentGroup) {
+        var pgInstanceOfLG = parentGroup instanceof L.LayerGroup;
+
+        this._parentGroup = parentGroup;
+
+        // onAdd
+        this.onAdd =
+            pgInstanceOfLG ?
+                (
+                    typeof parentGroup.addLayers === "function" ?
+                        this._onAddToGroupBatch :
+                        this._onAddToGroup
+                ) :
+                this._onAddToMap;
+
+        // onRemove
+        this.onRemove =
+            pgInstanceOfLG ?
+                (
+                    typeof parentGroup.removeLayers === "function" ?
+                        this._onRemoveFromGroupBatch :
+                        this._onRemoveFromGroup
+                ) :
+                this._onRemoveFromMap;
+
+        // addLayer
+        this.addLayer = pgInstanceOfLG ?
+            this._addLayerToGroup :
+            this._addLayerToMap;
+
+        // removeLayer
+        this.removeLayer = pgInstanceOfLG ?
+            this._removeLayerFromGroup :
+            this._removeLayerFromMap;
+
+        return this;
+    },
+
+    /**
+     * Removes the current sub-group from map before changing the parent
+     * group. Re-adds the sub-group to map if it was before changing.
+     * @param parentGroup (L.LayerGroup)
+     * @returns {SubGroup} this
+     */
+    setParentGroupSafe: function (parentGroup) {
+        var map = this._map;
+
+        if (map) {
+            map.removeLayer(this);
+        }
+
+        this.setParentGroup(parentGroup);
+
+        if (map) {
+            map.addLayer(this);
+        }
+
+        return this;
+    },
+
+    /**
+     * Returns the current parent group.
+     * @returns {*}
+     */
+    getParentGroup: function () {
+        return this._parentGroup;
+    },
+
+
+    // For parent groups with batch methods (addLayers and removeLayers)
+    // like MarkerCluster.
+    _onAddToGroupBatch: function (map) {
+        var layersArray = this.getLayers();
+
+        this._map = map;
+        this._parentGroup.addLayers(layersArray);
+    },
+
+    _onRemoveFromGroupBatch: function () {
+        var layersArray = this.getLayers();
+
+        this._parentGroup.removeLayers(layersArray);
+        this._map = null;
+    },
+
+
+    // For other parent layer groups.
+    _onAddToGroup: function (map) {
+        var parentGroup = this._parentGroup;
+
+        this._map = map;
+        this.eachLayer(parentGroup.addLayer, parentGroup);
+    },
+
+    _onRemoveFromGroup: function () {
+        var parentGroup = this._parentGroup;
+
+        this.eachLayer(parentGroup.removeLayer, parentGroup);
+        this._map = null;
+    },
+
+
+    // Defaults to standard FeatureGroup behaviour when parent group is not
+    // specified or is not a type of LayerGroup.
+    _onAddToMap: L.FeatureGroup.prototype.onAdd,
+    _onRemoveFromMap: L.FeatureGroup.prototype.onRemove,
+
+
+    _addLayerToGroup: function (layer) {
+        if (this.hasLayer(layer)) {
+            return this;
+        }
+
+        layer.addEventParent(this);
+
+        var id = this.getLayerId(layer);
+console.log("adtogroup id",id,"layer",layer,"this",this)
+        this._layers[id] = layer;
+
+        if (this._map) {
+            // Add to parent group instead of directly to map.
+            this._parentGroup.addLayer(layer);
+        }
+
+        return this.fire("layeradd", {layer: layer});
+    },
+
+    _removeLayerFromGroup: function (layer) {
+        // If unknown layer, skip.
+        if (!this.hasLayer(layer)) {
+            return this;
+        }
+
+        // Retrieve the layer id.
+        var id = layer in this._layers ? layer : this.getLayerId(layer);
+
+        // Retrieve the layer from this._layer.
+        layer = this._layers[id];
+
+        // Unregister from events parent.
+        layer.removeEventParent(this);
+
+        if (this._map && layer) {
+            // Remove from parent group instead of directly from map.
+            this._parentGroup.removeLayer(layer);
+        }
+
+        delete this._layers[id];
+
+        return this.fire("layerremove", {layer: layer});
+    },
+
+    // Defaults to standard FeatureGroup behaviour when parent group is not
+    // specified or is not a type of LayerGroup.
+    _addLayerToMap: L.FeatureGroup.prototype.addLayer,
+    _removeLayerFromMap: L.FeatureGroup.prototype.removeLayer
+
+});
+
+
+
+// Supply with a factory for consistency with Leaflet.
+L.featureGroup.subGroup = function (parentGroup, options) {
+    return new L.FeatureGroup.SubGroup(parentGroup, options);
+};

data/app/{assets → packs}/stylesheets/decidim/decidim_awesome/admin/auto_edits.scss

@@ -6,10 +6,11 @@ input.awesome-auto-edit {
   line-height: 0;
   height: auto;
 }
+
 span.awesome-auto-edit {
   padding: 0 4px;
   background-color: #f0f0f0;
   border-radius: 5px;
   margin: 0;
   font-weight: 600;
-}
+}

data/app/packs/stylesheets/decidim/decidim_awesome/admin/check_redirections.scss

@@ -0,0 +1,28 @@
+.custom-redirections-table {
+  th,
+  td {
+    text-align: left !important;
+  }
+
+  td.redirect-status {
+    font-family: monospace;
+
+    &.success {
+      &::before {
+        content: "OK! ";
+      }
+    }
+
+    &.alert {
+      &::before {
+        content: "ERR ";
+      }
+    }
+
+    &.muted {
+      &::before {
+        content: "N/A ";
+      }
+    }
+  }
+}

data/app/{assets → packs}/stylesheets/decidim/decidim_awesome/admin/codemirror.scss

@@ -1,11 +1,13 @@
-.awesome-edit-config{
+@import "codemirror/lib/codemirror.css";
+
+.awesome-edit-config {
   .scoped_styles_container,
-  .proposal_custom_fields_container{
-    .form-error{
+  .proposal_custom_fields_container {
+    .form-error {
       margin: 0;
     }
 
-    >.CodeMirror{
+    >.CodeMirror {
       border-top-left-radius: 5px;
       border-top-right-radius: 5px;
       border-top: .5em solid #e0e0e0;
@@ -17,8 +19,8 @@
       resize: vertical;
       overflow: vertical !important;
 
-      >.CodeMirror-scroll{
-        >.CodeMirror-gutters{
+      >.CodeMirror-scroll {
+        >.CodeMirror-gutters {
           background: #e0e0e0;
         }
       }

data/app/{assets → packs}/stylesheets/decidim/decidim_awesome/admin/constraints.scss

@@ -1,47 +1,47 @@
-.constraints-editor{
+.constraints-editor {
   background: #f6f6f6;
   padding: 1rem;
   margin: -.5rem 0 2rem;
   border-radius: 5px;
 
-  .constraints-list{
+  .constraints-list {
     padding: 0;
     // margin:0 0 1em 0 ;
-    li{
+    li {
       margin: 0 1em 0 0;
       padding: 0;
     }
 
-    .label{
-      &.participatory_space_manifest{
+    .label {
+      &.participatory_space_manifest {
         background-color: #f7b230;
       }
 
-      &.participatory_space_slug{
+      &.participatory_space_slug {
         background-color: #19b380;
       }
 
-      &.component_manifest{
+      &.component_manifest {
         background-color: #b31919;
       }
 
-      &.component_id{
+      &.component_id {
         background-color: #ee449c;
       }
 
-      &.constraint{
-        &-none{
+      &.constraint {
+        &-none {
           background-color: #ff3000;
         }
       }
     }
 
-    a{
+    a {
       margin-left: 1rem;
     }
 
-    &.inactive{
-      .label:not(.constraint-none){
+    &.inactive {
+      .label:not(.constraint-none) {
         filter: saturate(10%);
       }
     }