Gets view paths to load in dynamically based on whether a core or plugin tree is rendering, this allows us to store view files based on conventions for packages. Completes: U4-2849 Ensure editor views, etc... can exist outside of the /umbraco folder for package devs

src/Umbraco.Web.UI.Client/src/common/mocks/umbraco.servervariables.js

@@ -23,5 +23,10 @@ Umbraco.Sys.ServerVariables = {
         "appPluginsPath" : "/App_Plugins",
         "imageFileTypes": "jpeg,jpg,gif,bmp,png,tiff,tif"
     },
+    umbracoPlugins: {
+        trees: [
+            { alias: "myTree", packageFolder: "MyPackage" }
+        ]
+    },
     isDebuggingEnabled: true
 };

src/Umbraco.Web.UI.Client/src/common/services/navigation.service.js

@@ -364,16 +364,19 @@ angular.module('umbraco.services')
                 //by convention we will look into the /views/{treetype}/{action}.html
                 // for example: /views/content/create.html
 
-                //we will also check for a 'packageName' in metaData, if it exists, we'll look by convention in that folder
+                //we will also check for a 'packageName' for the current tree, if it exists then the convention will be:
                 // for example: /App_Plugins/{mypackage}/umbraco/{treetype}/create.html
 
-                if (args.action.metaData["packageName"]) {
+                var treeAlias = treeService.getTreeAlias(args.node);
+                var packageTreeFolder = treeService.getTreePackageFolder(treeAlias);
 
-                    templateUrl = Umbraco.Sys.ServerVariables.umbracoSettings.appPluginsPath +
-                        "/umbraco/views/" + treeService.getTreeAlias(args.node) + "/" + args.action.alias + ".html";
+                if (packageTreeFolder) {
+                    templateUrl = Umbraco.Sys.ServerVariables.umbracoSettings.appPluginsPath + 
+                        "/" + packageTreeFolder +
+                        "/umbraco/" + treeAlias + "/" + args.action.alias + ".html";
                 }
                 else {
-                    templateUrl = "views/" + treeService.getTreeAlias(args.node) + "/" + args.action.alias + ".html";
+                    templateUrl = "views/" + treeAlias + "/" + args.action.alias + ".html";
                 }
 
                 iframe = false;

src/Umbraco.Web.UI.Client/src/common/services/tree.service.js

@@ -58,6 +58,33 @@ function treeService($q, treeResource, iconHelper, notificationsService, $rootSc
             }
         },
 
+        /**
+         * @ngdoc method
+         * @name umbraco.services.treeService#getTreePackageFolder
+         * @methodOf umbraco.services.treeService
+         * @function
+         *
+         * @description
+         * Determines if the current tree is a plugin tree and if so returns the package folder it has declared
+         * so we know where to find it's views, otherwise it will just return undefined.
+         * 
+         * @param {String} treeAlias The tree alias to check
+         */
+        getTreePackageFolder: function(treeAlias) {            
+            //we determine this based on the server variables
+            if (Umbraco.Sys.ServerVariables.umbracoPlugins &&
+                Umbraco.Sys.ServerVariables.umbracoPlugins.trees &&
+                angular.isArray(Umbraco.Sys.ServerVariables.umbracoPlugins.trees)) {
+
+                var found = _.find(Umbraco.Sys.ServerVariables.umbracoPlugins.trees, function(item) {
+                    return item.alias === treeAlias;
+                });
+                
+                return found ? found.packageFolder : undefined;
+            }
+            return undefined;
+        },
+
         /** clears the tree cache */
         clearCache: function() {
             treeArray = [];

src/Umbraco.Web.UI.Client/src/routes.js

@@ -84,21 +84,34 @@ app.config(function ($routeProvider) {
             resolve: checkAuth(true)
         })
         .when('/:section/:tree/:method/:id', {
-            templateUrl: function (rp) {
-                if (!rp.tree || !rp.method) {
-                    return "views/common/dashboard.html";
+            //This allows us to dynamically change the template for this route since you cannot inject services into the templateUrl method.
+            template: "<div ng-include='templateUrl'></div>",
+            //This controller will execute for this route, then we replace the template dynamnically based on the current tree.
+            controller: function ($scope, $route, $routeParams, treeService) {
+
+                if (!$routeParams.tree || !$routeParams.method) {
+                    $scope.templateUrl = "views/common/dashboard.html";
                 }
-                
-                //TODO: Here we need to figure out if this route is for a package and if so then we need
+
+                // Here we need to figure out if this route is for a package tree and if so then we need
                 // to change it's convention view path to:
                 // /App_Plugins/{mypackage}/umbraco/{treetype}/{method}.html
                 
+                // otherwise if it is a core tree we use the core paths:
+                // views/{treetype}/{method}.html
 
-                //we don't need to put views into section folders since theoretically trees
-                // could be moved among sections, we only need folders for specific trees.
+                var packageTreeFolder = treeService.getTreePackageFolder($routeParams.tree);
+
+                if (packageTreeFolder) {
+                    $scope.templateUrl = Umbraco.Sys.ServerVariables.umbracoSettings.appPluginsPath +
+                        "/" + packageTreeFolder +
+                        "/umbraco/" + $routeParams.tree + "/" + $routeParams.method + ".html";
+                }
+                else {
+                    $scope.templateUrl = 'views/' + $routeParams.tree + '/' + $routeParams.method + '.html';
+                }
                 
-                return 'views/' + rp.tree + '/' + rp.method + '.html';
-            },
+            },            
             resolve: checkAuth(true)
         })        
         .otherwise({ redirectTo: '/login' });

src/Umbraco.Web.UI.Client/test/unit/common/services/tree-service.spec.js

@@ -40,7 +40,23 @@ describe('tree service tests', function () {
 
     beforeEach(inject(function ($injector) {
         treeService = $injector.get('treeService');
-    })); 
+    }));
+
+    describe('lookup plugin based trees', function() {
+
+        it('can find a plugin based tree', function () {
+            //we know this exists in the mock umbraco server vars
+            var found = treeService.getTreePackageFolder("myTree");
+            expect(found).toBe("MyPackage");
+        });
+        
+        it('returns undefined for a not found tree', function () {
+            //we know this exists in the mock umbraco server vars
+            var found = treeService.getTreePackageFolder("asdfasdf");
+            expect(found).not.toBeDefined();
+        });
+
+    });
 
     describe('query existing node structure of the tree', function () {