From 394572a8fc8a049e2ad5f52f1e51c8488388438e Mon Sep 17 00:00:00 2001
From: kjac <kja@vertica.dk>
Date: Sat, 23 Apr 2016 10:14:56 +0200
Subject: [PATCH] Yet another stab at fixing it

By tracking the fieldsets that have been expanded (loaded), we can make
sure the submit watchers fire appropriately, even when the fieldsets are
collapsed down again.

Apart from hopefully fixing the publishing issues for collapsed
fieldsets, this also adds a performance gain if the users expand and
collapse the same fieldsets more than once, since the fieldsets now only
load the first time they're expanded (instead of every time).

This also - at least partially - fixes the validation issue #325
introduced by #301
---
 app/controllers/controller.js            | 17 +++++++++++++++--
 app/directives/archetypesubmitwatcher.js |  5 ++---
 app/views/archetype.default.html         | 11 +++++------
 3 files changed, 22 insertions(+), 11 deletions(-)

diff --git a/app/controllers/controller.js b/app/controllers/controller.js
index 61092a0..f690129 100644
--- a/app/controllers/controller.js
+++ b/app/controllers/controller.js
@@ -364,6 +364,12 @@ angular.module("umbraco").controller("Imulus.ArchetypeController", function ($sc
         return fieldset.collapse;
     }
 
+    // added to track loaded fieldsets 
+    $scope.loadedFieldsets = [];
+    $scope.isLoaded = function (fieldset) {
+        return $scope.loadedFieldsets.indexOf(fieldset) >= 0;
+    }
+
     //helper for expanding/collapsing fieldsets
     $scope.focusFieldset = function(fieldset){
         fixDisableSelection();
@@ -386,12 +392,14 @@ angular.module("umbraco").controller("Imulus.ArchetypeController", function ($sc
         if(!fieldset && $scope.model.value.fieldsets.length == 1)
         {
             $scope.model.value.fieldsets[0].collapse = false;
+            $scope.loadedFieldsets.push($scope.model.value.fieldsets[0]);
             return;
         }
 
         if(iniState && fieldset)
         {
             fieldset.collapse = !iniState;
+            $scope.loadedFieldsets.push(fieldset);
         }
     }
 
@@ -448,6 +456,9 @@ angular.module("umbraco").controller("Imulus.ArchetypeController", function ($sc
         // reset submit watcher counter on save
         $scope.activeSubmitWatcher = 0;
 
+        // init loaded fieldsets tracking
+        $scope.loadedFieldsets = _.where($scope.model.value.fieldsets, { collapse: false });
+
         // create properties needed for the backoffice to work (data that is not serialized to DB)
         addCustomProperties($scope.model.value.fieldsets);
     });
@@ -563,13 +574,15 @@ angular.module("umbraco").controller("Imulus.ArchetypeController", function ($sc
         $scope.$broadcast("archetypeFormSubmitting", args);
     }
 
-    $scope.saveCustomFieldsetProperties = function () {
+    // we'll use our own "archetypeFormSubmitting" event to save custom properties, as at least some 
+    // of the editors store their values back to the model on the core "formSubmitting" event
+    $scope.$on("archetypeFormSubmitting", function (ev, args) {
         _.each($scope.model.value.fieldsets, function (fieldset) {
             // extract the publish configuration from the fieldsets (and convert local datetimes to UTC)
             fieldset.releaseDate = toUtc(fieldset.releaseDateModel.value);
             fieldset.expireDate = toUtc(fieldset.expireDateModel.value);
         });
-    }
+    });
 
     function toUtc(date) {
         if (!date) {
diff --git a/app/directives/archetypesubmitwatcher.js b/app/directives/archetypesubmitwatcher.js
index dab7c84..3311e6c 100644
--- a/app/directives/archetypesubmitwatcher.js
+++ b/app/directives/archetypesubmitwatcher.js
@@ -5,7 +5,7 @@ angular.module("umbraco.directives").directive('archetypeSubmitWatcher', functio
 
         scope.$on("formSubmitting", function (ev, args) {
             // on the "formSubmitting" event, call the submit callback on scope to notify the Archetype controller to do it's magic
-            if (id == scope.activeSubmitWatcher || scope.forceSubmitCallback) {
+            if (id == scope.activeSubmitWatcher) {
                 scope.submitCallback(args);
             }
         });
@@ -19,8 +19,7 @@ angular.module("umbraco.directives").directive('archetypeSubmitWatcher', functio
         scope: {
             loadCallback: '=',
             submitCallback: '=',
-            activeSubmitWatcher: '=',
-            forceSubmitCallback: '='
+            activeSubmitWatcher: '='
         }
     }
 });
\ No newline at end of file
diff --git a/app/views/archetype.default.html b/app/views/archetype.default.html
index 70bb84f..8a661db 100644
--- a/app/views/archetype.default.html
+++ b/app/views/archetype.default.html
@@ -6,8 +6,7 @@
             <fieldset ng-class="['archetype-fieldset-' + fieldset.alias, (getFieldsetValidity(fieldset) == false ? 'archetypeFieldsetError' : '')]" ng-init="fieldsetConfigModel = getConfigFieldsetByAlias(fieldset.alias)">
                 <div class="archetypeFieldsetLabel" ng-class="{enableCollapsing: model.config.enableCollapsing}">
                     <div ng-click="focusFieldset(fieldset)" class="label-sub module-label">
-                        <span class="caret" ng-hide="fieldset.collapse || !model.config.enableCollapsing"></span>
-                        <span class="caret caret-right" ng-show="fieldset.collapse && model.config.enableCollapsing"></span>
+                        <span class="caret" ng-class="{'caret-right': isCollapsed(fieldset)}" ng-show="model.config.enableCollapsing"></span>
                         <label ng-class="{dimmed: isDisabled(fieldset)}">
                             <i class="fieldsetIcon icon ng-class:fieldsetConfigModel.icon"></i>
                             <span ng-bind="getFieldsetTitle(fieldsetConfigModel, $index)"></span>
@@ -22,7 +21,7 @@
                         <i class="icon icon-delete" ng-click="removeRow($index)" ng-show="canRemove()"></i>
                     </div>
                 </div>
-                <div class="archetypeCollapser animate-hide" ng-hide="model.config.enableCollapsing && isCollapsed(fieldset)" ng-if="!isCollapsed(fieldset)">
+                <div class="archetypeCollapser animate-hide" ng-hide="model.config.enableCollapsing && isCollapsed(fieldset)" ng-if="isLoaded(fieldset)">
                     <form class="form-inline">
                         <div ng-class="[('archetype-property-' + property.alias), (getPropertyValidity($parent.$index, property.alias) === false ? 'archetypePropertyError' : '')]" class="archetypeProperty control-group" ng-repeat="property in fieldsetConfigModel.properties">
                             <label ng-hide="model.config.hidePropertyLabels == '1'" class="control-label" for="archetype-property-{{model.alias}}-f{{$parent.$index}}-{{property.alias}}-p{{$index}}" ng-attr-title="{{ isDebuggingEnabled || model.config.developerMode ? property.alias : null }}">
@@ -47,7 +46,7 @@
                             </div>
                             <div class="settings" ng-show="showSettings">
                                 <!-- misc fieldset settings go here -->
-                                <div ng-show="canPublish()">
+                                <div ng-if="fieldset.releaseDateModel" ng-show="canPublish()">
                                     <label ng-hide="model.config.hidePropertyLabels == '1'" class="control-label">
                                         <span><archetype-localize key="publish">Publishing</archetype-localize></span>
                                         <div class="archetypeFieldsetHelpText">
@@ -67,6 +66,8 @@
                                             </label>
                                             <umb-editor model="fieldset.expireDateModel"></umb-editor>
                                         </div>
+                                        <!-- we need a submit watcher here to make sure the publish dates are saved back to their models -->
+                                        <archetype-submit-watcher active-submit-watcher="activeSubmitWatcher" load-callback="submitWatcherOnLoad" submit-callback="submitWatcherOnSubmit"></archetype-submit-watcher>
                                     </div>
                                 </div>
                             </div>
@@ -76,8 +77,6 @@
             </fieldset>
         </li>
     </ul>
-    <!-- add a submit watcher to make sure the saveCustomFieldsetProperties gets called after formSubmitting -->
-    <archetype-submit-watcher submit-callback="saveCustomFieldsetProperties" force-submit-callback="true"></archetype-submit-watcher>
     <div ng-show="showAddButton()">
         <a class="archetypeAddButton" ng-click="openFieldsetPicker(0, $event)" prevent-default>
             <i class="icon icon-add"></i>