Unpublish dialog scaffolding

src/Umbraco.Web.UI.Client/src/common/directives/components/content/edit.controller.js

@@ -325,6 +325,29 @@
             });
         }
 
+        $scope.unPublish = function() {
+            clearNotifications($scope.content);
+            if (formHelper.submitForm({ scope: $scope, action: "unpublish", skipValidation: true })) {
+                var dialog = {
+                    parentScope: $scope,
+                    view: "views/content/overlays/unpublish.html",
+                    variants: $scope.content.variants, //set a model property for the dialog
+                    skipFormValidation: true, //when submitting the overlay form, skip any client side validation
+                    submitButtonLabelKey: "content_unPublish",
+                    submit: function (model) {
+                        model.submitButtonState = "busy";
+                        clearNotifications($scope.content);
+                        // TODO: do some unpublishing here
+                    },
+                    close: function () {
+                        overlayService.close();
+                    }
+                };
+                overlayService.open(dialog);
+            }
+        };
+
+        /*
         $scope.unPublish = function () {
 
             //if there's any variants than we need to set the language and include the variants to publish
@@ -370,6 +393,7 @@
             }
 
         };
+        */
 
         $scope.sendToPublish = function () {
             clearNotifications($scope.content);

src/Umbraco.Web.UI.Client/src/views/content/overlays/unpublish.controller.js

@@ -0,0 +1,62 @@
+(function () {
+    "use strict";
+
+    function UnpublishController($scope, localizationService) {
+
+        var vm = this;
+        vm.loading = true;
+
+        vm.changeSelection = changeSelection;
+        vm.publishedVariantFilter = publishedVariantFilter;
+        vm.unpublishedVariantFilter = unpublishedVariantFilter;
+
+        function onInit() {
+
+            vm.variants = $scope.model.variants;
+
+            // set dialog title
+            if (!$scope.model.title) {
+                localizationService.localize("content_unPublish").then(function (value) {
+                    $scope.model.title = value;
+                });
+            }
+
+            vm.loading = false;
+            
+        }
+
+        function changeSelection() {
+            var firstSelected = _.find(vm.variants, function (v) {
+                return v.unpublish;
+            });
+            $scope.model.disableSubmitButton = !firstSelected; //disable submit button if there is none selected
+        }
+
+        function publishedVariantFilter(variant) {
+            //determine a variant is 'published' (meaning it will show up as able unpublish)
+            // * it has been published
+            // * it has been published with pending changes
+            return (variant.state === "Published" || variant.state === "PublishedPendingChanges");
+        }
+
+        function unpublishedVariantFilter(variant) {
+            //determine a variant is 'modified' (meaning it will NOT show up as able to unpublish)
+            // * it's editor is in a $dirty state
+            // * it is published with pending changes
+            return (variant.state !== "Published" && variant.state !== "PublishedPendingChanges");
+        }
+
+        //when this dialog is closed, reset all 'unpublish' flags
+        $scope.$on('$destroy', function () {
+            for (var i = 0; i < vm.variants.length; i++) {
+                vm.variants[i].unpublish = false;
+            }
+        });
+
+        onInit();
+
+    }
+
+    angular.module("umbraco").controller("Umbraco.Overlays.UnpublishController", UnpublishController);
+
+})();

src/Umbraco.Web.UI.Client/src/views/content/overlays/unpublish.html

@@ -0,0 +1,69 @@
+<div ng-controller="Umbraco.Overlays.UnpublishController as vm">
+
+    <div style="margin-bottom: 15px;">
+        <p><localize key="content_languagesToUnpublish"></localize></p>
+    </div>
+
+    <div ng-if="vm.loading" style="min-height: 50px; position: relative;">
+        <umb-load-indicator></umb-load-indicator>
+    </div>
+
+    <div class="umb-list umb-list--condensed" ng-if="!vm.loading">
+
+        <div class="umb-list-item" ng-repeat="variant in vm.variants | filter:vm.publishedVariantFilter">
+            <ng-form name="unpublishVariantSelectorForm">
+                <div class="flex">
+                    <input id="{{variant.htmlId}}"
+                            name="unpublishVariantSelector"
+                            type="checkbox"
+                            ng-model="variant.unpublish"
+                            ng-change="vm.changeSelection(variant)"
+                            style="margin-right: 8px;"
+                            val-server-field="{{variant.htmlId}}" />
+                    <div>
+                        <label for="{{variant.htmlId}}" style="margin-bottom: 2px;">
+                            <span>{{ variant.language.name }}</span>
+                            <strong ng-if="variant.language.isMandatory" class="umb-control-required">*</strong>
+                        </label>
+
+                        <div ng-if="!publishVariantSelectorForm.publishVariantSelector.$invalid && !(variant.notifications && variant.notifications.length > 0)">
+                            <umb-variant-state class="umb-permission__description" variant="variant"></umb-variant-state>
+                        </div>
+
+                        <div ng-messages="publishVariantSelectorForm.publishVariantSelector.$error" show-validation-on-submit>
+                            <div class="umb-permission__description" style="color: #F02E28;" ng-message="valServerField">{{publishVariantSelectorForm.publishVariantSelector.errorMsg}}</div>
+                        </div>
+
+                        <div ng-repeat="notification in variant.notifications">
+                            <div class="umb-permission__description" style="color: #1FB572;">{{notification.message}}</div>
+                        </div>
+
+                    </div>
+                </div>
+
+            </ng-form>
+        </div>
+        <br />
+    </div>
+
+    <div class="umb-list umb-list--condensed" ng-if="!vm.loading && (vm.variants | filter:vm.unpublishedVariantFilter).length > 0">
+        <div style="margin-bottom: 15px; font-weight: bold;">
+            <p><localize key="content_unpublishedLanguages"></localize></p>
+        </div>
+
+        <div class="umb-list-item" ng-repeat="variant in vm.variants | filter:vm.unpublishedVariantFilter">
+            <div>
+                <div style="margin-bottom: 2px;">
+                    <span>{{ variant.language.name }}</span>
+                    <strong ng-if="variant.language.isMandatory" class="umb-control-required">*</strong>
+                </div>
+
+                <div>
+                    <umb-variant-state class="umb-permission__description" variant="variant"></umb-variant-state>
+                </div>
+            </div>
+        </div>
+    </div>
+
+</div>
+    

src/Umbraco.Web.UI/Umbraco/config/lang/en_us.xml

@@ -266,7 +266,9 @@
         <key alias="languagesToPublish">What languages would you like to publish?</key>
         <key alias="languagesToSave">What languages would you like to save?</key>
         <key alias="languagesToSendForApproval">What languages would you like to send for approval?</key>
+        <key alias="languagesToUnpublish">What languages would you like to unpublish?</key>
         <key alias="publishedLanguages">Published Languages</key>
+        <key alias="unpublishedLanguages">Unpublished Languages</key>
         <key alias="unmodifiedLanguages">Unmodified Languages</key>
         <key alias="readyToPublish">Ready to Publish?</key>
         <key alias="readyToSave">Ready to Save?</key>