diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/grid/grid.rte.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/grid/grid.rte.directive.js index e18137085b..5a68d36bc1 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/grid/grid.rte.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/grid/grid.rte.directive.js @@ -1,5 +1,5 @@ angular.module("umbraco.directives") - .directive('gridRte', function (tinyMceService, stylesheetResource, angularHelper, assetsService, $q, $timeout) { + .directive('gridRte', function (tinyMceService, stylesheetResource, angularHelper, assetsService, $q, $timeout, eventsService) { return { scope: { uniqueId: '=', @@ -362,8 +362,16 @@ angular.module("umbraco.directives") // tinyMceEditor.fire('LoadContent', null); //}; + + var tabShownListener = eventsService.on("valTab.tabShown", function (e, args) { + //the tab has been shown, trigger the mceAutoResize (as it could have timed out before the tab was shown) + if (tinyMceEditor !== undefined && tinyMceEditor != null) { + tinyMceEditor.execCommand('mceAutoResize', false, null, null); + } + }); + //listen for formSubmitting event (the result is callback used to remove the event subscription) - var unsubscribe = scope.$on("formSubmitting", function () { + var formSubmittingListener = scope.$on("formSubmitting", function () { //TODO: Here we should parse out the macro rendered content so we can save on a lot of bytes in data xfer // we do parse it out on the server side but would be nice to do that on the client side before as well. scope.value = tinyMceEditor ? tinyMceEditor.getContent() : null; @@ -373,7 +381,8 @@ angular.module("umbraco.directives") // NOTE: this is very important otherwise if this is part of a modal, the listener still exists because the dom // element might still be there even after the modal has been hidden. scope.$on('$destroy', function () { - unsubscribe(); + formSubmittingListener(); + eventsService.unsubscribe(tabShownListener); if (tinyMceEditor !== undefined && tinyMceEditor != null) { tinyMceEditor.destroy() } diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/validation/valtab.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/validation/valtab.directive.js index 8d1fc60083..c5d7cb6e58 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/validation/valtab.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/validation/valtab.directive.js @@ -6,15 +6,15 @@ * @description Used to show validation warnings for a tab to indicate that the tab content has validations errors in its data. * In order for this directive to work, the valFormManager directive must be placed on the containing form. **/ -function valTab() { +function valTab(eventsService) { return { require: ['^form', '^valFormManager'], restrict: "A", link: function (scope, element, attr, ctrs) { var valFormManager = ctrs[1]; - var tabId = "tab" + scope.tab.id; - scope.tabHasError = false; + var tabId = "tab" + scope.tab.id; + scope.tabHasError = false; //listen for form validation changes valFormManager.onValidationStatusChanged(function (evt, args) { @@ -31,8 +31,17 @@ function valTab() { scope.tabHasError = false; } }); + var tabShownFunc = function (e) { + var tabContent = element.closest(".umb-panel").find("#" + tabId); + eventsService.emit('valTab.tabShown', { originalEvent: e, tab: scope.tab, content: tabContent }); + }; + var anchorElement = element.find("a[data-toggle='tab']"); + anchorElement.on('shown.bs.tab', tabShownFunc); + scope.$on('$destroy', function () { + anchorElement.off('shown.bs.tab', tabShownFunc); + }); } }; } -angular.module('umbraco.directives.validation').directive("valTab", valTab); \ No newline at end of file +angular.module('umbraco.directives.validation').directive("valTab", valTab);