[Fixes: #7033] Mandatory fields in editor (#7038)

GeoNode · Mar 9, 2021 · 9d709e8 · 9d709e8
1 parent 4f64450
commit 9d709e8
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 12 deletions.
diff --git a/geonode/context_processors.py b/geonode/context_processors.py
@@ -192,6 +192,7 @@ def resource_urls(request):
         GEONODE_APPS_ENABLE=getattr(settings, 'GEONODE_APPS_ENABLE', False),
         GEONODE_APPS_NAME=getattr(settings, 'GEONODE_APPS_NAME', 'Apps'),
         GEONODE_APPS_NAV_MENU_ENABLE=getattr(settings, 'GEONODE_APPS_NAV_MENU_ENABLE', False),
-        CATALOG_METADATA_TEMPLATE=getattr(settings, "CATALOG_METADATA_TEMPLATE", "catalogue/full_metadata.xml")
+        CATALOG_METADATA_TEMPLATE=getattr(settings, "CATALOG_METADATA_TEMPLATE", "catalogue/full_metadata.xml"),
+        UI_REQUIRED_FIELDS=getattr(settings, "UI_REQUIRED_FIELDS", [])
     )
     return defaults
diff --git a/geonode/layers/templates/layouts/panels.html b/geonode/layers/templates/layouts/panels.html
@@ -239,9 +239,19 @@
   <div class="advanced-hint progress-bar" role="progressbar" style="width:25%">
     {% trans "Mandatory" %}
   </div>
-  <div class="progress-bar" role="progressbar" style="width:50%">
-    {% trans "Optional" %}
-  </div>
+  {% if UI_REQUIRED_FIELDS %}
+      <div class="metadata-hint progress-bar" role="progressbar" style="width:25%">
+        {% trans "Mandatory" %}
+      </div>
+      <div class="progress-bar" role="progressbar" style="width:25%">
+        {% trans "Optional" %}
+      </div>
+  {% else %}
+      <div class="progress-bar" role="progressbar" style="width:50%">
+        {% trans "Optional" %}
+      </div>
+  {% endif %}
+
 </div>
 {% endblock edit_progress %}
  {% block breadcrumbs %}
@@ -253,7 +263,11 @@
           <a>{% trans "Location and Licenses" %}</a>
       </li>
       <li data-step="3" data-toggle="tab" href="#ownership">
-          <a>{% trans "Optional Metadata" %}</a>
+        {% if UI_REQUIRED_FIELDS %}
+            <a>{% trans "Required Metadata" %}</a>
+        {% else %}
+            <a>{% trans "Optional Metadata" %}</a>
+        {% endif %}
       </li>
       <li data-step="4"  data-toggle="tab" href="#dataset">
           <a>{% trans "Dataset Attributes" %}</a>
@@ -448,7 +462,7 @@
     {% block ownership %}
     <div id="ownership" class="tab-pane fade">
         <div class="panel-group"><div class="panel panel-default"><div class="panel-body">
-        <div>
+        <div id="mdinfo">
             <div class="col-xs-12 col-lg-4">
               <p>{% trans "Other, Optional, Metadata" %}</p>
                 <div>
@@ -468,14 +482,14 @@
                 </div>
             </div>
             <div class="col-xs-12 col-lg-5">
-                    <div class="col-xs-12 col-lg-6">
+                    <div class="col-xs-12 col-lg-6 check-select">
                       <div class="input-group date">
                         <span><label for="{{ layer_form.temporal_extent_start|id }}">{{ layer_form.temporal_extent_start.label }}</label></span>
                         <!--<p class="xxs-font-size">(When a given event occurred on the resource)</p>-->
                         {{ layer_form.temporal_extent_start }}
                         </div>
                     </div>
-                    <div class="col-xs-12 col-lg-6">
+                    <div class="col-xs-12 col-lg-6 check-select">
                         <div class="input-group date">
                         <span><label for="{{ layer_form.temporal_extent_end|id }}">{{ layer_form.temporal_extent_end.label }}</label></span>
                         <!--<p class="xxs-font-size">(Identification of when a given event occurred)</p>-->
@@ -498,7 +512,7 @@
             <div class="col-xs-12 col-lg-3">
               <div class="panel panel-default" style="margin-top: 5px">
                   <div class="panel-heading">{% trans "Responsible Parties" %}</div>
-                  <div class="panel-body">
+                  <div class="panel-body check-select">
                       <span><label for="{{ layer_form.poc|id }}">{{ layer_form.poc.label }}</label></span>
                       {{ layer_form.poc }}
                   </div>

diff --git a/geonode/templates/metadata_form_js.html b/geonode/templates/metadata_form_js.html
@@ -91,6 +91,26 @@
             }
             advancedMissing = empty > 0;
           }
+
+        {% if UI_REQUIRED_FIELDS %}
+         var advancedMissing = $('#ownership').find('.input-empty').length > 0;
+          if (advancedMissing) {
+            var inputs = $('#ownership').find('.input-empty');
+            var empty = inputs.length;
+            for (var i=0; i<inputs.length; i++) {
+              if (typeof inputs[i].value !== undefined && inputs[i].value !== '') {
+                empty--;
+              }
+            }
+            advancedMissing = empty > 0;
+          }
+          $('#completeness-hints .metadata-hint')
+            .toggleClass('progress-bar-danger', mandatoryMissing)
+            .toggleClass('progress-bar-success', !mandatoryMissing)
+            .attr('title', mandatoryMissing ? gettext("some schema mandatory fields are missing") : gettext("Metadata Schema mandatory fields completed") )
+            .tooltip('fixTitle');
+        {% endif %}
+
       $('#completeness-hints .mandatory-hint')
         .toggleClass('progress-bar-danger', mandatoryMissing)
         .toggleClass('progress-bar-success', !mandatoryMissing)
@@ -224,7 +244,7 @@
         {% block target %}
           if(target.id === 'category_form' ||
              target.id === 'id_resource-regions' ||
-             target.id === 'id_resource-group'
+             target.id === 'id_resource-group' || {{UI_REQUIRED_FIELDS}}.includes(target.id)
           ) {
               // group selector
               $(target).closest('#basicGroupInfo').toggleClass('has-error', empty);
@@ -307,8 +327,11 @@
                 if(!$(e.target).hasClass("input-empty")){
                     if(isMandatoryField(this)) {
                         setInputEmpty(e.target, true);
-                        if(!!$(this).closest('#mdinfo').length) {
-                            $(e.target).parent().append(gettext("<p class='xxs-font-size mandatory-warning'>&nbsp;&nbsp;&nbsp;<strong>{% trans "* Field declared Mandatory by the Metadata Schema" %}</strong></p>"));
+                        var mandatoryWarning = "<p class='xxs-font-size mandatory-warning'>&nbsp;&nbsp;&nbsp;<strong>{% trans "* Field declared Mandatory by the Metadata Schema" %}</strong></p>"
+                        if (!!$(this).closest('.check-select').length) {
+                            $(e.target).parent().parent().append(gettext(mandatoryWarning));
+                        } else if (!!$(this).closest('#mdinfo').length) {
+                            $(e.target).parent().append(gettext(mandatoryWarning));
                         }
                         empty++;
                     }
@@ -337,6 +360,7 @@
         };
         {% endblock onInputChange %}
         {% block trigger_onInputChange %}
+        {{UI_REQUIRED_FIELDS}}.forEach(element => $('#' + element).change(onInputChange).change());
         $('#category_form').change(onInputChange).change();
         $('#id_resource-group').change(onInputChange).change();
         document.querySelector('select[name="resource-keywords"]').onchange=onInputChange