decidim-enhanced_textwork 1.0.0

data/app/packs/images/decidim/gamification/badges/decidim_gamification_badges_paragraphs.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="paragraphs-svg" width="1080" height="1080" x="0" y="0" enable-background="new 0 0 1080 1080" version="1.1" viewBox="0 0 1080 1080" xml:space="preserve"><g id="paragraphs" class="stroke-primary"><g id="sleeve"><rect id="_x32_5-pct_1_" width="225" height="286" x="437.5" y="798.5" fill="#31536E" fill-opacity=".25" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16" class="fill-primary"/><rect width="225" height="192" x="437.5" y="892.5" fill="#31536E" class="fill-primary"/><line x1="469.5" x2="469.5" y1="798.5" y2="876.5" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16"/><line x1="501.5" x2="501.5" y1="798.5" y2="876.5" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16"/><line x1="533.5" x2="533.5" y1="798.5" y2="876.5" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16"/><line x1="565.5" x2="565.5" y1="798.5" y2="876.5" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16"/><line x1="597.5" x2="597.5" y1="798.5" y2="876.5" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16"/><line x1="629.5" x2="629.5" y1="798.5" y2="876.5" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16"/></g><g><g id="hand_1_" fill-opacity=".25" class="fill-primary"><path fill="#31536E" fill-opacity=".1" d="M702.979,523.043l-19.699-3.815l-13.889-22.199L640.001,508.5l-29.808-17.167 l-22.892,9.486l-38.948-10.921l-12.906,15.104l-35.937,6.877c0,0-21.511-9.38-24.181-20.584 c9.166-8.183,25.578-12.414,40.17-24.795c33-28,32-81-4-111c-22,12-156,79-156,79l0,0v74c0,17.992-2.5,41,1.577,65.972 C377.942,619.5,401.5,665,466.031,667.689l-8.531-0.627V798.5h189v-123h-0.105c51.605,0,66.62-94.165,72.562-158.237 L702.979,523.043z" class="fill-primary"/><path fill="#FFF" d="M473.499,373.498c0,0,12.987,26.002,22.994,22.002s32.046-23.229,32.046-23.229L511.5,355.5 L473.499,373.498z"/><path fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16" d="M451.324,498.5c0,0,31.176-4,64.176-32s32-81-4-111c-22,12-156,79-156,79l0,0v74c0,17.992-2.5,41,1.577,65.972 C377.942,619.5,401.5,665,466.031,667.689l-8.531-0.627V798.5h189v-123h-0.105c51.605,0,62.62-94.165,68.562-158.237"/><path fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16" d="M505.818,513.229c12.682,29.272,13.403,80.272,8.682,102.271"/><path fill="#31536E" fill-opacity=".1" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16" d="M468.5,377.5v-11.282c0-28.564,17.923-51.718,42.5-51.718l0,0c24.577,0,44.5,23.154,44.5,51.718v95.564 c0,28.562-19.923,51.718-44.5,51.718l0,0c-17.737,0-26.049-4.979-33.199-22.428c0,0,43.033-21.906,53.699-44.572 c8.476-18.011,18-58.892-20-91C496.188,363.522,468.5,377.5,468.5,377.5z" class="fill-primary"/><path fill="#31536E" fill-opacity=".1" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16" d="M548.052,337.583c7.851-8.05,19.034-13.083,31.448-13.083l0,0c23.748,0,43,18.419,43,41.141v94.719 c0,22.721-19.252,41.14-43,41.14l0,0c-11.874,0-22.624-4.605-30.406-12.05" class="fill-primary"/><path fill="#31536E" fill-opacity=".1" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16" d="M621.341,356.167c6.171-4.207,13.628-6.667,21.659-6.667l0,0c21.263,0,38.5,17.237,38.5,38.5v81c0,21.263-17.237,38.5-38.5,38.5 l0,0c-13.871,0-26.029-7.336-32.807-18.34" class="fill-primary"/><path fill="#31536E" fill-opacity=".1" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16" d="M681.973,386.233c4.827-4.194,9.131-6.733,16.027-6.733l0,0c15.188,0,27.5,12.312,27.5,27.5v89c0,15.188-12.312,27.5-27.5,27.5 l0,0c-15.188,0-27.5-12.312-27.5-27.5" class="fill-primary"/><path id="_x32_5-pct_3_" fill="#31536E" fill-opacity=".25" d="M688,523.5c-15.188,0-27.5-12.312-27.5-27.5l0.008-0.075 C653.52,503.064,643.779,507.5,633,507.5c-13.871,0-26.028-7.336-32.807-18.339c-7.805,7.611-18.669,12.339-30.693,12.339 c-11.874,0-22.624-4.605-30.406-12.051l-0.006-0.91C531.29,503.501,517.15,513.5,501,513.5c-10.683,0-18.826-16-27.386-20.245 c-5.651-2.803-13.74,8.544-14.813,0.817l10,35C475.952,546.521,490.26,623.5,524,623.5c16.15,0,18.094-67.051,18.094-67.051 c7.782,7.443,8.532,23.051,20.406,23.051c12.024,0,29.891-47.729,37.693-55.339C606.972,535.164,619.129,542.5,633,542.5 c10.779,0,20.52-4.436,27.508-11.575L660.5,531c0,15.188,12.312,27.5,27.5,27.5s27.5-12.312,27.5-27.5v-35 C715.5,511.188,703.188,523.5,688,523.5z" class="fill-primary"/><path fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="8" d="M473.499,373.498c0,0,12.987,26.002,22.994,22.002s32.046-23.229,32.046-23.229"/><path fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16" d="M542.539,502.5c12.047,5.577,23.875,74.756,22.961,69"/></g></g><path fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16" d="M426.638,477.259"/><path fill="#31536E" fill-opacity=".1" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="16" d="M469.333,369.889V99.028c0-23.58-19.115-42.695-42.695-42.695l0,0c-23.58,0-42.694,19.115-42.694,42.695v320.536" class="fill-primary"/><line x1="404.098" x2="447.455" y1="165.608" y2="165.608" fill="none" stroke="#31536E" stroke-linecap="round" stroke-miterlimit="10" stroke-width="4"/><line x1="404.098" x2="447.455" y1="269.608" y2="269.608" fill="none" stroke="#31536E" stroke-linecap="round" stroke-miterlimit="10" stroke-width="4"/><line x1="404.098" x2="447.455" y1="387.608" y2="387.608" fill="none" stroke="#31536E" stroke-linecap="round" stroke-miterlimit="10" stroke-width="4"/><path fill="#FFF" d="M1404.5,687.5"/><g id="stars_2" class="stars"><path fill="#FFD92B" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4" d="M137.5,645.605c0-14.688-18.667-35.354-35.355-35.354c15.355,0,35.355-20.333,35.355-35.354c0,15.021,16.666,35.354,35.355,35.354 C153.833,610.251,137.5,630.918,137.5,645.605z"/><g><circle cx="1008.882" cy="708.662" r="13.5" fill="#FFD92B" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><line x1="992.383" x2="971.17" y1="691.927" y2="670.714" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><line x1="1026.324" x2="1047.537" y1="725.868" y2="747.081" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><line x1="1025.617" x2="1046.83" y1="692.634" y2="671.421" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><line x1="992.383" x2="971.17" y1="725.868" y2="747.081" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/></g><g><line x1="212.112" x2="185.95" y1="161.345" y2="187.508" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><line x1="176.758" x2="150.595" y1="196.701" y2="222.864" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><line x1="211.405" x2="185.242" y1="222.864" y2="196.701" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><line x1="176.051" x2="149.888" y1="187.508" y2="161.345" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/></g><path fill="#FFD92B" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4" d="M833.092,333.86c0,0-24.604,4.603-30.25,10.249c-5.646,5.646-10.248,30.249-10.248,30.249s-4.604-24.603-10.25-30.249 c-5.646-5.646-30.248-10.249-30.248-10.249s25.188-5.187,30.248-10.249c5.062-5.062,10.25-30.249,10.25-30.249 s4.604,24.603,10.248,30.249C808.488,329.257,833.092,333.86,833.092,333.86z"/><g><circle cx="978.834" cy="500.751" r="18.5" fill="#FFD92B" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><circle cx="938.834" cy="500.751" r="7.166" fill="#FFD92B" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><circle cx="978.834" cy="540.751" r="7.166" fill="#FFD92B" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><circle cx="1018.834" cy="500.751" r="7.166" fill="#FFD92B" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><circle cx="978.834" cy="460.751" r="7.166" fill="#FFD92B" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/></g><g><line x1="296.246" x2="351.149" y1="682.224" y2="737.129" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><line x1="351.149" x2="296.246" y1="682.224" y2="737.129" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><line x1="305.5" x2="278.5" y1="709.251" y2="709.251" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><line x1="343.5" x2="370.5" y1="709.251" y2="709.251" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><line x1="324.5" x2="324.5" y1="728.251" y2="755.251" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><line x1="324.5" x2="324.5" y1="690.251" y2="663.251" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/></g><g><line x1="629.5" x2="629.5" y1="122.251" y2="201.251" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><line x1="668.5" x2="589.5" y1="162.251" y2="162.251" fill="none" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><circle cx="609.5" cy="181.751" r="7.039" fill="#FFD92B" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><circle cx="609.5" cy="141.751" r="7.039" fill="#FFD92B" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><circle cx="649.5" cy="181.751" r="7.039" fill="#FFD92B" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/><circle cx="649.5" cy="141.751" r="7.039" fill="#FFD92B" stroke="#31536E" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="4"/></g></g></g></svg>

data/app/packs/src/decidim/enhanced_textwork/add_paragraph.js

@@ -0,0 +1,49 @@
+import attachGeocoding from "src/decidim/geocoding/attach_input"
+import getCoordinateInputName from "src/decidim/geocoding/coordinate_input";
+
+$(() => {
+  const $checkbox = $("input:checkbox[name$='[has_address]']");
+  const $addressInput = $("#address_input");
+  const $addressInputField = $("input", $addressInput);
+  const $map = $("#address_map");
+  const latFieldName = getCoordinateInputName("latitude", $addressInputField, {})
+  const longFieldName = getCoordinateInputName("longitude", $addressInputField, {})
+  $map.hide();
+
+  if ($checkbox.length > 0) {
+    const toggleInput = () => {
+      if ($checkbox[0].checked) {
+        $addressInput.show();
+        $addressInputField.prop("disabled", false);
+      } else {
+        $addressInput.hide();
+        $addressInputField.prop("disabled", true);
+      }
+    }
+    toggleInput();
+    $checkbox.on("change", toggleInput);
+  }
+
+  if ($addressInput.length > 0) {
+    if ($checkbox[0].checked) {
+      $map.show();
+    }
+
+    const ctrl = $("[data-decidim-map]").data("map-controller");
+    ctrl.setEventHandler("coordinates", (ev) => {
+      $(`input[name='${latFieldName}']`).val(ev.lat);
+      $(`input[name='${longFieldName}']`).val(ev.lng);
+    });
+
+    attachGeocoding($addressInputField, null, (coordinates) => {
+      $map.show();
+      // Remove previous marker when user updates address in address field
+      ctrl.removeMarker();
+      ctrl.addMarker({
+        latitude: coordinates[0],
+        longitude: coordinates[1],
+        address: $addressInput.val()
+      });
+    });
+  }
+});

data/app/packs/src/decidim/enhanced_textwork/admin/paragraphs.js

@@ -0,0 +1,143 @@
+/* eslint-disable no-invalid-this */
+/* eslint no-unused-vars: 0 */
+/* eslint id-length: ["error", { "exceptions": ["e"] }] */
+
+$(() => {
+  const selectedParagraphsCount = function() {
+    return $(".table-list .js-check-all-paragraph:checked").length
+  }
+
+  const selectedParagraphsNotPublishedAnswerCount = function() {
+    return $(".table-list [data-published-state=false] .js-check-all-paragraph:checked").length
+  }
+
+  const selectedParagraphsCountUpdate = function() {
+    const selectedParagraphs = selectedParagraphsCount();
+    const selectedParagraphsNotPublishedAnswer = selectedParagraphsNotPublishedAnswerCount();
+    if (selectedParagraphs === 0) {
+      $("#js-selected-paragraphs-count").text("")
+    } else {
+      $("#js-selected-paragraphs-count").text(selectedParagraphs);
+    }
+
+    if (selectedParagraphs >= 2) {
+      $('button[data-action="merge-paragraphs"]').parent().show();
+    } else {
+      $('button[data-action="merge-paragraphs"]').parent().hide();
+    }
+
+    if (selectedParagraphsNotPublishedAnswer > 0) {
+      $('button[data-action="publish-answers"]').parent().show();
+      $("#js-form-publish-answers-number").text(selectedParagraphsNotPublishedAnswer);
+    } else {
+      $('button[data-action="publish-answers"]').parent().hide();
+    }
+  }
+
+  const showBulkActionsButton = function() {
+    if (selectedParagraphsCount() > 0) {
+      $("#js-bulk-actions-button").removeClass("hide");
+    }
+  }
+
+  const hideBulkActionsButton = function(force = false) {
+    if (selectedParagraphsCount() === 0 || force === true) {
+      $("#js-bulk-actions-button").addClass("hide");
+      $("#js-bulk-actions-dropdown").removeClass("is-open");
+    }
+  }
+
+  const showOtherActionsButtons = function() {
+    $("#js-other-actions-wrapper").removeClass("hide");
+  }
+
+  const hideOtherActionsButtons = function() {
+    $("#js-other-actions-wrapper").addClass("hide");
+  }
+
+  const hideBulkActionForms = function() {
+    $(".js-bulk-action-form").addClass("hide");
+  }
+
+  // Expose functions to make them avaialble in .js.erb templates
+  window.selectedParagraphsCount = selectedParagraphsCount;
+  window.selectedParagraphsNotPublishedAnswerCount = selectedParagraphsNotPublishedAnswerCount;
+  window.selectedParagraphsCountUpdate = selectedParagraphsCountUpdate;
+  window.showBulkActionsButton = showBulkActionsButton;
+  window.hideBulkActionsButton = hideBulkActionsButton;
+  window.showOtherActionsButtons = showOtherActionsButtons;
+  window.hideOtherActionsButtons = hideOtherActionsButtons;
+  window.hideBulkActionForms = hideBulkActionForms;
+
+  if ($(".js-bulk-action-form").length) {
+    hideBulkActionForms();
+    $("#js-bulk-actions-button").addClass("hide");
+
+    $("#js-bulk-actions-dropdown ul li button").click(function(e) {
+      e.preventDefault();
+      let action = $(e.target).data("action");
+
+      if (action) {
+        $(`#js-form-${action}`).submit(function() {
+          $(".layout-content > .callout-wrapper").html("");
+        })
+
+        $(`#js-${action}-actions`).removeClass("hide");
+        hideBulkActionsButton(true);
+        hideOtherActionsButtons();
+      }
+    })
+
+    // select all checkboxes
+    $(".js-check-all").change(function() {
+      $(".js-check-all-paragraph").prop("checked", $(this).prop("checked"));
+
+      if ($(this).prop("checked")) {
+        $(".js-check-all-paragraph").closest("tr").addClass("selected");
+        showBulkActionsButton();
+      } else {
+        $(".js-check-all-paragraph").closest("tr").removeClass("selected");
+        hideBulkActionsButton();
+      }
+
+      selectedParagraphsCountUpdate();
+    });
+
+    // paragraph checkbox change
+    $(".table-list").on("change", ".js-check-all-paragraph", function (e) {
+      let paragraphId = $(this).val()
+      let checked = $(this).prop("checked")
+
+      // uncheck "select all", if one of the listed checkbox item is unchecked
+      if ($(this).prop("checked") === false) {
+        $(".js-check-all").prop("checked", false);
+      }
+      // check "select all" if all checkbox paragraphs are checked
+      if ($(".js-check-all-paragraph:checked").length === $(".js-check-all-paragraph").length) {
+        $(".js-check-all").prop("checked", true);
+        showBulkActionsButton();
+      }
+
+      if ($(this).prop("checked")) {
+        showBulkActionsButton();
+        $(this).closest("tr").addClass("selected");
+      } else {
+        hideBulkActionsButton();
+        $(this).closest("tr").removeClass("selected");
+      }
+
+      if ($(".js-check-all-paragraph:checked").length === 0) {
+        hideBulkActionsButton();
+      }
+
+      $(".js-bulk-action-form").find(`.js-paragraph-id-${paragraphId}`).prop("checked", checked);
+      selectedParagraphsCountUpdate();
+    });
+
+    $(".js-cancel-bulk-action").on("click", function (e) {
+      hideBulkActionForms()
+      showBulkActionsButton();
+      showOtherActionsButtons();
+    });
+  }
+});

data/app/packs/src/decidim/enhanced_textwork/admin/paragraphs_form.js

@@ -0,0 +1,29 @@
+import attachGeocoding from "src/decidim/geocoding/attach_input"
+
+$(() => {
+  const $form = $(".paragraph_form_admin");
+
+  if ($form.length > 0) {
+    const $paragraphCreatedInMeeting = $form.find("#paragraph_created_in_meeting");
+    const $paragraphMeeting = $form.find("#paragraph_meeting");
+
+    const toggleDisabledHiddenFields = () => {
+      const enabledMeeting = $paragraphCreatedInMeeting.prop("checked");
+      $paragraphMeeting.find("select").attr("disabled", "disabled");
+      $paragraphMeeting.hide();
+
+      if (enabledMeeting) {
+        $paragraphMeeting.find("select").attr("disabled", !enabledMeeting);
+        $paragraphMeeting.show();
+      }
+    };
+
+    $paragraphCreatedInMeeting.on("change", toggleDisabledHiddenFields);
+    toggleDisabledHiddenFields();
+
+    const $paragraphAddress = $form.find("#paragraph_address");
+    if ($paragraphAddress.length !== 0) {
+      attachGeocoding($paragraphAddress);
+    }
+  }
+});

data/app/packs/src/decidim/enhanced_textwork/admin/paragraphs_picker.js

@@ -0,0 +1,35 @@
+$(() => {
+  const $content = $(".picker-content"),
+      pickerMore = $content.data("picker-more"),
+      pickerPath = $content.data("picker-path"),
+      toggleNoParagraphs = () => {
+        const showNoParagraphs = $("#paragraphs_list li:visible").length === 0
+        $("#no_paragraphs").toggle(showNoParagraphs)
+      }
+
+  let jqxhr = null
+
+  toggleNoParagraphs()
+
+  $(".data_picker-modal-content").on("change keyup", "#paragraphs_filter", (event) => {
+    const filter = event.target.value.toLowerCase()
+
+    if (pickerMore) {
+      if (jqxhr !== null) {
+        jqxhr.abort()
+      }
+
+      $content.html("<div class='loading-spinner'></div>")
+      jqxhr = $.get(`${pickerPath}?q=${filter}`, (data) => {
+        $content.html(data)
+        jqxhr = null
+        toggleNoParagraphs()
+      })
+    } else {
+      $("#paragraphs_list li").each((index, li) => {
+        $(li).toggle(li.textContent.toLowerCase().indexOf(filter) > -1)
+      })
+      toggleNoParagraphs()
+    }
+  })
+})

data/app/packs/src/decidim/enhanced_textwork/toggle_element.js

@@ -0,0 +1,21 @@
+$(() => {
+  const $showButton = $("[data-toggle='show']")
+  const $hideButton = $("[data-toggle='hide']")
+  const $toggleElements = $(".toggle--hidden:not(button)")
+
+  $showButton.on("click", (e) => {
+    e.preventDefault()
+    $toggleElements.removeClass("toggle--hidden")
+
+    $hideButton.removeClass("toggle--hidden")
+    $(e.target).addClass("toggle--hidden")
+  })
+
+  $hideButton.on("click", (e) => {
+    e.preventDefault()
+    $toggleElements.addClass("toggle--hidden")
+
+    $showButton.removeClass("toggle--hidden")
+    $(e.target).addClass("toggle--hidden")
+  })
+});

data/app/packs/src/decidim/enhanced_textwork/utils.js

@@ -0,0 +1,11 @@
+/* eslint-disable no-invalid-this */
+
+$(() => {
+  $("#vote_button").mouseover(function () {
+    $(this).text($(this).data("replace"));
+  });
+
+  $("#vote_button").mouseout(function () {
+    $(this).text($(this).data("original"));
+  });
+});

data/app/packs/stylesheets/decidim/enhanced_textwork/_paragraphs.scss

@@ -0,0 +1,208 @@
+@import "stylesheets/decidim/enhanced_textwork/paragraphs/preview";
+
+#paragraphs {
+  background-color: $white;
+  padding: 1.125rem;
+}
+
+.paragraphs-overview {
+  overflow: unset;
+}
+
+.toggle--hidden {
+  display: none;
+}
+
+.paragraph {
+  padding: 1rem;
+  border: 1px solid $white;
+  border-bottom-color: #f4f4f4;
+
+  &__back-button {
+    display: none;
+  }
+  &__layout {
+    display: flex;
+  }
+  &__main {
+    width: 66.6667%;
+    padding-right: 10px;
+  }
+  &__sidebar {
+    width: 33.333%;
+    position: sticky;
+    top: 0;
+    height: 100vh;
+    padding: 3rem 0 3rem 10px;
+    overflow: scroll;
+    scroll-behavior: smooth;
+  }
+  a {
+    color: inherit;
+    &:hover {
+      text-decoration: none;
+    }
+  }
+  &__actions {
+    .right-column {
+      display: flex;
+      justify-content: space-between;
+    }
+    a {
+      color: $secondary;
+      font-weight: 600;
+      font-size: .9rem;
+      &:hover {
+        text-decoration: underline;
+      }
+    }
+    button {
+      color: $secondary;
+      font-weight: 600;
+      font-size: .9rem;
+      line-height: 1.5;
+      &:hover {
+        text-decoration: underline;
+      }
+    }
+  }
+
+  &__overview {
+    h2 {
+      fonz-size: 1.625rem;
+    }
+    h3 {
+      font-size:  1.125rem;
+    }
+    .link {
+      font-size: .9rem;
+    }
+    .amendments, .comments {
+      background-color: #f4f4f4;
+      padding: 1.125rem;
+    }
+    .amendments {
+      margin-bottom: 1.125rem;
+      h3 {
+        margin: 0;
+      }
+      .card {
+        margin-bottom: 0;
+        margin-top: .5rem;
+      }
+    }
+    .comments__header {
+      h3 {
+        float: left;
+      }
+      a {
+        float: right;
+        font-size: .9rem;
+      }
+    }
+  }
+}
+
+.paragraph--active {
+  border: 1px solid #3c393b;
+  background-color: #f4f4f4;
+  border-radius: 4px;
+}
+
+.emendation {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+
+  .amendment__header {
+    padding: 1rem 1rem 0.5rem 1rem;
+  }
+
+  .amendment__author {
+    display: flex;
+  }
+
+  .amendment__date {
+    font-style: italic;
+    color: #9b9b9b;
+    font-size: 0.7rem;
+  }
+
+  .amendment__body {
+    padding: 0.5rem 1rem;
+  }
+
+  .amendment__actions {
+    padding: 0rem 1rem 1rem 1rem;
+    font-size: .9rem;
+  }
+}
+
+
+.paragraph__hover-section{
+  .paragraph-actions {
+    color: #9b9b9b;
+  }
+
+  &:hover{
+    .paragraph {
+      background-color: #f4f4f4;
+    }
+
+    .paragraph-actions {
+      color: #3d393c;
+    }
+  }
+
+  .hidden-section{
+    display: none;
+  }
+}
+
+/* Mobile */
+
+@media screen and (max-width: 1125px) {
+  .paragraph {
+    &__layout {
+      display: block;
+    }
+    &__sidebar {
+      width: 100%;
+      padding: 0;
+      overflow: auto;
+      height: auto;
+      display: none;
+    }
+  }
+  .paragraph__main {
+    width: 100%;
+    padding: 0;
+  }
+  .paragraphs-overview {
+    .paragraph {
+      display: none;
+      &__sidebar {
+        display: block;
+        overflow: auto;
+        height: auto;
+      }
+      &__back-button {
+        display: block;
+      }
+      &--active {
+        display: block;
+      }
+    }
+  }
+}
+
+@media screen and (max-width: 500px) {
+  .paragraph {
+    &__actions .right-column {
+      flex-direction: column;
+      a {
+        margin-top: .5rem;
+      }
+    }
+  }
+}

data/app/packs/stylesheets/decidim/enhanced_textwork/paragraphs/_preview.scss

@@ -0,0 +1,3 @@
+.preview--form__hidden{
+  display: none;
+}

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

@@ -0,0 +1,147 @@
+# frozen_string_literal: true
+
+module Decidim
+  module EnhancedTextwork
+    module Admin
+      class Permissions < Decidim::DefaultPermissions
+        def permissions
+          # The public part needs to be implemented yet
+          return permission_action if permission_action.scope != :admin
+
+          # Valuators can only perform these actions
+          if user_is_valuator?
+            if valuator_assigned_to_paragraph?
+              can_create_paragraph_note?
+              can_create_paragraph_answer?
+            end
+            can_export_paragraphs?
+            valuator_can_unassign_valuator_from_paragraphs?
+
+            return permission_action
+          end
+
+          if create_permission_action?
+            can_create_paragraph_note?
+            can_create_paragraph_from_admin?
+            can_create_paragraph_answer?
+          end
+
+          # Admins can only edit official paragraphs if they are within the
+          # time limit.
+          allow! if permission_action.subject == :paragraph && permission_action.action == :edit && admin_edition_is_available?
+
+          # Every user allowed by the space can update the category of the paragraph
+          allow! if permission_action.subject == :paragraph_category && permission_action.action == :update
+
+          # Every user allowed by the space can update the scope of the paragraph
+          allow! if permission_action.subject == :paragraph_scope && permission_action.action == :update
+
+          # Every user allowed by the space can import paragraphs from another_component
+          allow! if permission_action.subject == :paragraphs && permission_action.action == :import
+
+          # Every user allowed by the space can export paragraphs
+          can_export_paragraphs?
+
+          # Every user allowed by the space can merge paragraphs to another component
+          allow! if permission_action.subject == :paragraphs && permission_action.action == :merge
+
+          # Every user allowed by the space can split paragraphs to another component
+          allow! if permission_action.subject == :paragraphs && permission_action.action == :split
+
+          # Every user allowed by the space can assign paragraphs to a valuator
+          allow! if permission_action.subject == :paragraphs && permission_action.action == :assign_to_valuator
+
+          # Every user allowed by the space can unassign a valuator from paragraphs
+          can_unassign_valuator_from_paragraphs?
+
+          # Only admin users can publish many answers at once
+          toggle_allow(user.admin?) if permission_action.subject == :paragraphs && permission_action.action == :publish_answers
+
+          if permission_action.subject == :participatory_texts && participatory_texts_are_enabled? && permission_action.action == :manage
+            # Every user allowed by the space can manage (import, update and publish) participatory texts to paragraphs
+            allow!
+          end
+
+          permission_action
+        end
+
+        private
+
+        def paragraph
+          @paragraph ||= context.fetch(:paragraph, nil)
+        end
+
+        def user_valuator_role
+          @user_valuator_role ||= space.user_roles(:valuator).find_by(user: user)
+        end
+
+        def user_is_valuator?
+          return if user.admin?
+
+          user_valuator_role.present?
+        end
+
+        def valuator_assigned_to_paragraph?
+          @valuator_assigned_to_paragraph ||=
+            Decidim::EnhancedTextwork::ValuationAssignment
+            .where(paragraph: paragraph, valuator_role: user_valuator_role)
+            .any?
+        end
+
+        def admin_creation_is_enabled?
+          current_settings.try(:creation_enabled?) &&
+            component_settings.try(:official_paragraphs_enabled)
+        end
+
+        def admin_edition_is_available?
+          return unless paragraph
+
+          (paragraph.official? || paragraph.official_meeting?) && paragraph.votes.empty?
+        end
+
+        def admin_paragraph_answering_is_enabled?
+          current_settings.try(:paragraph_answering_enabled) &&
+            component_settings.try(:paragraph_answering_enabled)
+        end
+
+        def create_permission_action?
+          permission_action.action == :create
+        end
+
+        def participatory_texts_are_enabled?
+          component_settings.participatory_texts_enabled?
+        end
+
+        # There's no special condition to create paragraph notes, only
+        # users with access to the admin section can do it.
+        def can_create_paragraph_note?
+          allow! if permission_action.subject == :paragraph_note
+        end
+
+        # Paragraphs can only be created from the admin when the
+        # corresponding setting is enabled.
+        def can_create_paragraph_from_admin?
+          toggle_allow(admin_creation_is_enabled?) if permission_action.subject == :paragraph
+        end
+
+        # Paragraphs can only be answered from the admin when the
+        # corresponding setting is enabled.
+        def can_create_paragraph_answer?
+          toggle_allow(admin_paragraph_answering_is_enabled?) if permission_action.subject == :paragraph_answer
+        end
+
+        def can_unassign_valuator_from_paragraphs?
+          allow! if permission_action.subject == :paragraphs && permission_action.action == :unassign_from_valuator
+        end
+
+        def valuator_can_unassign_valuator_from_paragraphs?
+          can_unassign_valuator_from_paragraphs? if user == context.fetch(:valuator, nil)
+        end
+
+        def can_export_paragraphs?
+          allow! if permission_action.subject == :paragraphs && permission_action.action == :export
+        end
+      end
+    end
+  end
+end