The previous post (Building an Umbraco 7 backoffice extension – Part I), demonstrated how easy it is to create a new section in Umbraco’s backoffice. This post will show how we can populate this new section with meaningful content coming directly from the backoffice.

To begin with, we must reference a few more assemblies (also available at the Umbraco’s installation bin directory):

  • umbraco.dll
  • cms.dll
  • Umbraco.Core.dll
  • System.Web.Http
  • System.Net.Http.Formatting

Then we can populate our section with a tree containing content awaiting approval. To accomplish this we must extend an Umbraco class named TreeController and decorate it with information about our Approve It plugin:


[Tree("approveIt", "approvalTree", "Content for Approval")]
[PluginController("ApproveIt")]
public class ApprovalTreeController : TreeController
{
   protected override TreeNodeCollection GetTreeNodes(string id, FormDataCollection queryStrings)
   {
       var ctrl = new ApprovalApiController();
       var nodes = new TreeNodeCollection();

       IUser user = UmbracoContext.Security.CurrentUser;

       //check if we're rendering the root node's children
       if (id == Constants.System.Root.ToInvariantString())
       {
           foreach (IContent content in ctrl.GetAll(user))
           {
                var node = CreateTreeNode(
                    content.Id.ToString(),
                    "-1",
                    queryStrings,
                    content.Name,
                    "icon-document",
                    false);

               nodes.Add(node);
            }
       }

        return nodes;
    }

    protected override MenuItemCollection GetMenuForNode(string id, FormDataCollection queryStrings)
    {
        var menu = new MenuItemCollection();

        if (id == Constants.System.Root.ToInvariantString())
        {
            // root actions
            menu.Items.Add<RefreshNode, ActionRefresh>(
                ApplicationContext.Services.TextService.Localize(ActionRefresh.Instance.Alias));
        }

        return menu;
    }
}

To create a tree we must implement two methods:

  1. GetTreeNodes: in here we call the GetAll method of the ApprovalApiController that we’ll create in the following. This GetAll method returns a list of content waiting approval and we just iterate through it all and create tree nodes;
  2. GetMenuForNode: presents a dropdown menu when we right click the root node to refresh the list.

Next we create our custom WebAPI and name it ApprovalApiController. For it to be available in our site, we need only extend the UmbracoAuthorizedJsonController.


[PluginController("ApproveIt")]
public class ApprovalApiController : UmbracoAuthorizedJsonController
{
    public IList<IContent> UnpublishedContent { get; set; }

    public IEnumerable<IContent> GetAll(IUser user)
    {
        UnpublishedContent = new List<IContent>();

        IList<IContent> root = ApplicationContext.Services.ContentService.GetRootContent().ToList();

        foreach (IContent content in root)
        {
            GetNode(content);
        }

        return UnpublishedContent;
    }

    private void GetNode(IContent node)
    {
        if (!node.Published)
        {
            UnpublishedContent.Add(node);
        }

        foreach (IContent child in ApplicationContext.Services.ContentService.GetChildren(node.Id))
        {
            GetNode(child);
        }
    }
}

The GetAll method, iterates through all the nodes in the content section and finds the ones that are not published, that is, that are waiting approval.

With these two classes we are able to populate our section with a tree containing the content nodes that are waiting approval:

approveit2

The next post in the series will show how to create the Angular view and controller that will enable content managers to actually manage the content waiting approval.

The Approve It extension can be found here: https://our.umbraco.org/projects/backoffice-extensions/approve-it/. The complete source code can be found here: https://github.com/ViGiLnT/ApproveIt.

LEAVE A REPLY

Please enter your comment!
Please enter your name here